@font-face {
    font-family: 'Lato';
    src: url('../Content/fonts/Lato/Lato-Heavy.eot');
    src: url('../Content/fonts/Lato/Lato-Heavy.eot') format('embedded-opentype'),url('../Content/fonts/Lato/Lato-Heavy.woff') format('woff'),url('../Content/fonts/Lato/Lato-Heavy.ttf') format('truetype'),url('../Content/fonts/Lato/Lato-Heavy.svg#LatoHeavy') format('svg');
    font-weight: 900;
}

@font-face {
    font-family: 'Lato';
    src: url('../Content/fonts/Lato/LatoBlack.eot');
    src: url('../Content/fonts/Lato/LatoBlack.eot') format('embedded-opentype'),url('../Content/fonts/Lato/LatoBlack.woff') format('woff'),url('../Content/fonts/Lato/LatoBlack.ttf') format('truetype'),url('../Content/fonts/Lato/LatoBlack.svg#LatoBlack') format('svg');
    font-weight: 800;
}

@font-face {
    font-family: 'Lato';
    src: url('../Content/fonts/Lato/LatoBold.eot');
    src: url('../Content/fonts/Lato/LatoBold.eot') format('embedded-opentype'),url('../Content/fonts/Lato/LatoBold.woff') format('woff'),url('../Content/fonts/Lato/LatoBold.ttf') format('truetype'),url('../Content/fonts/Lato/LatoBold.svg#LatoBold') format('svg');
    font-weight: 700;
}

@font-face {
    font-family: 'Lato';
    src: url('../Content/fonts/Lato/LatoRegular.eot');
    src: url('../Content/fonts/Lato/LatoRegular.eot') format('embedded-opentype'),url('../Content/fonts/Lato/LatoRegular.woff') format('woff'),url('../Content/fonts/Lato/LatoRegular.ttf') format('truetype'),url('../Content/fonts/Lato/LatoRegular.svg#LatoRegular') format('svg');
}

@font-face {
    font-family: 'Lato';
    src: url('../Content/fonts/Lato/Lato-Semibold.eot');
    src: url('../Content/fonts/Lato/Lato-Semibold.eot?#iefix') format('embedded-opentype'),url('../Content/fonts/Lato/Lato-Semibold.woff') format('woff'),url('../Content/fonts/Lato/Lato-Semibold.ttf') format('truetype'),url('../Content/fonts/Lato/Lato-Semibold.svg#Lato-Semibold') format('svg');
    font-weight: 600;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../Content/fonts/Lato/Lato-Medium.eot');
    src: url('../Content/fonts/Lato/Lato-Medium.eot?#iefix') format('embedded-opentype'),url('../Content/fonts/Lato/Lato-Medium.woff') format('woff'),url('../Content/fonts/Lato/Lato-Medium.ttf') format('truetype'),url('../Content/fonts/Lato/Lato-Medium.svg#Lato-Medium') format('svg');
    font-weight: 500;
    font-style: normal;
}

@font-face {
    font-family: 'Lato';
    src: url('../Content/fonts/Lato/Lato-Light.eot');
    src: url('../Content/fonts/Lato/Lato-Light.eot?#iefix') format('embedded-opentype'),url('../Content/fonts/Lato/Lato-Light.woff') format('woff'),url('../Content/fonts/Lato/Lato-Light.ttf') format('truetype'),url('../Content/fonts/Lato/Lato-Light.svg#Lato-Medium') format('svg');
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "amiri";
    src: url("../Content/fonts/Amiri/Amiri-Bold.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "amiri";
    src: url("../Content/fonts/Amiri/Amiri-Regular.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "amiri";
    src: url("../Content/fonts/Amiri/Amiri-Regular.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}


#manage-help {
    z-index: 9000;
}

@media screen and (max-width:767px) {
    .switch {
        height: 48px !important;
        width: 124px !important;
        vertical-align: middle;
        margin: 10px 5px
    }

    .proctoring-log-content .switching-view i {
        display: inline-block !important;
        vertical-align: middle
    }

    input:checked + .slider:before {
        transform: translatex(76px) !important;
    }

    .proctoring-log-content .switching-view {
        height: auto !important;
    }

    .bar-info, .tabs_controll li, .tabs_controll li.nav-item a {
        font-size: 13px !important;
    }

    .table-icon-links {
        text-align: right !important;
    }
}

@media screen and (max-width:1024px) {
    body.modal-open .ui-tooltip {
        display: none;
    }
}

input[type=number]::-webkit-inner-spin-button,
input[type=number]::-webkit-outer-spin-button {
    opacity: 1;
}

div#assignToolsDataGrid div.jtable-main-container table.jtable {
    table-layout: fixed !important;
}
/*
.container-fluid {
    max-width: 1464px
}
*/
body {
    font-family: 'Lato';
    font-size: 12px;
    min-height: 100vh;
    color: #535353;
    display: flex;
    background: #d7ece3;
}

.nodatafound {
    font-weight: bold;
    margin: 0 0 0 57px;
}

.relative {
    position: relative
}

.wrapper {
    width: calc(100% - 102px);
    min-height: 100vh;
}

.text-left {
    text-align: left !important;
}

.text-left-input {
    text-align: left !important;
    direction: ltr;
}

.text-right-input {
    text-align: right !important;
    direction: rtl;
}

a, button {
    outline: none !important;
    box-shadow: none !important;
}

.fw-bold {
    font-weight: bold
}

.f-14 {
    font-size: 14px
}

.f-16 {
    font-size: 16px
}

a {
    cursor: pointer;
    color: #1e74b1;
}

ul {
    list-style-type: none;
    margin: 0;
    padding: 0;
}

    ul li {
        display: inline-block;
    }

input, select, textarea {
    width: 100%;
    border: 1px solid #b6b6b6 !important;
    height: 38px;
    padding: 7px 10px;
    background: #FFF;
    border-radius: 0 !important;
    font-size: 12px !important;
    color: #000 !important;
    box-shadow: none !important;
    outline: 0 !important;
}

.no-wrap {
    white-space: nowrap
}

.bootBoxErrorMessage span {
    font-size: medium !important;
}

.bootBoxErrorMessage button {
    background-color: red !important;
    font-size: medium !important;
}

.bootBoxErrorMsg button {
    font-size: medium !important;
}

.ApplyRedColorText {
    color: red !important;
}

.ApplyGreenColorText {
    color: green !important;
}

#hObtainMarksWeightage {
    width: 113px !important;
}

.bootBoxSuccessMessage span, h2 {
    font-size: medium !important;
}

.bootbox-confirm .bootbox-body {
    font-size: medium !important;
}

.bootBoxSuccessMessage button {
    background-color: green !important;
    font-size: medium !important;
}

.bootBoxSuccessMsg button {
    font-size: medium !important;
}

.bootBoxConfirmMessage span, h2 {
    font-size: medium !important;
}

.bootBoxConfirmMessage button {
    font-size: medium !important;
}

.bootBoxConfirmMsg span, h2 {
    font-size: medium !important;
}

.bootBoxConfirmMsg button {
    font-size: medium !important;
}

.custom-select {
    background: #FFF url("../Content/images/select-icon.png") no-repeat !important;
    background-position: calc(100% - 10px) center !important;
}

.role-custom-select {
    background: url(../Content/images/accordian_arrow_open.png) no-repeat;
    background-position: right 56%;
    padding-right: 20px !important;
}

input[type="radio"], input[type="checkbox"] {
    width: auto !important;
    height: auto !important;
    display: inline-block;
    vertical-align: middle;
}

label.single {
    line-height: 34px
}

textarea {
    min-height: 100px
}

:required {
    background: #FFF url(../Content/images/asterisk-small.png) no-repeat;
    background-position: right top;
}

.topbar {
    background: #2c3e50;
    padding: 0px 20px;
    position: relative;
    z-index: 1100;
}

.modal-open .topbar {
    z-index: 1000;
}

.modal-backdrop {
    display: none;
}

.blockUI.blockOverlay {
    z-index: 9999 !important; /*1060*/
}

.topbar .row > div {
    padding: 0;
}

.topbar img {
    display: inline-block;
    vertical-align: middle;
    margin-right: 5px;
    /*requested by Mr. Faisal*/
    /*width: 11px;
        height: 13px;*/
}

.topbar a {
    padding: 7px 7px;
    border-right: 1px solid #192634;
    font-size: 11px;
    color: #FFF !important;
    font-weight: normal;
    display: block;
    margin: 0 !important;
    text-decoration: none !important;
}

.megamenu li div ul li a {
    color: #2c3e50 !important;
    border: none;
    padding: 0 10px;
}

.topbar li {
    border-right: 1px solid #4b5e70;
    position: relative;
    float: none !important;
}

.topbar div.col-md > ul > li > a:not(.linkable-main)::after {
    content: "";
    display: inline-block;
    border-top: 6px solid #FFF;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    margin-left: 5px;
}

.topbar div > ul > li:hover > a {
    background: #005942
}

.topbar .logout {
    border: none;
    /*border-left: 1px solid #7e7e7e !important;*/
}

    .topbar .logout img {
        margin-left: 10px;
        margin-right: 0
    }

.topbar a + ul {
    position: absolute;
    left: 0;
    top: 100%;
    background: #f3f3f3;
    border: 1px solid #dbdbdb;
    padding: 15px;
    width: 250px;
    z-index: 50;
    display: none;
}

.topbar .col-md-auto a + ul {
    right: 0;
    left: auto;
}

.topbar li:hover a + ul {
    display: block
}

.topbar a + ul li {
    display: block;
    border-bottom: 1px solid #FFF;
    display: block;
    border-right: none
}

    .topbar a + ul li a {
        border-right: 1px solid #dbdbdb;
        display: block;
        padding: 5px;
        color: #2a3e4f !important;
        margin: 5px 0;
        position: relative;
    }

        .topbar a + ul li a::after {
            display: inline-block;
            height: 100%;
            width: 1px;
            content: "";
            background: #FFF;
            right: -2px;
            top: 0;
            position: absolute;
        }

    .topbar a + ul li::after {
        height: 1px;
        width: 100%;
        display: block;
        content: "";
        background: #dbdbdb;
    }

.topbar a + ul.double {
    width: 500px;
}

    .topbar a + ul.double li {
        width: 232px;
        display: inline-block
    }

.role-department {
    text-align: right;
    padding: 0;
}

    .role-department > div {
        color: #2c3e50;
        font-size: 16px;
        font-weight: 600;
        display: inline-block;
        padding: 0 5px;
        border-right: 1px solid #d4d4d4;
        text-align: left;
        max-width: calc(50% - 50px);
    }

    .role-department span {
        display: block;
        color: #428bca;
        font-size: 12px;
        font-weight: 700;
    }

    .role-department div:last-child {
        border: none
    }

    .role-department a {
        border-bottom: 4px solid #FFF;
        padding-bottom: 5px;
        margin-right: 5px
    }

        .role-department a.active {
            border-bottom: 4px solid #f1c40f;
        }

    .role-department img {
        margin: 0
    }

header {
    position: relative;
    width: 100%;
    background: #FFF;
    padding: 12px 7px;
    box-shadow: 0 0 5px #cbe1cf;
    margin-bottom: 10px;
    text-transform: uppercase;
    font-size: 24px;
    font-weight: 900;
}

.breadcrumb {
    background: none;
    color: #2c3e50;
    font-size: 14px;
    margin: 0;
    padding: 0 1rem;
    position: relative;
    z-index: 1005;
}

    .breadcrumb .container-fluid {
        border-bottom: 1px dotted #c5c5c5;
    }

    .breadcrumb a {
        padding: 5px;
        display: inline-block;
    }

    .breadcrumb ul {
        display: flex;
        align-items: center;
    }

    .breadcrumb li {
        border-right: 1px dotted #c5c5c5;
        padding: 5px;
        margin: 5px 0px;
        vertical-align: middle;
        z-index: 10;
    }

        .breadcrumb li img {
            max-width: 23px;
            max-height: 23px;
            object-fit: cover
        }

body.rtl .breadcrumb li img {
    transform: scaleX(-1);
}

.breadcrumb li:last-child {
    border: none
}

.breadcrumb h4 {
    font-size: 16px;
    font-weight: 700;
    margin: 0;
    text-align: left;
    text-transform: uppercase;
}

.Exam_NotPublished_PopUP .msgToShow {
    text-transform: unset !important;
}

.search .border.relative {
    border: 1px solid #CCC !important;
    background: #FFF;
    display: inline-flex;
    padding: 3px;
    width: 100%;
    max-width: 325px;
}

.search .relative.border.w-100 {
    max-width: 100%
}

.search {
    padding: 9px 0 8px;
    color: #000 !important;
}

    .search .border.relative input {
        border: none !important;
        float: left;
        height: 30px;
        outline: 0 !important;
        box-shadow: none !important;
    }

    .search button {
        background: #35aa47;
        border: none;
        width: 35px;
        border-radius: 4px
    }

        .search button + button {
            background: #F25B3B;
        }

.bootBoxConfirmMessage.bootbox .modal-footer {
    direction: rtl
}

body.rtl .bootBoxConfirmMessage.bootbox .modal-footer {
    direction: ltr
}

.bootBoxConfirmMessage.bootbox .modal-footer button {
    margin: 0 2px
}

.bootBoxConfirmMsg.bootbox .modal-footer button {
    margin: 0 2px
}

.content {
    flex-grow: 1;
    padding: 0 20px;
}

header a {
    color: #428bca !important;
    text-decoration: none !important;
}

header img {
    margin-right: 10px;
    vertical-align: middle;
    display: inline-block
}

.logedin-person {
    background: #253443;
    padding: 30px 0;
    text-align: center;
}

    .logedin-person img {
        display: block;
        margin: 0 auto;
    }

.f-12 {
    font-size: 12px;
}

.logedin-person a {
    color: #ffb74d;
    font-size: 14px;
}

.logedin-person span {
    display: block;
    padding: 20px 30px 0;
    text-align: left
}

.check-container {
    display: block;
    position: relative;
    padding-left: 18px;
    margin-bottom: 0;
    cursor: pointer;
    font-size: 12px;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
    margin-left: 15px
}

    .check-container input {
        position: absolute;
        opacity: 0;
        cursor: pointer;
        height: 10px;
        left: 0;
        top: calc(50% - 5px);
        z-index: 5
    }

.checkmark {
    position: absolute;
    top: calc(50% - 5px);
    left: 0;
    height: 10px;
    width: 10px;
    border: 1px solid #ccc;
    background: #FFF
}

.check-container input[type="radio"] + .checkmark {
    border-radius: 50%;
    height: 12px;
    width: 12px;
    top: calc(50% - 6px);
}

.check-container:hover input ~ .checkmark {
    background-color: #eee;
}

.check-container input:checked ~ .checkmark {
    background-color: #2196F3;
}

.checkmark:after {
    content: "";
    position: absolute;
    display: none;
}

.check-container input:checked ~ .checkmark:after {
    display: block;
}

.check-container input[type="radio"]:checked ~ .checkmark:after {
    display: none;
}

.check-container .checkmark:after {
    left: 2px;
    top: 0px;
    width: 4px;
    height: 7px;
    border: solid white;
    border-width: 0 2px 2px 0;
    -webkit-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    transform: rotate(45deg);
}

.check-container.large .checkmark {
    top: calc(50% - 7px);
    height: 14px;
    width: 14px
}

.check-container.large input {
    top: calc(50% - 7px);
}

    .check-container.large input:checked ~ .checkmark::after {
        height: 8px;
        width: 5px;
        left: 3px;
        top: 1px;
    }

.check-container.s-center.large {
    height: 14px;
    width: 14px;
    padding: 0;
    margin: 0;
    display: inline-block
}

.content-area h2 {
    font-size: 24px;
    color: #225781;
    font-weight: 500;
    text-transform: uppercase;
    padding: 10px 0 10px;
    margin: 10px 0;
    border-bottom: 1px dotted #bbbbb1;
}

.table-labels {
    position: relative;
}

    .table-labels label {
        font-weight: 900;
        color: #00486e;
        font-size: 16px;
        border-right: 2px solid #c6c6c6;
        padding-right: 15px;
        margin-right: 15px;
        text-transform: uppercase
    }

        .table-labels label span {
            font-weight: 600;
        }

        .table-labels label:last-child {
            margin-right: 0;
            border: none;
            padding: 0
        }

.labels {
    float: left;
}

.filter-btn {
    display: block;
    background: url("../Content/images/btn-bg.jpg") repeat-x;
    border: 1px solid #0a9acf;
    height: 39px;
    padding: 0 15px;
    color: #FFF !important;
    text-align: center;
    text-decoration: none !important;
    text-transform: uppercase
}

.filter-area .form {
    display: flex;
    text-align: right
}

    .filter-area .form div {
        flex-grow: 1;
        margin-right: 5px
    }

.table-grid-w .note {
    color: #618a3f;
    font-size: 14px;
    margin-top: 15px;
}

.content-area table {
    width: 100%;
    table-layout: unset;
}

    .content-area table.no-layout {
        table-layout: unset;
    }

#add-new-item-type .checkmark {
    top: 2px
}

.content.blue-print table td.text-right {
    text-align: right !important;
    font-size: 14px;
    /*font-weight: 600;*/
}

.content-area table th {
    color: #1e4d71;
    font-size: 13px; /*Update by Mr. Waqas 30-03-2021*/
    padding: 8px 5px;
    border-bottom: 1px solid #8c8c8c;
    text-align: center
}

    .content-area table th .check-container {
        font-size: 14px;
    }

.w-9 {
    width: 90px;
}

.w-5 {
    width: 50px;
}

.w-12 {
    width: 120px;
}

.w-15 {
    width: 150px;
}

.w-20 {
    width: 200px;
}

.w-10 {
    width: 100px;
}

.w-11 {
    width: 110px;
}

.content-area table td {
    padding: 15px 10px 3px;
    vertical-align: top;
    border-bottom: 1px solid #cacaca;
    color: #262626;
}

    .content-area table td a {
        display: inline-block;
        margin-right: 10px;
        margin-bottom: 10px;
    }

    .content-area table th:first-child, .content-area table th:nth-child(2), .content-area table td:first-child, .content-area table td:nth-child(2) {
        text-align: left
    }

.content-area table a, .content-area table a:not([href]):not([tabindex]) {
    color: #1e74b1;
    text-decoration: underline;
}

.configure {
    width: 100px;
    text-align: center
}

.complete {
    width: 150px;
    text-align: center
}

.content-area table td span a {
    float: right;
}

.content-area table td .checkmark {
    top: 10px;
}

.bootbox.modal .modal-footer button {
    border: none;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    display: block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}
/*.green-btn {*/
.green-btn /*, button[data-bb-handler="ok"], button[data-bb-handler="confirm"]*/ { /*updated by Mr waqas 2021-04-20*/
    border: none;
    background: #27ae60 !important;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    color: #FFF !important;
    display: block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

    .green-btn:hover /*, button[data-bb-handler="ok"]:hover, button[data-bb-handler="confirm"]:hover*/ {
        background: #26BB65 !important;
    }

    .green-btn.disabled-link {
        background: #95a5a6 !important;
        color: #ecf0f1 !important;
    }

.col-auto .green-btn {
    height: 39px;
    line-height: 39px;
    min-width: 60px
}

.red-btn /*, button[data-bb-handler="cancel"], .bootBoxErrorMessage button[data-bb-handler="ok"]*/ {
    border: none;
    background: #e74c3c !important;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    color: #FFF !important;
    display: block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

.formbtn.red-btn {
    height: 40px;
    line-height: 40px;
    min-width: 75px;
    display: inline-block;
}

.green-btn.invite {
    float: right;
    margin-top: 20px;
}

.dropdown-toggle::after {
    border: none !important;
    float: right;
}

.green-btn_1 /*, button[data-bb-handler="ok"], button[data-bb-handler="confirm"]*/ { /*updated by Mr waqas 2021-04-20*/
    border: none;
    background: #3498DB !important;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    color: #FFF !important;
    display: block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

    .green-btn_1:hover {
        background: #5CB9F6 !important;
    }

.green-btn_2 {
    border: none;
    background: #1ABC9C !important;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    color: #FFF !important;
    display: block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

    .green-btn_2:hover {
        background: #31DCBA !important;
    }

.blue-btn_1 {
    border: none;
    background: #1289A7 !important;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    color: #FFF !important;
    display: block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

    .blue-btn_1:hover {
        background: #2DAFCF !important;
    }

.red-btn_1 {
    border: none;
    background: #E67E22 !important;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    color: #FFF !important;
    display: block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

    .red-btn_1:hover {
        background: #F8A053 !important;
    }

    .red-btn_1.disabled-link {
        background: #95a5a6 !important;
        color: #ecf0f1 !important;
    }

.filter.popovers {
    right: 0;
    left: auto;
    top: 21px;
    border-radius: 0;
    background: #E4FAFF;
    min-width: 500px;
    max-width: 700px;
    border: 1px solid #00A9D4;
    padding: 10px 15px;
    position: absolute;
    z-index: 100;
}

.filter-cols {
    display: flex;
    width: 100%;
    flex-wrap: wrap
}

    .filter-cols div {
        width: 100% !important;
    }

        .filter-cols div input[type="text"] {
            border: 1px solid #b1f1ff !important;
        }

#myInputautocomplete-list {
    width: calc(100% - 20px);
    position: absolute;
    height: auto;
}

    #myInputautocomplete-list > div {
        width: 100%;
        height: auto;
        border: none;
        border-bottom: 1px solid #b1f1ff;
        cursor: pointer;
    }

        #myInputautocomplete-list > div:hover, .autocomplete-active {
            background: #b1f1ff !important;
        }

        #myInputautocomplete-list > div:last-child {
            border: none
        }

.filter-cols div:last-child {
    margin: 0;
}

.filter.popovers::after {
    content: "";
    border-top: 5px solid #00A9D4;
    border-right: 5px solid transparent;
    border-left: 5px solid transparent;
    width: 0;
    height: 0;
    position: absolute;
    top: 0;
    right: 35px
}

.filter.popovers h3 {
    font-size: 16px;
    font-weight: normal;
    color: #125087;
}

.filter-cols h4 {
    color: #797979;
    font-weight: normal;
    font-size: 14px;
}

.addnew-btn {
    padding: 0 15px;
    height: 40px;
    line-height: 40px;
    display: inline-block;
    color: #2c3e50
}

    .addnew-btn span {
        margin-right: 5px;
    }

.s-blue-btn {
    background: #ccf2f7;
    color: #00466a;
    min-width: 75px;
    height: 34px;
    display: inline-block;
    line-height: 34px;
    text-align: center;
    text-decoration: none !important;
    padding: 0 15px
}

.d-blue-btn {
    background: #40739E;
    color: #FFF;
    min-width: 75px;
    height: 40px;
    display: inline-block;
    line-height: 40px;
    text-align: center;
    text-decoration: none !important;
    padding: 0 15px
}

.blue-btn {
    background: #0d6efd;
    color: #FFF !important;
    min-width: 75px;
    height: 40px;
    display: inline-block;
    line-height: 40px;
    text-align: center;
    text-decoration: none !important;
    padding: 0 15px
}

.invite-orange-btn {
    background: #ffa274;
    color: #FFF;
    min-width: 75px;
    height: 40px;
    display: inline-block;
    line-height: 40px;
    text-align: center;
    text-decoration: none !important;
    padding: 0 15px
}

.invite-dorange-btn {
    background: #ff6c60;
    color: #FFF;
    min-width: 75px;
    height: 40px;
    display: inline-block;
    line-height: 40px;
    text-align: center;
    text-decoration: none !important;
    padding: 0 15px
}

.l-orange-btn {
    background: #ffe0d6;
    color: #bf360c !important;
    width: 75px;
    height: 29px;
    display: inline-block;
    line-height: 29px;
    text-align: center;
    text-decoration: none !important;
}

.purple-btn {
    background: #fae0ff;
    color: #4a148c;
    width: 75px;
    height: 29px;
    display: inline-block;
    line-height: 29px;
    text-align: center;
    text-decoration: none !important;
}

.btns-area {
    text-align: right;
    margin-top: 10px;
}

    .btns-area a {
        display: inline-block
    }

    .btns-area.align-center {
        text-align: center;
        justify-content: center;
    }

.filter-cols .search-choice {
    height: 19px;
    line-height: 19px;
    background: #ffb142;
    Color: #FFF;
    padding: 0 25px 0 5px;
    display: inline-block;
    position: relative;
    font-size: 12px;
}

.filter-cols span a {
    font-size: 10px;
    color: #FFF;
    float: right;
    position: absolute;
    top: 0px;
    right: 5px
}

.form-area {
    width: 75%;
    margin-bottom: 15px
}

    .form-area .col-md-6 {
        margin-bottom: 15px;
    }

    .form-area label, .site-area h3 {
        font-size: 14px;
        font-weight: 500;
        margin: 0;
    }

label.b {
    color: #000;
}

label.c, .site-area h3 {
    color: #006680;
}

.greybar-heading {
    background: #F9F9F9;
    padding: 0 10px;
    margin-bottom: 20px;
}

    .greybar-heading h3 {
        font-weight: normal;
        font-size: 18px;
        color: #000;
        margin: 0;
        line-height: 35px;
    }

        .greybar-heading h3 span {
            color: #004357;
            font-weight: 300;
        }

.date.relative {
    position: relative;
    width: 100%
}

    .date.relative i {
        display: none
    }

.site-area {
    width: 50%;
}

    .site-area .heading {
        background: #00acd7;
        height: 33px;
        width: 100%;
        padding: 5px;
    }

    .site-area.selected .heading {
        background: #16a085
    }

    .site-area.selected.available .heading {
        background: #00acd7
    }

.site-area {
    width: 50%;
}

    .site-area .heading input, .heading-area input {
        background: #FFF;
        height: 23px;
        line-height: 23px;
        padding: 0 10px;
    }

    .site-area .heading .check-container, .heading-area h4 {
        float: left
    }

.heading-area {
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    padding-right: 7px
}

    .heading-area h4 {
        color: #1e88e5;
        font-weight: normal;
        font-size: 14px;
        width: 50%;
        height: 32px;
        margin: 0;
        display: flex;
        align-items: center;
    }

    .heading-area h3 {
        color: #0087b0;
        font-weight: normal;
        font-size: 16px;
        text-align: center;
        width: 100%;
    }

    .site-area .heading .search, .heading-area .search {
        float: right;
        width: 50%;
        position: relative
    }

        .site-area .heading .search button, .heading-area .search button, .relative.search button {
            border: none;
            position: absolute;
            right: 0px;
            top: calc(50% - 10px);
            background: none;
            color: #95a5a6;
        }

.site-area .heading .check-container {
    color: #FFF;
    font-size: 14px;
    font-weight: 500;
    line-height: 28px;
    margin-left: 10px;
}

.site-area .r-body {
    width: 100%;
    display: block;
    padding: 15px;
    border: 1px solid #B0B0B0;
    max-height: 250px;
    overflow-y: auto;
}

.r-body .check-container {
    line-height: 22px;
}

.right-con {
    padding-bottom: 30px;
    min-height: calc(100vh - 221px);
    width: calc(100% - 235px);
    background: #FFF;
    border: 1px solid #428bca
}

div#_liveZillaEmbedded {
    position: fixed;
    bottom: 0;
    right: 0;
    z-index: 9999 !important;
}

    div#_liveZillaEmbedded img {
        height: 25px;
        width: auto;
        filter: invert(1);
    }

    div#_liveZillaEmbedded .green-btn {
        background: #800080 !important;
    }

    div#_liveZillaEmbedded a i {
        margin-right: 5px
    }

body.rtl div#_liveZillaEmbedded {
    position: fixed;
    bottom: 0;
    right: auto;
    left: 0;
}

    body.rtl div#_liveZillaEmbedded a i {
        margin-right: 0px;
        margin-left: 5px
    }

#me_sdp_chat_content_div {
    bottom: -8px !important;
    right: 0px !important;
    z-index: 9999 !important;
}

body.rtl #me_sdp_chat_content_div {
    bottom: -8px !important;
    right: auto !important;
    left: 10px !important;
}

body.rtl #external_sdp_chat {
    right: auto !important;
    left: 10px !important;
}

.itemDetailViewPopup .right-con {
    min-height: calc(100vh - 390px) !important;
}

.auto-height {
    min-height: unset;
}

.left-b .site-area {
    width: 100%
}

.modal-lg {
    max-width: 1570px !important;
    padding: 0 15px;
}

.modal-header {
    background: #3598db;
    color: #FFF;
    padding-top: 8px;
    padding-bottom: 4px
}

    .modal-header .close {
        background: red;
        opacity: 1;
        padding: 8px 20px 9px;
        margin: -8px -16px -5px 0;
        color: #FFF;
        cursor: default;
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
    }

    .modal-header h5 {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        line-height: normal;
    }

.noselect, .modal-footer button {
    cursor: default;
    -webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.nav.nav-tabs li a {
    height: 54px;
    border: 2px solid #dbe1df !important;
    font-size: 15px;
    line-height: 16px;
    width: 297px;
    margin: 5px;
    background: #f6f6f6;
    border-radius: 0;
    color: #000 !important;
    text-align: left;
    padding: 0 50px;
    display: flex;
    align-items: center;
    justify-content: center
}

    .nav.nav-tabs li a span {
        margin-right: 15px;
        width: 32px;
        text-align: center
    }

    .nav.nav-tabs li a b {
        font-weight: 400;
        flex-grow: 1;
    }

    .nav.nav-tabs li a.completed {
        background: #218b74;
        color: #FFF
    }

.modal-container {
    width: 100%;
    margin: 0px auto;
    max-width: 1100px;
    padding: 0 15px
}

.nav-tabs {
    border: none
}

.modal-container label {
    width: 127px;
    line-height: normal;
    font-weight: bold;
    margin: 0;
    vertical-align: middle
}

.modal-container .row > div {
    margin-bottom: 10px;
}

.modal-container .row {
    padding: 15px 0 5px;
}

.modal-container input:not([type=checkbox]):not([type=radio]),
.modal-container select {
    max-width: calc(100% - 130px);
}

.modal-container .resultBox {
    max-width: calc(100% - 0px) !important;
}

#MainCourseInfoContainer .modal-container label {
    width: 140px;
}

    #MainCourseInfoContainer .modal-container label ~ input:not([type=checkbox]):not([type=radio]), #MainCourseInfoContainer .modal-container label + select {
        max-width: calc(100% - 143px);
    }

#divCourseDuration .select-group {
    width: calc(100% - 143px);
}

.search-field button[type=submit] {
    background: none;
    border: none;
    position: absolute;
    right: 10px;
    top: 10px;
}

.search-field input {
    width: 100%;
    max-width: 100%;
}

.search-field label {
    width: auto !important;
}

.surface-secondary-200 {
    background: #f5f5f5;
    margin-bottom: 10px;
    align-items: center
}

.white-row {
    background: #ffffff;
    margin-bottom: 10px !important;
    align-items: center;
    padding-bottom: 10px !important;
}

.col-12.white {
    background: #FFF;
    padding: 0 0 5px;
    text-align: right;
    margin: -15px 0 20px !important;
}

    .col-12.white .check-container {
        display: inline-block;
    }

.select-group {
    display: inline-flex;
    width: calc(100% - 130px);
}

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

    .select-group.two-one select:first-child {
        width: 200%;
        margin-right: 10px
    }

.modal-container label.hd {
    color: #0a3d62;
    font-weight: 600;
    width: 100px;
}

    .modal-container label.hd + .select-group {
        width: calc(100% - 103px)
    }

.dir-tree {
    width: 100%;
    height: 80px;
    border: 1px solid #b6b6b6;
    overflow-y: auto;
    background: #FFF;
}

.heading {
    margin-top: -15px;
}

.surface-secondary-200 h4 {
    display: inline-block;
    margin: 0px 0 0 -15px;
    padding: 5px;
    color: #FFF;
    background: #0a3d62;
    font-weight: 600;
    font-size: 14px;
}

#myinnerTab a {
    background: none;
    border: none !important;
    width: auto;
    font-size: 14px;
    padding: 5px;
    height: auto;
    margin: 0
}

    #myinnerTab a.active {
        background: #e7e7e7;
    }

.bordered {
    border: 1px solid #b6b6b6;
    margin-top: -15px;
}

    .bordered textarea {
        border: none !important;
        width: 100%;
        height: 100px;
    }

.col .dir-tree {
    height: 500px;
}

.jsmind-inner {
    overflow: unset !important;
}

.modal-container .surface-secondary-200:first-child {
    margin-top: 20px;
}


.modal-body {
    word-wrap: break-word;
}

    .modal-body #divTree {
        max-height: calc(100vh - 190px);
        overflow-y: auto
    }

.col-md-auto .left {
    color: #FFF;
    background: #d35400;
    display: block;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    margin-top: 15px;
    font-size: 27px;
    text-align: center;
    line-height: 20px;
}

.col-md-auto .right {
    color: #FFF;
    background: #0d6efd;
    display: block;
    width: 25px;
    height: 25px;
    border-radius: 50%;
    font-size: 27px;
    text-align: center;
    line-height: 20px;
}

.modal {
    padding: 0 20px !important;
}

.d2 {
    display: flex;
    align-items: flex-start;
    flex-wrap: wrap;
}

    .d2 > .aside > ul {
        width: 276px;
        position: relative;
        padding-left: 15px;
    }

        .d2 > .aside > ul:before {
            content: "";
            width: 1px;
            height: calc(100% - 60px);
            background: #7f8c8d;
            display: block;
            position: absolute;
            left: 7px;
            top: 30px
        }

    .d2 > .tab-content {
        flex-grow: 1;
        width: calc(100% - 276px);
        background: #FFF;
        position: relative
    }

    .d2 > .nav.nav-tabs li a {
        background: none;
        width: 240px;
        padding: 0;
        border: none !important;
        color: #0a3d62
    }

    .d2 > .aside > .nav.nav-tabs li a.active, .d2 > .aside > .nav.nav-tabs li a.completed.active {
        color: #d35400 !important;
    }

    .d2 .nav.nav-tabs li a.completed {
        color: #0a3d62;
    }

    .d2 > .aside > .nav.nav-tabs li a::before {
        content: "\f00c";
        display: block;
        position: absolute;
        left: 0px;
        height: 15px;
        width: 15px;
        border: 1px solid #7f8c8d;
        border-radius: 50%;
        background: #FFF;
        font-family: 'Font Awesome 5 Free';
        font-weight: 900;
        font-size: 10px;
        line-height: 13px;
        text-align: center;
        color: #FFF
    }

    .d2 > .aside > .nav.nav-tabs li a.completed:before {
        background: #16a186
    }

.aside {
    width: 230px;
    transition: ease all 1s;
}

body:not(.rtl) .aside {
    padding-right: 10px
}

body.rtl .aside {
    padding-left: 10px
}

.aside.onlyicons {
    width: 100px;
    transition: ease all 1s;
}

    .aside.onlyicons li b {
        opacity: 0;
        transition: ease all 1s;
    }

.aside li b {
    opacity: 1;
    transition: ease all 1s;
}

.collapsible-sidebar {
    background: #F5F5F5;
    border-radius: 3px;
    padding: 5px 10px;
    cursor: pointer;
    text-decoration: none !important;
}

.aside.onlyicons .collapsible-sidebar i::before {
    content: "\f101";
}

body.rtl .d2 > .aside > ul {
    padding-left: 0;
    padding-right: 15px
}

    body.rtl .d2 > .aside > ul:before {
        left: auto;
        right: 7px;
    }

body.rtl .d2 > .aside > .nav.nav-tabs li a::before {
    left: auto;
    right: 0;
}

body.rtl .aside.onlyicons .collapsible-sidebar i::before {
    content: "\f100" !important;
}

body.rtl .aside .collapsible-sidebar i::before {
    content: "\f101" !important;
}

.objective-learning td > span {
    height: 25px;
    line-height: 25px;
    width: 50px;
    border: 1px solid #b4b6b5;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    background: #f5f5f5
}

.objective-learning td[data-label="KSA"] span, .objective-learning td[data-label="CAP"] span {
    width: 25px;
    background: #FFF;
}

.edu-domain.objective-learning td[data-label="KSA"] span, .objective-learning.edu-domain td[data-label="CAP"] span {
    width: 50px;
    background: #f5f5f5;
}

.objective-learning td[data-label="KSA"] span.k.active {
    background: #bf861d;
    color: #FFF
}

.objective-learning td[data-label="KSA"] span.s.active {
    background: #815a1f;
    color: #FFF
}

.objective-learning td[data-label="KSA"] span.a.active {
    background: #4e3811;
    color: #FFF
}

.objective-learning td[data-label="CAP"] span.c.active {
    background: #ec3f81;
    color: #FFF
}

.objective-learning td[data-label="CAP"] span.a.active {
    background: #ba1454;
    color: #FFF
}

.objective-learning td[data-label="CAP"] span.p.active {
    background: #7c0021;
    color: #FFF
}

.objective-learning td span + a {
    height: 25px;
    line-height: 25px;
    width: 25px;
    border: 1px solid #b4b6b5;
    display: inline-block;
    text-align: center;
    vertical-align: middle;
    margin: 0
}

.objective-learning td {
    padding-bottom: 15px !important;
}

#sessionModal .modal-lg, .collapse-folder-modal .modal-lg {
    max-width: 1150px;
}

#educational-Activty-Modal .modal-lg {
    max-width: 500px;
}

td[data-label="Lecture"]::before {
    content: url("../Content/images/fill-folder.png");
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

td[data-label="Lecture"].empty::before {
    content: url("../Content/images/folder.png");
    display: inline-block;
    vertical-align: middle;
    margin-right: 10px;
}

.table-responsive.border-div {
    border: 1px solid #cacaca;
    padding: 15px;
}

.course-d1 > .aside > ul {
    width: 230px;
}

.d2.course-d1 > .aside > .nav.nav-tabs li a {
    width: 200px;
    padding: .5rem 1rem;
    background: none;
    border: none !important;
}

.course-d1 .modal-container {
    max-width: 100%
}

.p-20 {
    width: 25%
}

.collapse-folder-modal h4 {
    font-size: 14px;
    font-weight: 600;
    margin: 0;
}

.collapse-folder-modal .row {
    padding: 0
}

.collapse-folder-modal a i::before {
    content: "\f068";
}

.collapse-folder-modal a.collapsed i::before {
    content: "\f067";
}

.object-type {
    width: 250px;
}

.generalContainer .row {
    border-top: 1px solid #b6b6b6;
    padding: 10px 0;
}

#mainfolder .row > div {
    margin: 0;
}

.collapse-folder-modal .check-container {
    width: 100%;
}

.main-folder {
    padding-bottom: 10px;
}

.folder-list-item > .col-12 {
    margin-top: 10px !important;
}

    .folder-list-item > .col-12 .row > div, .folder-list-item > .object-type {
        padding-left: 30px;
    }

h4.main-folder a::after {
    content: url("../Content/images/main-folder.png");
    display: inline-block;
    margin: 0 5px
}

.c-object.folder a::after {
    content: url("../Content/images/opened-folder.png");
    display: inline-block;
    margin: 0 5px;
    vertical-align: middle
}

.c-object.folder a.collapsed::after {
    content: url("../Content/images/folder.png");
    display: inline-block;
    margin: 0 5px;
    vertical-align: middle
}

.objective-learning td span.strip {
    height: 20px;
    width: 5px;
    border: none;
    margin: 2px 1px
}

.c1 {
    background: #25ccf7 !important;
}

.c2 {
    background: #7b264e !important;
}

.c3 {
    background: #4a69bd !important;
}

.c4 {
    background: #827717 !important;
}

.c5 {
    background: #e67e22 !important;
}

.c6 {
    background: #73501e !important;
}

.c7 {
    background: #227093 !important;
}

.c8 {
    background: #e74c3c !important;
}

.c9 {
    background: #84817a !important;
}

.c10 {
    background: #f1c40f !important;
}

.c11 {
    background: #eb2f06 !important;
}

.c12 {
    background: #9b59b6 !important;
}

.c13 {
    background: #3498db !important;
}

.c14 {
    background: #2ecc71 !important;
}

.c15 {
    background: #16a085 !important;
}

.strip-container {
    position: relative
}

.tooltip-content {
    right: 50px;
    position: absolute;
    display: none;
    width: 400px;
    text-align: left;
    background: #2C3E50;
    border-radius: 5px;
    top: 85%;
    padding: 10px;
    color: #FFF;
    font-size: 10px;
    z-index: 1000;
}

    .tooltip-content:empty {
        display: none !important;
    }

    .tooltip-content::before {
        content: "";
        height: 0;
        width: 0;
        border-bottom: 8px solid #2C3E50;
        border-left: 8px solid transparent;
        border-right: 8px solid transparent;
        top: -5px;
        left: 210px;
        position: absolute;
    }

td[data-toggle="tooltip"]:hover .tooltip-content {
    display: block
}

td[data-toggle="tooltip"] {
    position: relative;
}

tr:last-child .tooltip-content::before, tr:nth-last-child(2) .tooltip-content::before {
    bottom: -5px;
    top: auto;
    border-top: 8px solid #2c3e50;
    border-bottom: 0;
}

tr:last-child .tooltip-content, tr:nth-last-child(2) .tooltip-content {
    top: auto !important;
    bottom: 85%
}

#assessment-settingcontent.tab-content .d-block.lnkScope {
    position: relative;
    display: inline-block !important;
}

    #assessment-settingcontent.tab-content .d-block.lnkScope .tooltip-content {
        right: 0;
        left: auto;
    }

body.rtl #assessment-settingcontent.tab-content .d-block.lnkScope .tooltip-content {
    right: auto;
    left: 0;
}

#assessment-settingcontent.tab-content .d-block.lnkScope .tooltip-content::before {
    right: 10px;
    left: auto;
}

body.rtl #assessment-settingcontent.tab-content .d-block.lnkScope .tooltip-content::before {
    right: auto;
    left: 10px;
}

#assessment-settingcontent.tab-content tr .d-block.lnkScope .tooltip-content {
    bottom: auto
}

#assessment-settingcontent.tab-content tr:last-child .d-block.lnkScope .tooltip-content {
    bottom: 130%;
}

#mainTable th {
    text-align: left
}

.tooltip-content ul li {
    display: block;
    flex-grow: 1;
    padding: 0 10px;
    max-width: 100%;
    flex-basis: 0;
    margin-bottom: 5px;
    white-space: normal;
}

    .tooltip-content ul li:empty:nth-child(even) {
        display: none;
    }


    .tooltip-content ul li:empty:nth-child(4n+4) {
        display: block;
        width: 100%;
        min-height: 2px;
        flex: 0 0 100%;
    }

.tooltip-content ul {
    display: flex;
    flex-wrap: wrap;
    max-height: 150px;
    overflow-y: auto;
}

    .tooltip-content ul li span {
        height: 10px;
        width: 10px;
        display: inline-block;
        margin-right: 5px;
        border: none
    }

.collapse-parent {
    color: #000;
    font-size: 14px;
}

.modal-content, .modal-header {
    border-radius: 0;
}

.collapse-parent .border {
    padding: 5px 0;
    border-color: #afbcbe !important;
    z-index: 10;
    position: relative;
    background: #FFF;
}

.col-auto.collapsed[data-toggle="collapse"]::before {
    background: url('../Content/images/collapsed-icon.png');
    display: inline-block;
    height: 13px;
    width: 13px;
    margin-top: 10px;
    content: "";
}

.col-auto[data-toggle="collapse"]::before {
    background: url('../Content/images/collapse-icon.png');
    display: inline-block;
    height: 13px;
    width: 13px;
    margin-top: 10px;
    content: "";
    position: relative;
    z-index: 16
}

.scope-tree.tree-line .no-child::before {
    display: none !important;
}

.scope-tree.tree-line > .row:first-child > .no-child + .collapse-parent div.border::after {
    display: block !important;
}

.scope-tree.tree-line.single > .row:first-child > .no-child + .collapse-parent div.border::after {
    display: none !important;
}

.border > .col-auto {
    min-width: 100px;
    margin-left: 20px
}

.t-child {
    padding-left: 32px
}

.border > .col-auto img {
    margin: 0 2px
}

.c-title {
    font-size: 16px;
    font-weight: 500;
    color: #428bca;
    margin-bottom: 5px
}

.s-count {
    color: #2c3e50;
    text-transform: uppercase
}

    .s-count span {
        color: #853120;
    }

.c-title .title {
    padding-left: 22px !important;
}

.p-education-list .c-title .title {
    /*padding-left: 48px;*/
    padding-left: 9px !important;
    left: 43px
}

.p-education-list .c-title.copyfromsystem-title .title {
    left: 0;
    padding-left: 2px;
}

.p-education-list .s-count {
    width: 142px
}

.category-heading {
    background: #428bca;
    color: #FFF;
    margin-bottom: 15px;
    margin-top: -1px;
    flex-wrap: nowrap;
}

.content-area > .category-heading {
    margin: 0 -12px 15px
}

.category-heading h2 {
    font-size: 16px;
    font-weight: 500;
    border: none !important;
    text-transform: uppercase;
    margin: 0;
    color: #FFF;
    padding: 10px 15px;
}

.category-heading a {
    background: #ecd078;
    font-size: 14px;
    color: #000;
    text-decoration: none;
    line-height: 40px
}

    .category-heading a + a {
        margin-left: 5px
    }

.add-btn-yellow {
    background: #ecd078 !important;
    border: none !important;
    margin: 0 1px;
    font-size: 14px;
    display: inline-block !important;
    width: auto !important;
    color: #2a3e4f !important;
}

.category-form label {
    font-size: 15px;
    font-weight: 500;
    color: #0a3d62;
    width: 200px;
}

#add-session .modal-dialog {
    max-width: 1100px !important;
}

.collapse-parent > div .col::before, .child-iconfree::before {
    content: url("../Content/images/category-open-icon.png");
    display: inline-block;
    margin-right: 7px;
}

.t-child ~ .row > .collapse-parent::before, .iconfree::before {
    content: "" !important;
    display: none !important;
}

.v-hidden {
    visibility: hidden
}

.col-auto.v-hidden {
    width: 32px;
}

div[class*="col title_"] + div.col-auto.iconfree, div[class*="col-md  title_"] + div.abbr- {
    width: 120px
}

.collapsed + .collapse-parent .col::before {
    content: url("../Content/images/category-icon.png");
}

.content.blue-print th:nth-child(n+1), .content.blue-print td:nth-child(n+1) {
    text-align: center !important;
}

.content.blue-print th:nth-child(n+2).text-right, .content.blue-print td:nth-child(n+2).text-right {
    text-align: right !important;
}

.content.blue-print th:nth-child(n+2).text-left, .content.blue-print td:nth-child(n+2).text-left {
    text-align: left !important;
}

.content.blue-print td {
    padding: 0.75rem;
    border-color: #b9b9b9;
}

.content.blue-print th {
    border-color: #b9b9b9;
    background: #2A3E4F;
    color: #FFF;
}

    .content.blue-print th i {
        margin-right: 10px;
        color: #0abde3
    }

.table-striped tbody tr:nth-of-type(odd) {
    background: #f9f9f9;
}

.content.blue-print thead.collapsed th i::before {
    content: "\f103"
}

.content.blue-print td input {
    width: 70px;
    height: 30px;
    line-height: 30px;
    margin: -6px 0
}

input[type="number"] {
    padding-right: 0;
}

input[type="color"] {
    padding: 0 1px !important;
    height: 20px !important;
    line-height: 10px !important;
    margin: 0 !important;
}

.greybar {
    background: #ecf0f1
}

    .greybar .search button {
        height: 39px;
        width: 39px;
        border-radius: 0
    }

    .greybar label, .author-name label {
        font-weight: bold;
        font-size: 14px;
    }

    .greybar .d-flex {
        justify-content: space-around
    }

.invite-author table th:first-child, .invite-author table td:first-child {
    text-align: center !important;
}

.content.blue-print.invite-author table th:nth-child(2), .content.blue-print.invite-author table td:nth-child(2) {
    text-align: left !important;
}

.invite-author table tr.tfoot {
    background: #94a5a6;
    color: #FFF !important;
    font-size: 18px;
    font-weight: 600;
}

    .invite-author table tr.tfoot td {
        color: #FFF !important;
        text-align: right !important;
    }

.author-name label {
    color: #000;
}

.author-name .col-12 label {
    color: #0f79ca
}

.author-name span {
    font-size: 14px;
    margin-left: 10px;
    color: #000
}

.author-name a {
    color: #965a2d;
    text-decoration: underline;
    border-left: 1px solid #965a2d;
    margin-left: 10px;
    padding-left: 10px;
}

.author-name label i {
    color: #d70000;
    margin-right: 5px
}

.invite-author h3 {
    color: #2f6390;
    font-size: 24px;
    font-weight: 300;
    margin-top: 15px
}

.content.blue-print tbody th {
    background: initial;
    color: #000
}

.blue-scroll::-webkit-scrollbar {
    width: 10px;
    height: 10px;
}

.blue-scroll::-webkit-scrollbar-track {
    background: #e5e5e5;
}

.blue-scroll::-webkit-scrollbar-thumb {
    background: #a7d4ff;
}

    .blue-scroll::-webkit-scrollbar-thumb:hover {
        background: #428bca;
    }

.invite-author .form-check-label {
    font-size: 24px;
    font-weight: 300;
}

#add-education-domain .modal-dialog {
    max-width: 500px
}

#add-education-domain .content.blue-print th:nth-child(n+2), #add-education-domain .content.blue-print td:nth-child(n+2) {
    text-align: left !important;
}

#tbCourseSetting .custom-select, .form-control {
    width: 100% !important;
    max-width: 220px;
    height: 38px !important;
    margin: 0 auto !important;
}

td {
    vertical-align: middle !important;
}

    td[valign="top"] {
        vertical-align: top !important;
    }

.content.blue-print table td.text-left {
    text-align: left !important;
}

.content.blue-print table td.arabic {
    text-align: right !important;
}

.element-text-right {
    text-align: right !important;
}

.element-text-left {
    text-align: left !important;
}

.content.blue-print table td.english {
    text-align: left !important;
}

.custom-select, .form-control {
    width: 100% !important;
    max-width: 220px;
    height: 38px !important;
    margin: 0 auto !important;
    color: #000 !important;
    outline: 0 !important;
    box-shadow: none !important;
}

header .custom-select {
    height: 25px !important;
    padding: 0 24px 0 0px !important;
    background: #f9f9f9 url(../Content/images/accordian_arrow_open.png) no-repeat calc(100% - 6px) 56%;
    max-width: 140px !important;
}

td {
    vertical-align: middle !important;
}

.content.blue-print table td.text-left {
    text-align: left !important;
}

.content.blue-print table td.text-right {
    text-align: right !important;
}

.content.blue-print table thead td {
    background: #ecf3fa;
    font-weight: bold;
}

.table-unset {
    table-layout: unset !important;
}

.content-area table td a {
    margin: 2px;
}

.org-form .form-control, .org-form .custom-select {
    max-width: unset !important;
}

#add-college .check-container {
    margin: 0
}

.org-form .form-row > label {
    width: 120px;
    position: relative;
}

#manage-organization.org-form .form-row > label {
    width: 127px;
    position: relative;
}

.count-note {
    color: #9f380f
}

#add-college .checkmark {
    height: 15px;
    width: 15px;
    top: 0
}

#add-college .check-container .checkmark:after {
    top: 2px;
    left: 4px;
}

.w11.modal-dialog {
    max-width: 1100px;
}

.w13.modal-dialog {
    min-width: 1000px;
    max-width: 1300px;
}

.img-area {
    background: #e9e9e9;
    height: 155px;
    width: 180px;
    display: flex;
    align-items: center;
    justify-content: center;
    margin-bottom: 5px;
}

    .img-area img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
    }

input[type="file"] {
    position: absolute;
    width: 75px;
    height: 40px;
    right: 0;
    top: 0;
    opacity: 0;
}

#manage-words-Modal .modal-dialog {
    max-width: 800px
}

.blockUI.blockMsg.blockPage {
    z-index: 9999 !important; /*1040*/
}

a[data-target="#brdcrmb"] {
    transform: rotate(-90deg)
}

a.collapsed[data-target="#brdcrmb"] {
    transform: rotate(0deg)
}

#brdcrmb {
    position: absolute;
    top: 40px; /*100%;*/
    background: #000;
    border-radius: 5px;
    color: #FFF;
    padding: 10px
}

body.rtl header .logo a {
    text-align: right;
}

#brdcrmb::before {
    position: absolute;
    left: 13px;
    top: -5px;
    border-bottom: 5px solid #000;
    border-left: 5px solid transparent;
    border-right: 5px solid transparent;
    content: "";
    height: 0;
    width: 0
}

.center {
    margin: auto;
    width: 25%;
    padding: 10px;
}

.login-wrapper {
    width: 100%;
    min-height: 100vh;
    background: url("../Content/images/login-bgd.jpg");
    background-size: 100% 100%;
    padding: 0 15px;
    display: flex;
    flex-direction: column;
}

    .login-wrapper h2 {
        font-size: 18px;
        color: #FFF;
    }

    .login-wrapper .copyright {
        color: #98a7be;
        font-size: 11px;
    }

    .login-wrapper > .container-fluid {
        max-width: 950px;
        flex-grow: 1;
        display: flex;
        align-items: center;
    }

        .login-wrapper > .container-fluid > .row {
            width: 100%;
            margin: 0 !important;
        }

    .login-wrapper .check-container .checkmark {
        top: 2px;
    }

.login-box {
    background: #2c5584;
    background: -moz-linear-gradient(-45deg, #2c5584 0%, #1d3958 100%);
    background: -webkit-linear-gradient(-45deg, #2c5584 0%,#1d3958 100%);
    background: linear-gradient(135deg, #2c5584 0%,#1d3958 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c5584', endColorstr='#1d3958',GradientType=1 );
    box-shadow: 0px 0px 0px 1px #274c75;
    max-width: 270px;
    padding: 13px;
    border: 1px solid;
    border-color: #55769b #14263b #14263b #55769b;
}

    .login-box h1 {
        font-size: 36px;
        color: #acdeff;
        font-weight: 300;
        text-transform: uppercase;
        margin-bottom: 12px;
    }

    .login-box .form-control {
        border-color: #FFF !important;
        margin-bottom: 15px !important;
        outline: 0 !important;
        box-shadow: none !important;
        height: 53px !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .login-box button {
        background: #46b28e;
        width: 100%;
        margin-bottom: 14px;
        color: #FFF;
        height: 53px;
        text-transform: uppercase;
        line-height: 53px;
        text-align: center;
        border: none
    }

    .login-box .check-container {
        color: #acc6da;
    }

    .login-box .checkmark {
        height: 13px;
        width: 13px;
        border-color: #6a8098;
        background: none !important;
    }

    .login-box .check-container .checkmark:after {
        border-color: #acc6da;
        top: 1px;
        left: 3px;
    }

    .login-box + div {
        max-width: 270px;
        margin-top: 5px !important;
    }

        .login-box + div a {
            font-size: 11px;
            color: #90bada
        }

.mobile-menu-toggle .fas {
    font-size: 18px;
    color: #428bca !important;
    padding: 10px;
    width: 35px;
    height: 35px;
    color: #FFF;
    line-height: 17px;
    border-radius: 3px;
}
/*------------------------------------------- TABS ------------------------------------------*/
.tab_controlBox {
    margin-top: 30px;
    margin-bottom: 18px;
}

.tabs_controll li, .tabs_controll li.nav-item a {
    margin-right: 10px !important;
    background: #f0f0f0;
    color: #2f7dc0;
    padding: 10px 15px !important;
    font-size: 15px !important;
    border: solid 1px #f0f0f0 !important;
    border-bottom: 0px !important;
    cursor: pointer !important;
    border-top: 4px solid transparent !important;
}

    .tabs_controll li.nav-item {
        padding: 0 !important;
        margin: 0 !important;
        background: none;
        border: none !important;
    }

    .tabs_controll li a {
        color: #2f7dc0;
        padding: 0;
        height: auto !important;
        width: auto !important;
        margin: 0 !important;
        line-height: normal !important;
        border: none !important;
    }

        .tabs_controll li a:hover {
            color: #555555 !important;
        }

    .tabs_controll li:hover, .tabs_controll li.tabs_controll-active, .tabs_controll li.nav-item:hover a, .tabs_controll li.nav-item a.active {
        background: #ffffff !important;
        border-left: solid 1px #dddddd !important;
        border-right: solid 1px #dddddd !important;
        border-bottom: solid 1px #fff !important;
        border-top: solid 4px #f3565d !important;
        color: #555555 !important;
        margin-bottom: -1px !important;
    }

    .tabs_controll li.nav-item:hover {
        border: none !important;
        margin: 0 !important;
    }

.tabs_controll-active a {
    color: #555555 !important;
}

.tabs_controll-panel .jtable-main-container {
    padding: 18px 0 20px;
}

.tabs_controll {
    border-bottom: solid 1px #dddddd;
}

.btn-link-nos a {
    text-decoration: underline;
    font-weight: bold;
    display: inline-block;
    vertical-align: middle;
    color: #000;
    padding: 0 5px;
}

#jstree-educational-activities {
    max-height: calc(100vh - 290px);
    overflow: auto
}

#education-activity-map .modal-dialog {
    max-width: 1000px;
}
/*------------------------------- END TABS ------------------------------------------------*/
#brdcrmb ul {
    display: flex;
    font-size: 14px;
    line-height: normal;
    margin: 0;
    padding: 0 5px;
    border: none
}

#brdcrmb li {
    padding: 0 5px !important;
}

#brdcrmb ul li, #brdcrmb ul li a {
    white-space: nowrap
}

#brdcrmb ul a {
    color: #FFF;
    text-decoration: none;
    padding: 0;
}

.js-tree-check {
    position: relative;
    height: 24px;
    line-height: 24px !important;
    width: auto !important;
    padding-left: 24px;
}

    .js-tree-check input {
        position: absolute;
        height: 24px;
        width: 24px;
        opacity: 0;
        z-index: 10;
        left: 6px;
        top: 6px;
    }

    .js-tree-check .jstree-checkmark {
        height: 24px;
        width: 24px;
        background: url("../Scripts/JSTREE/dist/themes/default/32px.png");
        background-position: -164px -4px;
        position: absolute;
        left: 0;
        top: 0;
    }

    .js-tree-check input:checked ~ .jstree-checkmark {
        background-position: -228px -4px;
    }

.w-auto {
    width: auto;
    max-width: unset;
}

input.w-100 {
    width: auto;
    max-width: 100% !important;
}

.transform-none {
    text-transform: none !important;
}

@keyframes round {
    0% {
        transform: rotate(1deg);
    }

    100% {
        transform: rotate(360deg);
    }
}
/* Task Details style start point */
.taskDetail_value {
    margin: 10px 0px 0px 0px;
    border-top: dotted 1px #c5c5c5;
    padding: 6px 0px;
    display: flex;
    flex-wrap: wrap;
}

    .taskDetail_value li {
        padding: 0px 11px;
        width: 16.6667%;
        flex: 0 0 16.667%;
        max-width: 66.667%;
        border-right: dotted 1px #c5c5c5;
        font-size: 13pt;
        color: #212e3c;
        text-align: center;
        flex-grow: 1
    }

        .taskDetail_value li img {
            width: 29px
        }

        .taskDetail_value li:last-child {
            border: none
        }

        .taskDetail_value li span {
            font-size: 12pt;
            color: #319481;
        }

.lightGrey_btn2 {
    background: #4dbdc3 !important;
    color: #fff !important;
    font-size: 10pt;
    border: none !important;
    height: auto !important;
    padding: 9px 9px 9px 9px;
    -webkit-transition: background 0.2s linear;
    -moz-transition: background 0.2s linear;
    -o-transition: background 0.2s linear;
    transition: background 0.2s linear;
    cursor: pointer;
}

.grey-label {
    background: #ececec;
    padding: 3px 10px;
    color: #303d50
}

    .grey-label b {
        color: #000;
        font-weight: 600;
    }

.taskDetailHeaderLeft {
    font-size: 16px;
    color: #319481;
    flex-wrap: wrap;
}

.filter-by {
    color: #3d6090
}

.taskDetailHeaderLeft p {
    color: #d35400;
    font-weight: bold;
    margin-top: 12px;
}

.task_detail_refBox h4 {
    color: #277ac2;
    font-size: 12pt;
    display: inline-block;
    margin-right: 3px;
}

.task_detail_refBox span {
    color: #000;
    font-size: 12pt;
}

.taskDetailHeaderLeft select {
    width: 200px;
    height: 30px !important;
    line-height: 22px;
}

.taskDetailHeaderLeft button {
    height: 30px !important;
}

.task_detail_sep {
    display: inline-block;
    width: 1px;
    margin: 0px 20px;
    height: 24px;
    background: #cdcdcd;
    margin-bottom: -7px;
}

.tdColQuestion {
    text-align: left;
    /*width: 60%;
    vertical-align: top;
    padding: 4px*/
}

.tdColAction {
    /*width: 20%;
    text-align: center;
    vertical-align: top;
    padding: 4px;*/
    border-left: 1px solid #e9e9e9;
    text-align: center !important;
}

.taskDetailsContainer table td:first-child, .taskDetailsContainer table td:nth-child(2) {
    text-align: center !important;
}

.tdColText_Align {
    text-align: left;
    width: 46%;
    flex-grow: 1;
}
/* Task Details style end point */
.content.blue-print .card-header, .content.blue-print .card {
    padding: 0;
    border-radius: 0 !important;
    margin-bottom: 1px;
    border: none !important;
}


.content.blue-print .card-header {
    margin-bottom: 0px;
}

    .content.blue-print .card-header button {
        background: #2a3e4f;
        width: 100%;
        border-radius: 0 !important;
        padding: .5rem .75rem;
        color: #FFF;
        text-align: left;
        text-decoration: none !important;
        position: relative;
        /*padding-right;*/ /*Mr. Waqas asked 2021-05-17*/
        white-space: normal;
    }

        .content.blue-print .card-header button::after {
            content: url("../Content/images/collapse-arrow.png");
            position: absolute;
            top: 6px;
            right: 15px;
        }


    .content.blue-print .card-header.no-hover-card {
        background: #428bca;
        width: 100%;
        border-radius: 0 !important;
        padding: .5rem .75rem;
        color: #FFF;
        text-align: left;
        text-decoration: none !important;
        position: relative;
        /*padding-right;*/ /*Mr. Waqas asked 2021-05-17*/
        white-space: normal;
    }

        .content.blue-print .card-header.no-hover-card::after {
            content: url("../Content/images/collapse-arrow.png");
            position: absolute;
            top: 6px;
            right: 15px;
        }



    .content.blue-print .card-header button.collapsed {
        background: #428bca
    }

        .content.blue-print .card-header button.collapsed::after {
            transform: rotate(180deg);
            top: 12px;
        }

.black-btn {
    border: none;
    background: #000;
    height: 29px;
    line-height: 29px;
    min-width: 100px;
    padding: 0 15px;
    color: #FFF !important;
    display: inline-block;
    text-align: center;
    cursor: pointer;
    text-decoration: none !important;
}

.br-3 {
    border-radius: 3px;
}

.tree-line .collapse-parent .border::before, .collapse-parent > div .col::before {
    display: none
}

h4.blue {
    font-size: 16px;
    color: #246a99;
}

.no-layout {
    table-layout: unset !important;
}

.h-38 {
    height: 38px;
    line-height: 38px
}

#w-invitation .border-left {
    border-color: #b9b9b9
}

.w-auto {
    width: auto !important;
}

.third-step-sidebar {
    width: 90px;
}

.bg-orange {
    background: #f5ab35
}

.headingbar-sblue {
    background: #b5e5f5;
}

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

.list-striped {
    list-style-type: none;
    padding: 0;
    margin: 0;
}

    .list-striped li {
        display: block;
        width: 100%;
        line-height: 32px;
        background: #f5f5f5;
        padding: 0 15px;
    }

        .list-striped li:nth-child(even) {
            background: #e3e3e3;
        }

.green-search {
    border: none;
    padding: 0;
    height: auto;
}

    .green-search .border.relative {
        border: 3px solid #009b90 !important;
    }

        .green-search .border.relative button {
            background: none;
            color: #e3e3e3;
            font-size: 14px;
        }

.filter-criteria-row h4 {
    font-size: 14px;
    color: #225781;
    font-weight: 600;
    text-transform: uppercase;
    position: absolute;
    top: -20px;
}

.filter-criteria-row .col ul {
    max-height: 190px;
    overflow-y: auto;
}

.filter-criteria-row .col .scope-tree {
    background: #f5f5f5;
    height: 190px;
    overflow-y: auto;
    padding: 0 10px 10px;
}

    .filter-criteria-row .col .scope-tree > .row {
        margin-left: 0;
        margin-right: 0;
    }

.table-green th {
    background: #009b90 !important;
    font-weight: normal
}

.table-green td {
    background: #8fbc8f;
    font-size: 11px;
    padding: 5px 15px !important;
    vertical-align: middle !important;
    border-color: #f0f0f0 !important;
}

    .table-green td .table-inner-collapse td {
        background: #FFF;
    }

    .table-green td .no-wrap a {
        color: #FFF;
    }

    .table-green td[colspan="5"] {
        padding-top: 0 !important;
        padding-bottom: 0 !important;
        background: #F5F5F5;
    }

.table-green .blue-bg {
    background: #0abde3 !important;
    color: #FFF;
    font-weight: bold
}

.table-green td input {
    margin: 0 !important;
    line-height: normal;
    vertical-align: middle
}

.table-icon-links {
    width: 105px;
}

.h-value {
    background: #77c1d9;
    width: 199px;
    margin-right: 185px;
    color: #000
}

    .h-value > span {
        width: 70px;
    }

    .h-value + .black-btn {
        position: absolute;
        right: 5px;
        top: 5px;
        min-width: unset;
        padding: 0 10px;
    }

        .h-value + .black-btn + .black-btn {
            position: absolute;
            right: 93px;
            top: 5px;
            padding: 0 10px;
            min-width: unset;
        }



.f-normal {
    font-style: normal;
}

td.purple-bg {
    background: #a96dad !important;
    color: #FFF !important;
    font-weight: bold
}

.scope-tree > .row, .scope-tree .collapse-parent > .border + div > .row {
    margin-top: 5px;
}

.scope-tree > .row {
    position: relative
}

    .scope-tree > .row::before {
        content: "";
        width: 1px;
        position: absolute;
        left: 21px;
        background: #333;
        top: 0px;
        bottom: -5px;
    }

.scope-tree {
    position: relative;
}

    .scope-tree > .row:last-child::before {
        height: 17px;
    }

    .scope-tree > .row:first-child::before {
        top: 15px;
    }

    .scope-tree.single > .row::before {
        display: none;
    }

    .scope-tree .collapse-parent > div.border.green {
        border-color: #9ddea3 !important;
        background: #9ddea3;
        position: relative;
        z-index: 10;
        margin-bottom: 0px !important;
    }

    .scope-tree .collapse-parent > div.border.yellow-bar {
        background: #ffffc8;
        position: relative;
        z-index: 10;
        margin-bottom: 0px !important;
    }

    .scope-tree .collapse-parent > div.border.sblue-bar {
        background: #c8ffff;
        position: relative;
        z-index: 10;
        margin-bottom: 0px !important;
    }

    .scope-tree .collapse-parent > div.border.green-bar {
        background: #9DDEA3;
        position: relative;
        z-index: 10;
        margin-bottom: 0px !important;
        border-color: #9DDEA3 !important;
    }

    .scope-tree .collapse-parent > div.border.red-bar {
        background: #ffc8c8;
        position: relative;
        z-index: 10;
        margin-bottom: 0px !important;
    }

    .scope-tree.tree-line .collapse-parent div.border::after {
        content: "";
        height: 1px;
        left: -16px;
        position: absolute;
        width: 16px;
        background: #333;
        top: 16px;
    }

    .scope-tree.tree-line .collapse-parent .no-collapse-line + div > .border::after {
        width: 15px;
        left: -15px;
    }

.no-collapse-line {
    width: 32px;
}

.scope-tree .collapse-parent .col-auto[data-toggle="collapse"]::after {
    content: "";
    bottom: 0;
    top: -29px;
    background: #000;
    width: 1px;
    left: 21px;
    position: absolute
}

/*.scope-tree .collapse-parent div > .row:last-child > .col-auto[data-toggle="collapse"]::after {
    height: 47px;
    bottom: auto;
}*/
.scope-tree .collapse-parent .scope-tree:last-child > .row > .col-auto::after, .col-auto.no-collapse-line::after, .scope-tree .collapse-parent > .border + div > .row:last-child > .col-auto::after {
    bottom: auto;
    height: 47px;
}

.scope-tree .collapse-parent > div > .col::before, .scope-tree .collapsed + .collapse-parent .col::before, .border.iconfree::after {
    content: "" !important;
    display: none
}

.scope-tree.single::before, .scope-tree.single > .row > .col-auto::after, .col-auto[data-toggle="collapse"].no-collapse-line::before {
    display: none !important;
}

.no-child-data::before, .no-child-data .col-auto[data-toggle="collapse"]::before, .scope-tree.tree-line .no-child-data .collapse-parent > div.border::after {
    display: none
}

.no-child-data > .col-auto {
    width: 32px;
}

.left-Direction {
    direction: ltr;
}

.right-Direction {
    direction: rtl;
}
/*--------------------------Item Utilization ---------------------------*/
.pipeSign {
    text-decoration: underline;
    border-left: 1px solid #535353 !important;
    line-height: 14px;
    padding: 0 5px;
    margin: 2px 0;
}
/*--------------------------Item Utilization END------------------------*/
/*----------------------------------------CREATE ITEM-----------------------------------------*/
/*.letter {
    padding-right: 19px;
    padding-left: 2px;
    width: 5%;
}*/
/*.modal:nth-of-type(2) {
    z-index: 1052 !important;
}

.modal:nth-of-type(1) {
    z-index: 1052 !important;
}

.modal-backdrop.show:nth-of-type(3) {
    z-index: 1053 !important;
}

.modal-backdrop.show:nth-of-type(2) {
    z-index: 1051 !important;
}*/

label.m-0.col-auto.letter {
    width: 25px !important;
    text-align: center;
}

.linkActiveEffect {
    font-size: 15px;
    margin-top: -3px;
    color: #273c75 !important;
}

.viewLinks {
    cursor: pointer;
    color: #3598db;
    font-weight: bold;
}

.tableOuterpadding {
    padding: 6px 8px;
    background: #efefef;
    margin: 1px;
    border: solid 1px #dadada;
    color: #3c5e75;
}

.vignetteoverflow {
    overflow-x: hidden;
    overflow-y: auto;
}

.redclassfication_text {
    text-align: right;
    font-size: 11px;
    color: #8b0000;
    margin: 6px 0px;
    padding-right: 12px;
}


.FieldContainer .optionTextboxPopup {
    width: calc(100% - 40px);
}

.OrderingField {
    margin-bottom: 10px
}

    .OrderingField div.Commands {
        width: 20px;
        padding: 0;
        display: flex;
        flex-direction: column;
    }

.FieldContainer button {
    background: none;
    border: none;
    height: 12px;
    line-height: 12px;
    padding: 0;
}

.audio-img-center {
    display: flex;
    align-items: center;
    justify-content: center;
}

.optionLegends {
    font-size: 11px;
    margin: 4px 5px -10px;
    background: #bbbaba66;
    border-radius: 4px;
    padding: 7px 0px 5px 8px;
    display: none;
}

.lblLegends {
    margin-left: 10px;
}

.rdLegends {
    margin-left: 20px;
}

.content-area h3 {
    font-size: 18px;
    color: #225781;
    font-weight: 600;
    text-transform: uppercase;
}

.selectedClassificationContainer .activityHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #e2f2ff;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainer .activityHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainer .educationalDomainHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #f6e7e7;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainer .educationalDomainHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainer .objectiveHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #e8e7fb;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainer .objectiveHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainer table th {
    color: #428bca !important;
}

.selectedClassificationContainer_V .activityHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #e2f2ff;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainer_V .activityHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainer_V .educationalDomainHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #f6e7e7;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainer_V .educationalDomainHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainer_V .objectiveHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #e8e7fb;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainer_V .objectiveHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainer_V table th {
    color: #428bca !important;
}

.item_writing_serialBox {
    padding: 6px 10px 6px 10px;
    background: #f7f5f7;
    border-radius: 6px;
    margin-right: 95px;
    margin-top: 14px;
    font-size: 13pt;
    font-weight: normal;
    margin-right: 0px;
}

.selectedClassificationContainerPopUp .activityHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #e2f2ff;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainerPopUp .activityHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainerPopUp .educationalDomainHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #f6e7e7;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainerPopUp .educationalDomainHeader img {
        width: 12px;
        margin-left: 15px;
    }

.selectedClassificationContainerPopUp .objectiveHeader {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 500;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #e8e7fb;
    width: 100%;
    line-height: 28px;
}

    .selectedClassificationContainerPopUp .objectiveHeader img {
        width: 12px;
        margin-left: 15px;
    }

.floatLeft {
    float: left;
    position: relative;
}

.floatLR {
    float: left;
    position: relative;
}

.floatR_L {
    float: right;
}

.floatL_R {
    float: left;
}

.floatRL {
    float: right;
    position: relative;
}

.importItem_alert {
    margin-bottom: 12px;
    color: #fff;
    font-size: 13px;
    background: #cd5c5c;
    padding: 10px 8px;
}

.itemContainerFooter {
    color: #ab491e;
    font-size: 11px;
    padding: 4px;
    margin-bottom: 20px;
}

.boxMinheight {
    min-height: 100px;
}

.option_detailBox {
    color: #465559;
    font-size: 13px;
    margin: 15px 0px;
    display: flex;
    align-items: center;
}

.option_detailBoxInner {
    border: solid 1px #b5b5b5;
    padding: 6px 10px;
    display: inline-block;
    width: calc(100% - 85px);
    min-height: 30px;
    word-wrap: break-word;
    outline: none;
    font-size: 11px;
    display: block;
    overflow: hidden !important;
}

/*body.rtl .option_detailBoxInner {
    text-align: right !important;
}
*/
.option_check_boxes {
    min-width: 50px;
    display: table-cell;
    vertical-align: middle;
}

    .option_check_boxes input {
        display: inline-block;
        vertical-align: middle
    }

.option_close {
    min-width: 10px;
    display: table-cell;
    vertical-align: middle;
    margin-left: 5px;
}

.options_scroll {
    min-height: 195px;
    max-height: 195px;
    width: 100%;
    overflow-y: auto;
    overflow-x: hidden;
}

    .options_scroll::-webkit-scrollbar {
        width: 10px;
    }

    .options_scroll::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .options_scroll::-webkit-scrollbar-thumb {
        background: #ccc;
    }

        .options_scroll::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

.options_scroll_fib {
    min-height: 195px;
    max-height: 195px;
    width: 100%;
}

    .options_scroll_fib::-webkit-scrollbar {
        width: 10px;
    }

    .options_scroll_fib::-webkit-scrollbar-track {
        background: #f1f1f1;
    }

    .options_scroll_fib::-webkit-scrollbar-thumb {
        background: #ccc;
    }

        .options_scroll_fib::-webkit-scrollbar-thumb:hover {
            background: #555;
        }

.create_itemText {
    color: #212529;
    font-size: 11px;
    text-align: justify;
    line-height: 15px;
    word-wrap: break-word;
    outline: none;
    font-weight: 400 !important;
}

.main_Container {
    padding: 10px;
    background: #fff;
}

.light_green_btn {
    background: #78cd51;
    color: #fff !important;
    font-size: 10pt;
    border: 0px;
    padding: 0px 15px;
    min-width: 100px !important;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
}

    .light_green_btn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
    }

    .light_green_btn:disabled {
        background: #cacaca;
        color: #b0b0b0;
    }

.dark_green_btn {
    background: #7BAA80;
    color: #fff;
    font-size: 10pt;
    border: 0px;
    padding: 9px 9px 9px 9px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
    width: 20%;
}

    .dark_green_btn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
    }

    .dark_green_btn:disabled {
        background: #cacaca;
        color: #b0b0b0;
    }


#btnDraft {
    background-color: #5ab097 !important;
}

.item_btn_footer {
    text-align: right;
    margin-bottom: 15px;
}

.light_blue_btn {
    background-color: #37bec4 !important;
    color: #fff !important;
    font-size: 10pt !important;
    border: 0px !important;
    padding: 9px 9px 9px 9px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer !important;
    display: inline-block;
    width: auto
}

    .light_blue_btn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
    }

    .light_blue_btn:disabled {
        background: #cacaca;
        color: #b0b0b0;
    }

#btn_pairedItme_finished input {
    width: 150px;
}

#btn_Finish_PairedItem_grid {
    background-color: #5ab097 !important;
}

/*#dvItemsList > div > table > thead > tr > th {
    text-align: left !important;
}*/

.classification_footer {
    text-align: right;
    /* padding-right: 10px; */
    padding-top: 5px;
    clear: both;
}

.ui-draggable .ui-dialog-titlebar {
    background: #428bca !important;
}

.ui-widget-header .ui-icon {
    background: url("../Content/css/images/ui-icons_ef8c08_256x240.png");
    background-position: -96px -128px !important;
}

.ui-dialog .ui-dialog-titlebar-close {
    font-size: 0;
}


#itemDetail_filter_div {
    font-size: 14px;
    background-color: #b3cfe4;
    margin: 0px 15px 0px 15px;
    padding: 0px 0px 0px 7px;
}

#itemDetail_draft_filter_div {
    font-size: 14px;
    background-color: #b3cfe4;
    margin: 0px 15px 0px 15px;
    padding: 0px 0px 0px 7px;
}

#select_Final_Submit_Popup label {
    color: #3773a7;
    font-weight: normal;
    padding: 0px 0px 0px 7px;
}

#select_Final_Submit_Popup {
    display: none;
    padding: 0px 0px 40px 0px !important;
    margin-bottom: 30px;
}

    #select_Final_Submit_Popup input {
    }

    #select_Final_Submit_Popup h3 {
        margin: 10px 0px 5px 20px;
        font-weight: bold;
        font-size: 18px;
    }

#btn_pairedItme_finished label {
    color: #3773a7;
    font-size: 18px;
}

#txtAutoComplete {
}

    #txtAutoComplete > span {
        width: 112px;
        height: 30px;
    }

    #txtAutoComplete input {
        width: 255px;
        margin: 5px;
        height: 39px;
    }

#txtSearchInitiatorDraft {
    width: 255px;
    margin: 5px;
    height: 39px;
}

#ulClassification {
    min-width: 400px;
    margin: 20px auto 0px auto;
}

#ulClassificationDraft {
    min-width: 400px;
    margin: 20px auto 0px auto;
}

table#ulClassification tbody tr td:nth-child(1), table#ulClassification tbody tr td:nth-child(2) {
    border-right: 1px solid #ddd;
}

table#ulClassificationDraft tbody tr td:nth-child(1), table#ulClassificationDraft tbody tr td:nth-child(2) {
    border-right: 1px solid #ddd;
}

table#ulClassificationDraft tbody tr:first-child, table#ulClassificationDraft tbody tr:first-child {
    text-align: center;
}

.itemDetailSearchBtn a img {
    cursor: pointer !important;
}

#imgAddedClassification {
    cursor: pointer;
    display: none;
    position: absolute;
    margin: 24px 0px 0px 15px;
}

#imgAddedClassificationDraft {
    cursor: pointer;
    display: none;
    position: absolute;
    margin: 24px 0px 0px 15px;
}

.popup_textFieldBoxLeft {
    display: block;
}

.popup_textFieldBoxLeft0 {
    display: block;
}

.blue_btn {
    margin: 0px 0px 0px 0px !important;
}

.spItemComponents {
    padding-left: 19px;
}

.spClassification {
    padding: 5px 5px 5px 43px;
}

.lblItemComponents, .lblObjective {
    min-width: 120px;
}

.lblActivity, .lblEducationalDomain {
    min-width: 134px
}

#ddItemDetailObjective {
    width: 539px;
    margin: 5px;
    -webkit-appearance: initial
}

#ddItemDetailObjectiveDraft {
    width: 539px;
    margin: 5px;
    -webkit-appearance: initial
}

#lblLanguageHead {
    float: left;
    margin: 8px;
}

#img_RefreshFilter {
    cursor: pointer;
}

#img_FilterItem {
    cursor: pointer;
}

#img_RefreshFilterDraft {
    cursor: pointer;
}

#img_FilterItemDraft {
    cursor: pointer;
}

.textEditorPlugin .toolbar {
    right: auto !important;
}

.textEditorPlugin #optionsMatching .toolbar {
    left: 100px;
}

.v-middle {
    vertical-align: middle
}

.ucVignettePopupContainer {
    width: 100%;
    float: left;
    padding: 10px 10px 10px 10px;
    text-align: justify;
    margin-left: 4px;
}

.ucVignetteMediaContainer {
    width: 39%;
    float: right;
    padding: 20px 0px 0px 0px;
}

.yellow_btn {
    background: #fdd761 !important;
    color: #010101;
    font-size: 10pt;
    border: 0px;
    padding: 9px 9px 9px 9px;
    -webkit-transition: background 0.2s linear;
    -moz-transition: background 0.2s linear;
    -o-transition: background 0.2s linear;
    transition: background 0.2s linear;
    cursor: pointer;
    margin: 0px;
}

    .yellow_btn:hover {
        background: #ffc100;
    }

    .yellow_btn:disabled {
        background: #cacaca;
        color: #b0b0b0;
        cursor: auto;
    }

.item_top_btnBox {
    text-align: left;
}

.classification_detailBox {
    color: #465559;
    font-size: 13px;
}

.back_btn_div {
    font-size: 11px;
    color: #d85443;
    float: right;
    margin-left: 6px;
    margin-top: 6px;
}

    .back_btn_div a {
        font-size: 11px;
        color: #d85443;
        text-decoration: none;
    }

.Data_Container h1 {
    margin: 0px;
    /* padding: 7px 10px; */
    color: #FFF;
    background: #428bca;
    text-transform: uppercase;
    font-size: 12pt;
    padding-left: 10px;
    height: 35px;
    line-height: 32px;
}

#DivGroup > div {
    padding: 10px;
}

.infoIcon_img {
    width: 20px;
    height: 22px;
    background: url(../Content/images/icons_set.png) no-repeat -464px -78px;
    margin: 2px 1px 0px 1px;
    cursor: pointer;
}

.negativeWord {
    color: #8b0000;
}

.highlight {
    background: red;
    color: white;
}

#divTestDetailTable {
    display: none;
    max-height: 235px;
    margin-top: 14px;
    overflow-y: scroll;
    overflow: auto;
    padding: 0;
}

.save_and_add_btn {
    width: 145px !important;
    padding: 6px 0px !important;
    background: #78cd51 !important;
    font-size: 10pt !important;
    border: 0px !important;
    color: #fff !important;
    cursor: pointer !important;
    text-align: center !important;
    margin: 0px 4px !important;
    -webkit-transition: all 0.2s linear !important;
    -moz-transition: all 0.2s linear !important;
    -o-transition: all 0.2s linear !important;
    transition: all 0.2s linear !important;
}

    .save_and_add_btn:hover {
        background: #4e9f29 !important;
    }

.save_btn {
    width: 77px !important;
    padding: 6px 0px !important;
    background: #78cd51 !important;
    font-size: 10pt !important;
    border: 0px !important;
    color: #fff !important;
    cursor: pointer !important;
    text-align: center !important;
    margin: 0px 4px !important;
    -webkit-transition: all 0.2s linear !important;
    -moz-transition: all 0.2s linear !important;
    -o-transition: all 0.2s linear !important;
    transition: all 0.2s linear !important;
}

    .save_btn:hover {
        background: #4e9f29 !important;
    }

    .save_btn:disabled {
        background: #cacaca !important;
        color: #b0b0b0 !important;
    }

.cancel_btn {
    width: 77px !important;
    padding: 6px 0px !important;
    background: #ff6c60 !important;
    font-size: 10pt !important;
    text-align: center !important;
    cursor: pointer !important;
    border: 0px !important;
    color: #fff !important;
    margin: 0px 3px 0px 0px !important;
    -webkit-transition: all 0.2s linear !important;
    -moz-transition: all 0.2s linear !important;
    -o-transition: all 0.2s linear !important;
    transition: all 0.2s linear !important;
}

    .cancel_btn:hover {
        background: #ff1603 !important;
    }

.btn_adjsBox1 {
    float: right;
}

.questionText {
    width: 80%;
    text-align: left !important;
}

.questionAction {
    width: 17%;
    border-left: 1px solid #c5c5c5;
    text-align: center;
}

.pairedDraftedItemActions {
    float: right;
    margin-right: 35px;
    margin-top: 4px;
}

.highlight {
    background: red;
    color: white;
}

/*================================ MULTI MEDIA=====================================*/
#txtReference {
    width: 285px;
    margin-left: 116px;
    position: absolute;
    top: 4px;
}

.insertMediaContainer {
    float: right !important;
}

    .insertMediaContainer input {
        border: none !important;
        vertical-align: middle
    }
/*================================ MULTI MEDIA=====================================*/
/*================================ MULTI SELECT=====================================*/
.multiselect-native-select {
    width: 100%;
    display: block;
    border: 1px solid #b6b6b6 !important;
}

    .multiselect-native-select .btn-group {
        width: 100%;
    }

        .multiselect-native-select .btn-group button {
            text-align: left;
            font-size: 14px;
            overflow: hidden;
            text-overflow: ellipsis;
            padding-right: 25px;
            width: 100%;
            border: none !important;
            outline: 0 !important;
        }

.caret {
    position: absolute;
    right: 10px;
    top: calc(50% - 3px);
    height: 6px;
    width: 10px;
    background: url(../Content/images/caret-down-n.jpg) no-repeat;
}

.multiselect-native-select .btn-group button + ul {
    border-radius: 0;
    left: -1px !important;
    right: -1px;
    width: calc(100% + 2px);
    top: calc(100% - 2px) !important;
    padding: 5px 0;
    transform: none !important;
}

    .multiselect-native-select .btn-group button + ul li {
        display: block;
        width: 100%;
    }

        .multiselect-native-select .btn-group button + ul li a {
            display: block;
            color: #535353;
        }

@-moz-document url-prefix() {
    .multiselect-native-select .btn-group button {
        width: 250px;
    }
}
/*================================ MULTI SELECT END=====================================*/
/*================================ MEDIA ===============================================*/
.TagsHeading {
    font-size: 15px;
}

.accept_btn {
    width: 77px !important;
    padding: 6px 0px !important;
    background: #25afb4 !important;
    font-size: 10pt !important;
    border: 0px !important;
    color: #fff !important;
    cursor: pointer !important;
    text-align: center !important;
    margin: 0px 4px !important;
    -webkit-transition: all 0.2s linear !important;
    -moz-transition: all 0.2s linear !important;
    -o-transition: all 0.2s linear !important;
    transition: all 0.2s linear !important;
}

    .accept_btn:hover {
        background: #17787c;
    }

.back_btn {
    width: 77px !important;
    padding: 6px 0px !important;
    background: #d09d04 !important;
    font-size: 10pt !important;
    border: 0px !important;
    color: #fff !important;
    cursor: pointer !important;
    text-align: center !important;
    margin: 0px 4px !important;
    -webkit-transition: all 0.2s linear !important;
    -moz-transition: all 0.2s linear !important;
    -o-transition: all 0.2s linear !important;
    transition: all 0.2s linear !important;
}

    .back_btn:hover {
        background: #b28603 !important;
    }

/*.upload_imgText {
    font-size: 10px;
    color: #777777;
    line-height: 14px;
}

    .upload_imgText p {
        color: #922712;
        margin: 5px 0px;
    }*/


.upload-file input[type=file] {
    position: absolute;
    opacity: 0;
    z-index: 8;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
}

#uploadmedia h5 {
    color: #22618c;
    font-size: 14px;
    font-weight: 800
}

.tags .tag {
    margin: 5px 3px;
    padding: 5px;
    background: #f7f7f7;
    border: 1px solid #aaaaaa;
    border-radius: 3px;
    display: inline-block;
    color: #333333;
    background: -moz-linear-gradient(top, #f7f7f7 0%, #f0f0f0 39%, #f0f0f0 39%, #e8e8e8 40%, #efefef 99%, #f3f3f3 100%);
    background: -webkit-linear-gradient(top, #f7f7f7 0%,#f0f0f0 39%,#f0f0f0 39%,#e8e8e8 40%,#efefef 99%,#f3f3f3 100%);
    background: linear-gradient(to bottom, #f7f7f7 0%,#f0f0f0 39%,#f0f0f0 39%,#e8e8e8 40%,#efefef 99%,#f3f3f3 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#f7f7f7', endColorstr='#f3f3f3',GradientType=0 );
}

    .tags .tag a {
        color: #333;
        text-decoration: none;
    }

.notification {
    border: 1px solid #2975a9;
    position: absolute;
    top: 40px;
    left: 30px;
    right: 30px;
    background: #FFF;
    z-index: 1056;
    /*width: 39%;
    left: 32%;
    top: 12%;*/
}

    .notification > div:first-child {
        background: #e0f2ff;
    }

    .notification .filter {
        margin-top: 5px;
        padding-top: 5px;
        border-top: 1px solid #8dcfff
    }

    .notification b {
        color: #1e557b;
    }

    .notification .green-btn, .notification .red-btn {
        height: 30px;
        line-height: 20px;
        width: 78px;
    }

    .notification .green-btn {
        background: #25afb4;
        border-color: #25afb4
    }

.notification_upload {
    border: 1px solid #2975a9;
    position: absolute;
    top: 40px;
    left: 30px;
    right: 30px;
    background: #FFF;
    z-index: 1056;
    /*width: 39%;
    left: 32%;
    top: 12%;*/
}

    .notification_upload > div:first-child {
        background: #e0f2ff;
    }

    .notification_upload .filter {
        margin-top: 5px;
        padding-top: 5px;
        border-top: 1px solid #8dcfff
    }

    .notification_upload b {
        color: #1e557b;
    }

    .notification_upload .green-btn, .notification_upload .red-btn {
        height: 30px;
        line-height: 20px;
        width: 78px;
    }

    .notification_upload .green-btn {
        background: #25afb4;
        border-color: #25afb4
    }

.root_addmore_main {
    margin-left: auto;
    margin-right: 30px;
    cursor: pointer;
}

.check-container.black-dot input:checked ~ .checkmark {
    background: #FFF;
}

    .check-container.black-dot input:checked ~ .checkmark::after {
        content: "";
        display: block;
        background: #000;
        height: 6px;
        width: 6px;
        position: absolute;
        top: calc(50% - 3px);
        left: calc(50% - 3px);
        border-radius: 50%;
        border: none;
    }
/*================================ MEDIA END============================================*/

/*================================ 31-March-2020  ======================================*/
.popup_notification_style1Element {
    background: #303030;
    border-radius: 6px;
    position: absolute;
    width: 405px;
    height: 75px;
    right: -10px;
    top: -73px;
    z-index: 10;
}

.popup_notification_style1 {
    background: #303030;
    border-radius: 6px;
    position: absolute;
    width: 405px;
    height: 75px;
    right: -10px;
    top: -73px;
    z-index: 10;
}

.popup_notification_style1Arrow {
    width: 22px;
    height: 11px;
    background: url(../Content/images/icons_set.png) no-repeat -300px 0px;
    position: absolute;
    bottom: -10px;
    right: 45px;
}

.popup_notification_img {
    width: 27px;
    height: 30px;
    background: url(../Content/images/icons_set.png) no-repeat -272px 0px;
    float: left;
    margin: 16px 0px 0px 15px;
}

.popup_notification_TextElement {
    float: left;
    font-size: 11px;
    width: 350px;
    /*margin-top: 18px;*/
    margin-left: 13px;
}

.popup_notification_Text {
    float: left;
    font-size: 11px;
    width: 350px;
    /*margin-top: 18px;*/
    margin-left: 13px;
}

.popup_notification_TextRed {
    color: #e80000;
}

.popup_notification_Yellow {
    color: #ffc153;
}

.popUpNotificationClose {
    float: right;
    margin-right: 4px;
    padding: 10px 10px;
}
/*================================ 31-March-2020 END ======================================*/
/*================================  Dialog 31-March-2020 ================================ */
.success_dialogBox {
    width: 520px;
    border: solid 1px #c1d2b2;
    background: #dff0d8;
    padding: 12px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .success_dialogBox:hover {
        border: solid 1px #a9bd98;
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
    }

    .success_dialogBox h2 {
        color: #3c763d;
        font-size: 25pt;
    }

    .success_dialogBox p {
        font-size: 11px;
        color: #3c763d;
        margin-top: 2px;
    }

body.rtl .success_dialogBox {
    font-size: 13px;
}

    body.rtl .success_dialogBox p {
        font-size: 13px;
    }

.warning_dialogBox {
    width: 520px;
    border: solid 1px #ded1b5;
    background: #ffeed4;
    padding: 12px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .warning_dialogBox:hover {
        border: solid 1px #a79b82;
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
    }

    .warning_dialogBox h2 {
        color: #8a6d3b;
        font-size: 25pt;
    }

    .warning_dialogBox p {
        font-size: 11px;
        color: #8a6d3b;
        margin-top: 2px;
    }

body.rtl .warning_dialogBox p {
    font-size: 13px;
}

body.rtl .warning_dialogBox {
    font-size: 13px;
}

.info_dialogBox {
    width: 520px;
    border: solid 1px #29384a;
    background: #76A5AF;
    padding: 12px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .info_dialogBox:hover {
        border: solid 1px #29384a;
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
    }

    .info_dialogBox h2 {
        color: #fff;
        font-size: 25pt;
    }

    .info_dialogBox p {
        font-size: 11px;
        color: #fff;
        margin-top: 2px;
    }

body.rtl .info_dialogBox {
    font-size: 13px;
}

    body.rtl .info_dialogBox p {
        font-size: 13px;
    }

.confirmation_dialogBox {
    width: 520px;
    border: solid 1px #a7ced6;
    background: #d9edf7;
    padding: 12px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .confirmation_dialogBox:hover {
        border: solid 1px #73979e;
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
    }

    .confirmation_dialogBox h2 {
        color: #31708f;
        font-size: 25pt;
    }

    .confirmation_dialogBox p {
        font-size: 11px;
        color: #31708f;
        margin-top: 2px;
    }

.error_dialogBox {
    width: 520px;
    border: solid 1px #ebccd1;
    background: #f2dede;
    padding: 12px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .error_dialogBox:hover {
        border: solid 1px #bb9ba1;
        -webkit-box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
        box-shadow: 0 0 10px 0 rgba(0,0,0,0.3);
    }

    .error_dialogBox h2 {
        color: #a94442;
        font-size: 25pt;
    }

    .error_dialogBox p {
        font-size: 11px;
        color: #a94442;
        margin-top: 2px;
    }

body.rtl .error_dialogBox p {
    font-size: 13px;
}

body.rtl .error_dialogBox {
    font-size: 13px;
}

.dialog_bottom {
    text-align: right;
}

.dialog_yesBtn {
    width: 75px;
    padding: 9px 0px;
    font-size: 12px !important;
    background: #16a085;
    border: 0px;
    color: #fff;
    text-align: center;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
}

    .dialog_yesBtn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 #003f33;
        box-shadow: inset 0 0 10px 0 #003f33;
    }

.dialog_noBtn {
    width: 75px;
    padding: 9px 0px;
    font-size: 12px !important;
    background: #eb5055;
    border: 0px;
    color: #fff;
    text-align: center;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
}

    .dialog_noBtn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 #950c10;
        box-shadow: inset 0 0 10px 0 #950c10;
    }

.dialog_cancelBtn {
    width: 75px;
    padding: 9px 0px;
    font-size: 11px;
    background: #687273;
    border: 0px;
    color: #fff;
    text-align: center;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
}

    .dialog_cancelBtn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 #1f2323;
        box-shadow: inset 0 0 10px 0 #1f2323;
    }

.deleteImage {
    z-index: 1100;
    min-height: 8px;
    min-width: 8px;
    position: relative;
    display: inline-block;
    cursor: pointer;
    margin: -4px 4px 0 -12px;
    color: red;
    font-weight: 900;
    font-size: 9px;
    top: -5px;
}
/*.deleteImage {
    z-index: 1100;
    min-height: 8px;
    min-width: 8px;
    position: absolute;
    display: inline-block;
    cursor: pointer;
    margin: -4px 0 0 24px;
    color: red;
    font-weight: 900;
    font-size: 9px;
}*/
/*================================== Dialog 31-March-2020 End ==========================================*/
/*multi select datalist in create menuitem screen*/
/*=====================================CREATE ITEM END-==================================================*/
/*=======================================Item Writer Dashboard ============================================*/
.noteContainer {
    min-width: 10px;
    float: right;
    padding: 10px;
    font-size: 14px;
    color: #fff;
    top: 7px;
    right: 5px;
    margin: 0px;
    background: #0d986c;
}

.tabs_controll_selected {
    background: #ffffff !important;
    border-left: solid 1px #dddddd !important;
    border-right: solid 1px #dddddd !important;
    border-bottom: solid 1px #fff !important;
    border-top: solid 4px #f3565d !important;
    color: #555555 !important;
    padding: 8px 15px !important;
    margin-bottom: -1px !important;
    height: 21px;
}

.d-green-btn {
    display: inline-block;
    line-height: 40px;
    text-align: center;
    padding: 0 15px;
    color: #FFF !important;
    background: #16a085;
    font-size: 15px;
    text-decoration: none !important;
}

#divSelectSpecialtyDialog .specialtyTitle {
    text-align: left !important;
}

#add_Item_Select_Popup .itemTypeTitle {
    text-align: left !important;
}

#add_Item_Select_Popup label {
    color: #3498db;
}
/*=======================================Item Writer Dashboard END============================================*/
/*=======================================Review Item =========================================================*/

.modifyChanges_btn {
    background: #509a97;
    color: #fff !important;
    font-size: 10pt;
    border: 0px;
    padding: 9px 9px 9px 9px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
}

.modifyChanges:hover {
    -webkit-box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
    box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
}

.modifyChanges:disabled {
    background: #cacaca;
    color: #b0b0b0;
}

.light_brown_btn {
    background: #c2b49a;
    color: #fff !important;
    font-size: 10pt;
    border: 0px;
    padding: 9px 9px 9px 9px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
    cursor: pointer;
}

    .light_brown_btn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
    }

    .light_brown_btn:disabled {
        background: #cacaca;
        color: #b0b0b0;
    }

.reject_btn {
    width: 77px;
    padding: 10px 0px;
    background: #ff6c60;
    font-size: 10pt;
    text-align: center;
    cursor: pointer;
    border: 0px;
    color: #fff !important;
    margin: 0px 3px 0px 0px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .reject_btn:hover {
        -webkit-box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
        box-shadow: inset 0 0 10px 0 rgba(0, 0, 0, 0.5);
    }


.save_btn2 {
    width: 77px;
    padding: 10px 0px;
    background: #78cd51;
    font-size: 10pt;
    border: 0px;
    color: #fff !important;
    cursor: pointer;
    text-align: center;
    margin: 0px 4px;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .save_btn2:hover {
        background: #4e9f29;
    }

#divReviewButtons {
    padding: 0px 10px 10px 0px;
}

.assessment_accordianHeader {
    outline: none;
    border-radius: 0px;
    font-size: 12px;
    font-weight: normal;
    padding: 0px;
    border: 0px;
    margin-bottom: 1px;
    float: left;
    width: 100%;
}

.pairedItemAccordion_mainContainer .expanded {
    background-color: #2C3E50;
}

.pairedItemAccordion_mainContainer .collapsed {
    background-color: #546E7A;
}

.accordian_up_arrow {
    background: url(../Content/images/accordian_up_arrow.png) no-repeat center center;
    cursor: pointer;
}

.accordian_down_arrow {
    background: url(../Content/images/accordian_downArrow.png) no-repeat center center;
    cursor: pointer;
}

.accordian_arrow_box {
    width: 30px;
    height: 30px;
    border-left: solid 1px #ffffff;
    line-height: 30px;
    text-align: center;
    float: right;
}

.assessmentItem_Status {
    height: 30px;
    line-height: 30px;
    padding: 0px 10px;
    border-left: solid 1px #ffffff;
    float: right;
    color: #fff;
    width: 210px;
    text-align: center;
}

.accordian_detail_box {
    height: 30px;
    line-height: 30px;
    color: #fff;
    float: left;
    padding-left: 12px;
}

.cancel_btn2 {
    width: 77px;
    padding: 10px 10px;
    background: #ff6c60;
    font-size: 10pt !important;
    text-align: center !important;
    cursor: pointer !important;
    border: 0px !important;
    color: #fff !important;
    margin: 0px 3px 0px 0px !important;
    -webkit-transition: all 0.2s linear;
    -moz-transition: all 0.2s linear;
    -o-transition: all 0.2s linear;
    transition: all 0.2s linear;
}

    .cancel_btn2:hover {
        background: #ff1603 !important;
    }


/*=======================================Review Item END=========================================================*/
/*=======================================View Item POPUP =========================================================*/
.fancybox-image {
    background-color: #fff !important;
}

.itemDetailContainer {
    overflow-x: hidden !important;
}

    .itemDetailContainer .bodyContainer,
    .itemDetailContainer_IW .bodyContainer {
        height: 100%;
    }

.selectedClassificationContainerPopUp .objective-learning {
    margin: 0 0 5px;
    background: #f5f5f5;
    padding-bottom: 10px !important;
}

.selectedClassificationContainerPopUp td, .selectedClassificationContainerPopUp th {
    border: none !important;
    padding-top: 5px !important;
    padding-bottom: 5px !important;
}

.selectedClassificationContainerPopUp td, .selectedClassificationContainerPopUp .content-area table th {
    font-size: 12px !important;
}
/*.accordion-close span {
    display: block;
    float: left;
    background: url(../Content/images/accordian_arrow_close.png) center center no-repeat;
    padding: 29px 10px 0px 10px;
}

.accordion-open span {
    background: url(../Content/images/accordian_arrow_open.png) center center no-repeat;
}

.accordion-open span {
    display: block;
    float: left;
    padding: 29px 10px 0px 10px;
}*/
.domainContainerPopUp ul {
    text-align: left !important;
}

.card-headerAccordion {
    margin: 0;
    padding: 4px 10px;
    height: 30px;
    background: url(../Content/images/accordian_bg.png) repeat-x center center;
    text-decoration: none;
    color: #428bca;
    font-size: 14pt;
    cursor: pointer;
}

/*.selectedClassificationContainerPopUp h3 {
    font-size: 14px;
    color: #428bca;
    padding: 5px 0.75rem;
    margin: 0;
    font-weight: 800;
    position: relative;
    display: inline-block;
    border-radius: 4px;
    vertical-align: middle;
    background-color: #e2f2ff;
    width: 100%;
    line-height: 28px;
}*/

/*.selectedClassificationContainerPopUp h3 img {
    width: 12px;
    margin-left: 15px;
}*/

/*.selectedClassificationContainerPopUp table th {
    color: #428bca !important;
}*/

.popup_author {
    position: absolute;
    width: 128px;
    height: 46px;
    background: #ffffff;
    margin-top: -270px;
    z-index: 100;
    right: 200px;
    color: #000 !important;
    border: 1px solid #428bca;
    /*margin-left: -216px;*/
}

.popup_new {
    min-width: 600px;
    height: 250px;
}

.popup_Scroll {
    height: 180px;
    overflow-x: hidden;
    overflow-y: scroll;
    margin-top: 4px;
}

.popup_Scroll_domainView {
    height: 180px;
    overflow-x: hidden;
    margin-top: 4px;
}

.domainCountPopUp {
    color: #428bca !important;
    cursor: pointer;
}

.eDCrossBtn {
    height: 38px;
    min-width: 50px;
    font-size: 24px !important;
    font-weight: bold !important;
    margin: 0px !important;
}

.fullViewImage {
    float: right;
    margin-right: 10px;
}

.fullViewImageStem {
    float: right;
    margin: 5px 10px 5px 0px;
}

#ucItemDetailPopUp .viewItemInnerCard,
.itemDetailContainer_IW .viewItemInnerCard {
    border: 1px solid #428bca !important;
}

#ucItemDetailPopUp .stemHeading,
.itemDetailContainer_IW .stemHeading {
    padding: 8px 0px 5px 10px;
}

#ucItemDetailPopUp .card-body,
.itemDetailContainer_IW .card-body {
    padding: 0.15rem !important;
}

.itemDetailContainer .viewItemInnerCard,
.itemDetailContainer_IW .viewItemInnerCard {
    border: 1px solid #428bca !important;
}

.itemDetailContainer .stemHeading,
.itemDetailContainer_IW .stemHeading {
    padding: 8px 0px 5px 10px;
}

.itemDetailContainer .card-body,
.itemDetailContainer_IW .card-body {
    padding: 0.15rem !important;
}

.viewItem-heading {
    background: #428bca;
    color: #FFF;
    margin-bottom: 15px;
    margin-top: -1px;
}

    .viewItem-heading h2 {
        font-size: 24px;
        font-weight: 500;
        color: #FFF;
        text-transform: uppercase;
        padding: 11px 0px 7px 7px;
        margin: 0;
        border-bottom: none !important;
    }

#ucItemDetailPopUp .bodyContainer,
.itemDetailContainer_IW .bodyContainer {
    /*border: 1px solid #428bca !important;*/
    min-height: 250px;
}

/* updated by: syed nazim 20210928 start*/
#ucItemDetailPopUp .shortbodyContainer, .itemDetailContainer_IW .shortbodyContainer, .divAssessmentType .shortbodyContainer {
    border: 1px solid #428bca !important;
    min-height: 120px;
}

#itemDetailLanguage a {
    cursor: default;
}

    #itemDetailLanguage a.active {
        padding: 1px 0 3px 0px;
        border-bottom: 4px solid #f1c40f;
    }
/* updated by: syed nazim 20210928 end*/


#ucItemDetailPopUp .text-Container,
.itemDetailContainer_IW .text-Container {
    padding: 0px 0px 0px 8px;
}

.itemDetailContainer .bodyContainer,
.itemDetailContainer_IW .bodyContainer {
    /* border: 1px solid #428bca !important;*/
    min-height: 250px;
}

.itemDetailContainer .text-Container,
.itemDetailContainer_IW .text-Container {
    padding: 0px 0px 0px 8px;
}

.header-Toggle {
    text-decoration: none !important;
}

    .header-Toggle span {
        display: block;
        float: left;
        padding: 29px 10px 0px 10px;
        background: url(../Content/images/accordian_arrow_open.png) center center no-repeat;
    }

    .header-Toggle label {
        margin-top: .15rem;
        margin-bottom: 0 !important;
    }

/*#ucItemDetailPopUp .card-header,*/
.itemDetailContainer_IW .card-header {
    padding: 5px 5px;
    margin: 5px 0px 0px 0px;
    border: 1px solid #dee2e6 !important;
}

/*.itemDetailContainer .card-header,*/
.itemDetailContainer_IW .card-header {
    padding: 5px 5px;
    margin: 5px 0px 0px 0px;
    border: 1px solid #dee2e6 !important;
}

.collapsed span {
    display: block;
    float: left;
    background: url(../Content/images/accordian_arrow_close.png) center center no-repeat;
    padding: 29px 10px 0px 10px;
}

.ucVignetteFullviewPopupBody {
    min-height: 200px;
}

.ucQuestionFullviewPopupBody {
    min-height: 200px;
}

#ucQuestionFullviewPopup .modal-content {
    border: 1px solid #428bca !important;
}

#ucVignetteFullviewPopup .modal-content {
    border: 1px solid #428bca !important;
}

/*.modal:nth-of-type(even) {
    z-index: 1052 !important;
}*/

#ucQuestionFullviewPopup {
    z-index: 1052 !important;
}

/*#divEquationEditorDialog {
    z-index: 1053 !important;
}*/
/*.modal-backdrop.show:nth-of-type(even) {
    z-index: 1051 !important;
}*/
.modal {
    overflow: auto !important;
}

#divVignetteTextPopup {
    min-height: 175px
}

.ucViewOk {
    height: auto !important;
}

.custom-title-logo {
    vertical-align: middle
}

.home-mobile, .topbar .spnUserManual {
    display: none;
}
/*=======================================View Item POPUP END=========================================================*/
@media screen and (min-width:992px) {
    .sidebar ul li.dropdown:hover div {
        display: block !important;
    }

    .search-area-h {
        padding-left: 0;
    }
}

@media screen and (max-width:991px) {
    header {
        font-size: 15px;
        font-weight: 600;
        margin: 0;
    }

    .breadcrumb li {
        font-size: 12px;
        padding: 5px;
    }

    .sidebar {
        padding: 0
    }

        .sidebar > nav, .sidebar > nav > div {
            height: unset;
            background: #ecf0f1;
        }

        .sidebar > nav {
            padding-top: 10px !important;
        }

            .sidebar > nav > button {
                margin-bottom: 10px;
                margin-left: 10px;
            }

    .dropdown > a:after {
        transform: rotate(90deg);
        top: calc(50% - 4px);
        right: 10px;
    }

    .sidebar ul, .sidebar {
        border: none
    }

    .search.d-flex.align-items-center.justify-content-end {
        justify-content: center !important;
    }

    .tabs_controll li {
        margin-right: 2px !important;
        font-size: 13px !important;
        padding: 5px !important;
    }
}

@media screen and (max-width:991px) and (min-width:768px) {
    .breadcrumb h4 {
        max-width: 230px
    }
}

@media screen and (max-width:767px) {
    .role-department, header .logo {
        text-align: left;
        padding: 0
    }

    .topbar .spnUserManual {
        display: block;
    }

        .topbar .spnUserManual img {
            filter: invert(1)
        }

    .role-department {
        text-align: center;
        margin-top: 10px;
        position: static;
        display: flex;
        border-top: 1px solid #D8E8F8;
        padding: 10px;
    }

    div#dvRole {
        flex: 0 0 40% !important;
        border: none;
        max-width: unset;
    }

    div#dvDepartment {
        flex: 0 0 60% !important;
        max-width: unset;
    }

    div#dvLanguage {
        position: absolute;
        top: 31px;
        right: 30px;
        font-size: 0;
        border: none;
    }

    body.rtl div#dvLanguage {
        right: auto;
        left: 40px;
    }

    #spnLanauge, .home-desktop, #helpbar span, .search-area-h .search.one + .search > a, .breadcrumb li span {
        display: none !important;
    }

    .breadcrumb li.home-mobile, #helpbar {
        display: inline-block !important;
    }

    .search-area-h .search.one + div {
        font-size: 0;
    }

    #lnkMobileHome img {
        height: auto;
        max-width: unset;
        max-height: unset;
        width: auto;
    }


    body.rtl #helpbar {
        right: auto;
        left: 175px;
    }

    .role-department a {
        height: 30px;
        width: 30px;
        border-radius: 50%;
        display: inline-block;
        border: 4px solid #FFF;
        margin-right: 13px;
    }

        .role-department a img {
            border-radius: 50%;
            height: 22px;
            width: 22px;
            display: block;
        }

        .role-department a.active {
            border: 4px solid #f1c40f;
        }

    #dvRole .custom-select, #dvDepartment .custom-select {
        max-width: 100% !important;
        width: 100% !important;
        border: 1px solid #D8E8F8 !important;
        height: 26px !important;
        padding: 0 24px 0 8px !important;
        border-radius: 5px !important;
    }

    .breadcrumb {
        position: static;
    }

    .search-area-h .search.one {
        position: absolute;
        top: 21px;
        right: 130px;
    }

    body.rtl .search-area-h .search.one {
        right: auto;
        left: 130px;
        top: 25px
    }

    #notification-alerts {
        font-size: 21px !important;
    }

        #notification-alerts .fas {
            color: #2C6BBF !important;
        }

    #dvNotificaiton .notificationcount {
        background-color: #CE3626;
        width: 24px;
        top: -3px;
    }

    html body .content.blue-print table tr td, .content.blue-print th:nth-child(n+2), .content.blue-print td:nth-child(n+2) {
        text-align: left !important;
        width: 100% !important;
        max-width: 100% !important;
    }

    .custom-select, .form-control {
        margin: 0 !important;
    }




    input, select {
        max-width: 100%;
    }

    .filter-area .form {
        margin-top: 10px;
    }

    .course-d1 > .aside > ul {
        width: 100%;
        order: 2;
        margin-top: 30px;
        position: static;
        align-items: center;
        padding: 0;
    }

    .course-d1 > .aside .nav.nav-tabs li {
        width: calc(100% - 4px);
        margin: 2px;
        /* padding: 5px; */
        /* background: #f9f9f9; */
        /* border: 1px solid #eee; */
    }

    .d2.course-d1 > .aside > .nav.nav-tabs li a {
        padding: 10px 10px !important;
        width: calc(100%) !important;
        margin: 0;
        background: #f9f9f9 !important;
        border: 1px solid #eee !important;
    }

    .d2 {
        padding-top: 60px !important;
    }

        .d2 .tab-content {
            width: 100%;
            order: 1;
        }

        .d2 .nav.nav-tabs li a::before {
            position: static !important;
            flex: 0 0 15px
        }

        .d2 .aside .nav.nav-tabs li a.active, .d2 .aside .nav.nav-tabs li a.completed.active {
            color: #d35400 !important;
            position: absolute;
            top: 0;
            left: 0;
        }

    .nav.nav-tabs li a span {
        margin: 0 5px;
    }

    .modal-body .col-md-auto {
        display: flex;
        justify-content: center;
        align-items: center;
        margin-bottom: 25px !important;
    }

        .modal-body .col-md-auto.mb-0 {
            margin-bottom: 0 !important;
        }

        .modal-body .col-md-auto a {
            margin: 0 5px;
        }

    #learning .col-md-auto a:first-child, .aside {
        order: 2
    }

        .aside.onlyicons, .aside {
            width: 100%;
        }

    .d2 > .aside > ul:before, .collapsible-sidebar {
        display: none !important;
    }

    .aside.onlyicons li b {
        opacity: 1
    }

    .topbar a {
        border-right: 0;
        border-bottom: 1px solid #192634 !important;
    }

    .topbar .col-md-auto ul {
        margin: 7px 0
    }

    .topbar .col-md-auto a img + label {
        width: calc(100% - 16px) !important;
        display: contents
    }

    header {
        border-radius: 0 0 20px 20px;
    }

        header .spnMainLogoAncher > *:not(img) {
            display: none !important;
        }

    .mobile-menu-toggle .fas {
        font-size: 24px;
    }

    .category-heading h2 {
        background: #428bca;
        text-align: left;
        font-size: 12px !important;
        padding: 5px !important;
        line-height: 12px;
    }

    .category-heading a {
        font-size: 12px;
        padding: 0 5px !important;
    }

    .category-heading h2 ~ a {
        margin-left: 3px;
    }

    .category-heading {
        align-items: center;
        min-height: 40px
    }

    .dvQuestionMarks, .dvAWordLimit {
        color: #535353
    }

    .collapse-parent .border .col-md {
        margin-bottom: 15px;
    }

    .collapse-parent .border .col-auto, .breadcrumb ul {
        width: 100%;
    }

    .collapse-parent .border .col-auto {
        width: 100%;
        text-align: right;
        margin: 0;
    }

    div[class*="col title_"] + div.col-auto.iconfree, div[class*="col-md title_"] + div.abbr- {
        text-align: left
    }

    .p-education-list .s-count {
        display: none
    }

    .tabs_controll li {
        margin-bottom: 5px
    }

    header a {
        font-size: 18px;
    }

    .topbar {
        padding-top: 7px;
        position: absolute;
        top: 72px;
        /*z-index: 100;*/
        display: none;
        left: 15px;
        right: 15px;
    }

        .topbar li {
            display: block;
            width: 100%;
            border-bottom: 1px solid #4b5e70 !important;
            border-right: 0;
        }

        .topbar div.col-md > ul > li > a::after {
            position: absolute;
            top: 13px;
            right: 5px;
        }

        .topbar .col-md-auto li.logout a, .topbar .col-md-auto li.logout {
            border: none !important;
        }

        .topbar a + ul {
            position: relative;
            width: 100%;
            background: none;
            border: none
        }

            .topbar a + ul li a {
                border-right: none;
                color: #FFF !important;
            }

                .topbar a + ul li::after, .topbar a + ul li a::after {
                    display: none
                }

            .topbar a + ul li:last-child, .topbar a + ul li:last-child a {
                border-bottom: none !important;
            }

    .tabs_controll li.nav-item a {
        font-size: 13px !important;
        padding: 8px;
        margin-right: 5px !important;
    }

    .bar-info span {
        margin-right: 5px;
    }

    .breadcrumb .search .border.relative {
        position: absolute;
        top: 100%;
        right: 0px;
        left: auto;
        width: calc(100vw - 50px);
        max-width: unset;
        z-index: 200;
        display: none;
    }

    .breadcrumb .hideonCourseDesigner.SearchBarWithHelp {
        position: static;
    }


    .search button {
        height: 25px;
    }

    .search .border.relative input {
        max-width: calc(100% - 76px) !important;
        height: 26px;
    }

    .c-title {
        display: none;
    }

    .col-auto.ml-2.text-center.dvabbriviation, .col-auto.ml-2.text-center.dvstatus, .col-md-auto.ml-2.text-center.dvabbriviation {
        text-align: left !important;
        margin-left: 0 !important;
    }

        .col-auto.ml-2.text-center.dvabbriviation::before, .col-md-auto.ml-2.text-center.dvabbriviation::before {
            content: attr(data-dvabbriviation);
            display: inline-block;
            font-size: 16px;
            font-weight: 500;
            color: #428bca;
            margin: 0 5px;
        }

        .col-auto.ml-2.text-center.dvstatus::before {
            content: attr(data-dvstatus);
            display: inline-block;
            font-size: 16px;
            font-weight: 500;
            color: #428bca;
            margin: 0 5px;
        }

    .collapse-parent .border .col.dvtitle::before {
        content: attr(data-dvtitle) !important;
        display: inline-block !important;
        font-size: 16px;
        font-weight: 500;
        color: #428bca;
        margin: 0 5px
    }


    .row.btn_upload_Image > label, #manage-organization .img-area + .relative.text-right {
        text-align: left !important;
    }

    .category-form label.text-right {
        text-align: left !important;
    }

    .breadcrumb li {
        border: none;
    }

    .breadcrumbMain .relative {
        background: #FFF;
        position: absolute;
        left: 57px;
        right: 10px;
        border-radius: 10px;
        border: none;
    }

    body.rtl .breadcrumbMain .relative {
        left: 10px;
        right: 57px;
    }

    .breadcrumbMain .relative + li {
        margin-left: 40px;
    }

    body.rtl .breadcrumbMain .relative + li {
        margin-left: 0;
        margin-right: 40px;
    }
}

@media screen and (max-width:576px) {
    header {
        background-size: auto 100%
    }

        header a {
            text-align: center;
            display: block
        }

        header .logo a {
            text-align: left;
        }


    .role-department a {
        display: inline-block;
    }

    .topbar {
        top: 55px
    }

    .jqueryslidemenu {
        height: auto;
        background-position: bottom;
    }

        .jqueryslidemenu ul li a {
            padding: 12px 8px 12px 8px
        }

        .jqueryslidemenu ul li, .langSelector {
            height: 41px;
        }

        .modal-body > .nav.nav-tabs li, .select-group, .jqueryslidemenu ul {
            width: 100%;
        }

    .select-group {
        flex-wrap: wrap;
    }

    .filter-btn {
        padding: 0 8px
    }

    .select-group.two-one select:first-child {
        margin: 0 0 10px
    }

    label, input, select, .select-group.two-one select {
        width: 100% !important;
        max-width: 100% !important;
    }

    .search.d-flex.align-items-center.justify-content-end {
        flex-wrap: wrap;
        height: auto !important;
    }

    #MainCourseTabContainer .search.d-flex.align-items-center.justify-content-end {
        flex-wrap: nowrap;
    }

    .SearchBarWithHelp {
        padding: 0
    }

    .content {
        padding: 0 10px;
    }

    .SearchBarWithHelp .search > a span, .breadcrumb li span {
        display: none !important
    }

    .breadcrumb .col-sm.col.p-0 {
        /*max-width: calc(100% - 50px)*/
    }

    .breadcrumb h4 {
        font-size: 13px;
    }

    .breadcrumb a {
        /*padding: 0*/
    }

    .breadcrumb ul {
        align-items: center
    }

    .breadcrumb li img {
        height: 20px;
        width: 20px;
    }

    .custom-title-logo span:first-child {
        font-size: 16px !important;
    }

    .custom-title-logo span:nth-child(2) {
        font-size: 14px !important;
        max-width: 150px !important;
    }
}

@media screen and (max-width:430px) {
    .role-department div#dvLanguage {
        text-align: center;
    }

    .role-department div {
        padding: 0 5px;
    }

    header .custom-select {
        max-width: 100% !important;
        padding: 0 24px 0 0px !important;
    }

    .role-department img {
        width: 20px;
        display: block
    }

    .role-department span {
        font-size: 11px;
    }

    .role-department div {
        width: calc(50% - 45px) !important;
        vertical-align: top
    }

        .role-department div#dvLanguage {
            width: 71px !important;
        }
}



.search_box {
    float: right;
    margin: 0px 0px 0px 0px;
    text-align: right;
    position: relative;
}

.val-error {
    border-color: #f51717 !important;
}

.exam-content h2 {
    font-weight: normal;
    font-size: 24px;
    color: #0d6efd;
    padding: 5px 0
}

.labels {
    font-size: 16px;
    padding: 5px 15px;
}

    .labels strong {
        text-transform: uppercase;
    }

    .labels img {
        vertical-align: middle
    }

.examp-instruction {
    background: #f4f8f9;
    padding: 15px;
}

    .examp-instruction h3 {
        font-size: 18px;
        font-weight: normal;
        color: #0d6efd;
        padding: 5px 0
    }

.question-content .table td, .question-content .table th {
    padding: 0.50rem;
}

.time-remaining {
    color: #c0392b
}

body .prev-btn {
    background: #0d6efd !important;
    height: 35px;
    line-height: 35px;
    width: 120px;
    border-radius: 3px;
    color: #FFF !important;
    text-decoration: none !important;
    text-align: center;
    display: inline-block
}

body .next-btn {
    background: #11354c !important;
    height: 35px;
    line-height: 35px;
    width: 120px;
    border-radius: 3px;
    color: #FFF !important;
    text-decoration: none !important;
    text-align: center;
    display: inline-block
}

.next-btn + .red-btn {
    height: 35px;
    line-height: 35px;
    border-radius: 3px
}

body .skip-btn {
    background: #5bc0de !important;
    height: 35px;
    line-height: 35px;
    width: 120px;
    border-radius: 3px;
    color: #FFF !important;
    text-decoration: none !important;
    text-align: center;
    display: inline-block
}

body .summary-btn {
    background: #0d6efd !important;
    height: 35px;
    line-height: 35px;
    width: 120px;
    border-radius: 3px;
    color: #FFF !important;
    text-decoration: none !important;
    text-align: center;
    display: inline-block
}

.check-container {
    display: block;
    position: relative;
    padding-left: 20px;
}

    .check-container input {
        position: absolute;
        left: 0;
        top: 6px;
        z-index: 10;
        opacity: 0;
    }

    .check-container .checkmark {
        position: absolute;
        left: 0;
        top: 6px;
        z-index: 4;
        height: 13px;
        width: 13px;
        border: 1px solid #96a1a2;
        /*border-radius: 50%;*/
        display: block
    }

    .check-container input:checked ~ .checkmark::after {
        content: "";
        position: absolute;
        left: 3px;
        top: 3px;
        z-index: 4;
        height: 5px;
        width: 5px;
        display: block
    }

.login-box .check-container input[type="checkbox"]:checked ~ .checkmark::after { /*as directed by waqas sb to fix issue of checkbox form on register student */
    content: "";
    position: absolute;
    left: 3px;
    top: 1px;
    z-index: 4;
    height: 8px;
    width: 5px;
    border-radius: 50%;
    display: block;
}

table.w-75 > tbody > tr > th {
    color: #0d6efd
}

p:empty {
    display: none;
}

@media screen and (max-width:1220px) and (min-width:577px) {
    .taskDetail_value li {
        width: 33.33%;
        flex: 0 0 33.33%;
        margin-bottom: 15px;
        padding: 0 5px;
    }

        .taskDetail_value li:nth-child(3) {
            border: none
        }

        .taskDetail_value li:nth-child(n+3) {
            margin-bottom: 0;
        }

        .taskDetail_value li span {
            font-size: 11pt;
        }
}

@media screen and (max-width:1200px) and (min-width:992px) {
    #mainFreezeTable, #maintableshortheader {
        width: 400px !important;
    }

        #mainFreezeTable th, #maintableshortheader th {
            width: 200px !important;
        }

        #mainFreezeTable td, #mainTable td {
            height: 100px
        }



    #sctwo {
        width: calc(100% - 402px) !important;
    }

    .tooltip-content {
        width: 330px
    }
}

@media screen and (max-width:991px) {
    #mainFreezeTable, #maintableshortheader, #mainFreezeTabledv {
        display: none
    }

        #mainFreezeTable td, #mainTable td {
            height: unset
        }

        #mainFreezeTabledv + div, .objective-learning > div:nth-child(1) {
            width: calc(100% - 0px) !important;
        }

    #sctwo {
        width: calc(100% - 15px) !important;
    }

    .objective-learning #mainTable td span.strip {
        width: 5px !important;
    }

    #mainTabledv #mainTable, #sctwo #maintableheader {
        border-left: 1px solid #cacaca !important
    }

    #maintableheader th:nth-child(1), #maintableheader th:nth-child(2), #mainTable td:nth-child(1), #mainTable td:nth-child(2), #mainTable th:nth-child(1), #mainTable th:nth-child(2) {
        display: table-cell !important;
        width: 200px !important;
    }

    .tooltip-content {
        width: 330px
    }
}

@media screen and (max-width: 767px) {
    header, header .exam-name.text-right, .login-details {
        text-align: center !important;
    }

    .question-content .col-md-5 {
        border-left: 0 !important;
        border-top: 1px solid #dee2e6 !important;
        padding-top: 15px;
    }

    #dvExamNavigation .col-12 {
        order: 1;
        margin-bottom: 10px;
    }

    #dvExamNavigation .prevBtn {
        order: 2;
        width: 50% !important;
        flex: 0 0 50% !important;
    }

    #dvExamNavigation .nxtBtn {
        order: 3;
        width: 50% !important;
        flex: 0 0 50% !important;
    }


    .objective-learning {
        height: unset !important;
        margin-top: 10px
    }

    #mainTabledv #mainTable th, #mainTabledv #mainTable tr:first-child {
        display: none !important;
    }

    #mainTabledv #mainTable td {
        width: 100% !important;
        display: flex !important;
        padding-bottom: 0.75rem !important;
        border-top: 1px solid #dee2e6;
    }

        #mainTabledv #mainTable td[colspan] {
            border-bottom: 2px solid #dee2e6
        }
}

@media screen and (max-width: 576px) {
    .logo a span {
        font-size: 13px;
    }

    .logo img {
        width: 63px;
        margin: 0;
    }

    header .exam-name {
        font-size: 14px;
    }

    table.w-75 {
        width: 100% !important;
    }

    .row.border-top.justify-content-between.pt-2.btn-area div:nth-child(1) {
        order: 2
    }

    .row.border-top.justify-content-between.pt-2.btn-area div:nth-child(2) {
        order: 1;
        width: 100%;
        text-align: center;
        margin-bottom: 15px;
    }

    .row.border-top.justify-content-between.pt-2.btn-area div:nth-child(3) {
        order: 3;
    }

    .taskDetail_value li {
        width: 50%;
        flex: 0 0 50%;
        margin-bottom: 15px;
        padding: 0 5px;
    }

        .taskDetail_value li:nth-child(even) {
            border: none
        }

        .taskDetail_value li:nth-child(n+4) {
            margin-bottom: 0;
        }

        .taskDetail_value li span {
            font-size: 11pt;
        }
}

@media screen and (max-width:420px) {
    .taskDetail_value li {
        width: 100%;
        flex: 0 0 100%;
        margin-bottom: 15px;
        padding: 0 5px;
        max-width: 100%;
        padding: 10px 0;
        min-height: 60px;
    }

    .taskDetail_value li {
        border-bottom: dotted 1px #c5c5c5 !important;
        border-right: 0;
    }

        .taskDetail_value li:nth-child(n+5) {
            margin-bottom: 0;
        }
}

.flex-column {
    flex-direction: column;
}

.flex-grow {
    flex-grow: 1;
}

.chosen-container-multi .chosen-choices, .chosen-container-single .chosen-single {
    border: 1px solid #b6b6b6 !important;
    background: #FFF !important;
    min-height: 39px !important;
    line-height: 37px !important;
    border-radius: 0 !important;
}

    .chosen-container-single .chosen-single div b {
        background-position: 0 9px !important;
    }

.chosen-container-single .chosen-search input[type=text] {
    max-width: 100% !important;
}

.chosen-container-multi .chosen-choices li.search-choice {
    margin: 4px 5px 4px 0 !important;
    padding: 7px 20px 7px 5px !important;
}

    .chosen-container-multi .chosen-choices li.search-choice .search-choice-close {
        top: 7px !important;
    }

.popup_inner select + .chosen-container {
    width: 100% !important;
}

.tab-content .search button {
    height: 30px;
}

.step-photo.do, .step-photo.dont {
    background: #ecf0f1;
    padding: 10px !important;
    text-align: center;
    font-size: 14px;
    font-weight: bold;
    margin-bottom: 15px;
}

    .step-photo.do .img {
        border: 5px solid #2ecc71;
        width: 100%;
        margin-bottom: 15px;
        position: relative
    }

.step-photo img {
    width: 100%;
}

.step-photo.dont .img {
    border: 5px solid #c0392b;
    width: 100%;
    margin-bottom: 15px;
    position: relative;
}

.step-photo.require {
    padding-left: 15px;
    padding-right: 15px;
}

    .step-photo.require .img, .step-photo.require .img img {
        height: 270px;
    }

.step-photo.do .img i {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 22px;
    color: #1e854a;
}

.step-photo.dont .img i {
    position: absolute;
    top: 5px;
    right: 5px;
    font-size: 22px;
    color: #c0392b
}

.step-photo h3 {
    font-size: 18px;
    margin-bottom: 10px;
    line-height: 18px;
    font-weight: 800
}

.step-photo.do h3 {
    color: #1e854a;
}

.step-photo.dont h3 {
    color: #c0392b;
}

.step-photo .btn-area {
    display: flex;
    margin-top: 15px;
}

    .step-photo .btn-area .capture-face-btn {
        flex-grow: 1;
        margin-right: 5px;
        background: #2c3e50;
        color: #FFF;
        text-decoration: none;
        line-height: 40px;
        text-align: center;
    }

    .step-photo .btn-area .allowskip-id-btn {
        flex-grow: 1;
        margin-right: 5px;
        background: #21ab5c;
        color: #FFF;
        text-decoration: none;
        line-height: 40px;
        text-align: center;
    }

#btnNextCaptureFace {
    min-width: unset;
}

.step-photo .btn-area a {
    font-size: 14px;
}

/*}*/ /*Mr. Waqas asked 2021-05-17*/

.scope-tree > .row.last-child::before {
    height: 20px;
}

.scope-tree > .row:last-child::before {
    /*height: 0*/
}

#divShowExamSummary {
    min-height: 225px;
    max-height: 400px;
}

    #divShowExamSummary div {
        box-sizing: border-box;
    }

    #divShowExamSummary span {
        font-family: 'lato', sans-serif;
        font-size: 12px;
    }

.divSummary {
    /*margin: 4px;*/
    vertical-align: top;
    min-height: 225px;
}

.divLegends {
    margin: 2px 0px;
    width: 190px;
    vertical-align: top;
    min-height: 225px;
}

.header_1 {
    font-family: 'lato', sans-serif;
    font-size: 14px;
    font-weight: bold;
    text-transform: uppercase;
    text-align: left;
    background: #3598db !important;
    color: #FFF;
    width: 100%;
    margin: 20px 0 10px;
    padding: 5px 10px
}

.header_2 {
    font-family: 'lato', sans-serif;
    font-size: 18px;
    text-transform: uppercase;
    text-align: left;
    color: #3598db !important;
    width: 100%;
    font-weight: bold;
    margin-bottom: 5px;
}

.divQuestionList.rlangDirection {
    display: flex;
    flex-wrap: wrap;
}

.header_1.langDirection {
    background: none;
    color: #3598db;
    font-size: 18px;
    padding: 0;
    margin: 0;
}

.divQuestionList.rlangDirection .header_1:first-child {
    margin: 0;
}

.divQuestionList {
    width: 100%;
    overflow: auto;
    max-height: 212px;
}

.btnSummary {
    /*display: inline-block;*/
    height: 34px;
    width: 38px;
    border: solid 1px #aaaaaa;
    border-radius: 5px;
    color: white;
}

.divLegendBox {
    height: 34px;
    width: 38px;
    border: solid 1px #aaaaaa;
    border-radius: 5px;
    float: right;
}

.divQuestionBox {
    margin: 4px;
    float: left;
}

.notAttempted {
    background-color: #ffffff;
    color: #aaa !important;
}

.attempted {
    background-color: #5cb85c;
}

.skipped {
    background-color: #5bc0de;
}

.all {
    background-color: darkgray;
}

.markforreview {
    background-color: #e74c3c;
}

.langDirection {
    float: right !important;
}

.rlangDirection {
    float: left !important;
}

.legendhalfdiv {
    min-width: 100%;
    margin: 3px 0;
    line-height: 2px;
    float: left;
}

span.legendtext {
    min-width: 12px;
    margin: 16px 5px 0px 10px;
    height: 34px;
    text-align: right;
    color: #000;
    line-height: 10px;
    float: right;
}

.exam-con, .exam-con > div {
    display: flex;
    width: 100%;
}

.exam-con {
    min-height: calc(100vh - 30px);
}

.ui-tooltip {
    opacity: 1 !important;
    color: #FFF;
}

    .ui-tooltip::before {
        content: "";
        height: 0;
        width: 0;
        border-bottom: 5px solid #000;
        border-left: 5px solid transparent;
        border-right: 5px solid transparent;
        position: absolute;
        top: -5px;
        left: 5px;
    }

.lblmin {
    margin-left: .25rem;
}

.review-priority .bg-success {
    background: #7cbd56;
    background: -moz-linear-gradient(left, #7cbd56 0%, #cce26a 100%);
    background: -webkit-linear-gradient(left, #7cbd56 0%,#cce26a 100%);
    background: linear-gradient(to right, #7cbd56 0%,#cce26a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#7cbd56', endColorstr='#cce26a',GradientType=1 );
}

.review-priority .bg-warning {
    background: #d0e46f;
    background: -moz-linear-gradient(left, #d0e46f 0%, #f0bb7a 100%);
    background: -webkit-linear-gradient(left, #d0e46f 0%,#f0bb7a 100%);
    background: linear-gradient(to right, #d0e46f 0%,#f0bb7a 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d0e46f', endColorstr='#f0bb7a',GradientType=1 );
}

.review-priority .bg-danger {
    background: #e33e2f;
    background: -moz-linear-gradient(left, #f0bb7a 0%, #e33e2f 100%);
    background: -webkit-linear-gradient(left, #f0bb7a 0%,#e33e2f 100%);
    background: linear-gradient(to right, #f0bb7a 0%,#e33e2f 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e33e2f', endColorstr='#f0bb7a',GradientType=1 );
}

.content.blue-print td:nth-child(n+2).bar-popover {
    text-align: left !important;
}

#dataGrid td[data-label="Is Editable"] {
    text-transform: capitalize
}

/*added by Nazim, with the help of Mr. waqas 20200511*/
body .mandatory {
    color: red;
    font-size: 18px;
    margin: 0 3px 0 3px;
}

.org-form .form-row > label .mandatory {
    position: absolute;
}

body .allOption {
    margin: 0 -44px 0 36px;
}

.login-wrapper {
    width: 100%;
    min-height: 100vh;
    background: url("../Content/images/login-bgd.jpg");
    background-size: 100% 100%;
    padding: 0 15px;
    display: flex;
    flex-direction: column;
}

.error-wrapper-bg {
    background: url("../../Content/images/login-bgd.jpg") no-repeat;
    min-height: 100vh;
    padding: 15px;
    background-size: cover;
    position: relative;
}

.login-wrapper h2 {
    font-size: 18px;
    color: #FFF;
}

.login-wrapper .copyright {
    color: #98a7be;
    font-size: 11px;
}

.login-wrapper > .container-fluid {
    max-width: 950px;
    flex-grow: 1;
    display: flex;
    align-items: center;
}

.resetpassword-wrapper .container-fluid {
    max-width: 1030px;
}

.login-wrapper > .container-fluid > .row {
    width: 100%;
    margin: 0 !important;
}

.login-box {
    background: #2c5584;
    background: -moz-linear-gradient(-45deg, #2c5584 0%, #1d3958 100%);
    background: -webkit-linear-gradient(-45deg, #2c5584 0%,#1d3958 100%);
    background: linear-gradient(135deg, #2c5584 0%,#1d3958 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#2c5584', endColorstr='#1d3958',GradientType=1 );
    box-shadow: 0px 0px 0px 1px #274c75;
    max-width: 270px;
    padding: 13px;
    border: 1px solid;
    border-color: #55769b #14263b #14263b #55769b;
}

.resetpassword-wrapper .login-box {
    max-width: unset;
}

.login-wrapper h1 {
    font-size: 36px;
    color: #acdeff;
    font-weight: 300;
    text-transform: uppercase;
    margin-bottom: 12px;
}

.resetpassword-wrapper h1 {
    text-align: center
}

.login-box .form-control {
    border-color: #FFF;
    margin-bottom: 15px;
    outline: 0 !important;
    box-shadow: none !important;
    height: 53px;
}

.login-box button {
    background: #46b28e;
    width: 100%;
    margin-bottom: 14px;
    color: #FFF;
    height: 53px;
    text-transform: uppercase;
    line-height: 53px;
    text-align: center;
    border: none
}

.resetpassword-wrapper .login-box button.blue-btn {
    background: #0d6efd;
}

.login-box .check-container {
    color: #acc6da;
}

.login-box .checkmark {
    height: 13px;
    width: 13px;
    border-color: #6a8098;
    background: none !important;
}

.login-box .check-container .checkmark:after {
    border-color: #acc6da;
    top: 1px;
    left: 3px;
}

.login-box + div {
    max-width: 270px;
    margin-top: 5px !important;
}

    .login-box + div a {
        font-size: 11px;
        color: #90bada
    }

.resetpassword-wrapper .btns {
    display: flex;
    margin: 0 -2px;
}

    .resetpassword-wrapper .btns button {
        margin: 0 2px
    }

@media screen and (max-width:1050px) {
    .resetpassword-wrapper h1 {
        font-size: 24px;
    }

    .resetpassword-wrapper .container-fluid {
        padding: 0
    }
}

.clsWithoutDirection {
    direction: initial !important;
}

body.rtl input.clsWithoutDirection {
    text-align: right;
}

body .Status_tbl {
    width: 95px;
}
/*added by Nazim, with the help of Mr. waqas 20200511*/
div.dvItemsList-M.jtable-column-header-container {
    display: flex;
    justify-content: space-between;
}

.thManagBankitemAction {
    width: 16%;
}

.col .dir-tree#jsmind_container {
    height: calc(100vh - 500px);
    min-height: 500px;
}

.thverticalAlign {
    vertical-align: middle !important;
}

#mainTable th {
    width: 120px;
}

    #mainTable th:first-child {
        width: 300px;
    }

.EducationalDoaminTree.single > .row:first-child::before {
    height: 0 !important;
}

body .required {
    color: red;
    margin: 0 3px 0 3px;
}

body .eduDomainCopyTitle {
    margin: 0 0 0 19px;
    /*//43*/
}

body .error-login {
    color: red;
    font-weight: bold;
}

.w-100.custom-select {
    width: 100% !important;
    max-width: 100% !important;
}

.bootbox .modal-content {
    border: 1px solid lightgray !important;
}

.divGoUp {
    width: 100%;
    display: block;
    text-align: right;
}

.highcharts-credits {
    display: none !important;
}

.app-setting-form.org-form .form-row .form-control {
    //width: 250px !important
}

.app-setting-form.org-form .form-row > label {
    width: 160px
}

.custom-title-logo span:first-child {
    font-size: 24px;
    color: #428bca;
    font-weight: 800;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
}

.custom-title-logo span:nth-child(2) {
    color: #58bae6;
    font-size: 16px;
    font-weight: 600;
    max-width: 240px;
    padding: 0 10px;
    display: inline-flex;
    align-items: center;
}

/*2020-08-23 Expand Collapse Educational system*/
.expand-collapse-small {
    margin: 0 0 0 38px;
    padding: 0 10px;
    text-align: left;
    min-width: unset !important;
    width: auto !important;
    display: inline-block;
    vertical-align: middle;
    height: 20px;
    line-height: 20px;
    font-size: 9px;
    padding: 0 5px;
}

.expand-collapse-large {
    padding: 0 10px;
    text-align: left;
    min-width: unset !important;
    width: auto !important;
    display: inline-block;
    vertical-align: middle;
    margin: 0 0 0 5px;
}

#manage-copyfromsystem .modal-dialog {
    max-width: 1100px;
}

.legendSelection {
    height: 8px;
    width: 8px;
    background-color: red;
    margin: 13px 0 0 170px;
    border-radius: 5px;
    position: fixed;
}

input[type=range]::-webkit-slider-thumb {
    margin-top: -7px;
}

.btn-40 {
    height: 40px;
    line-height: 40px;
    min-width: 80px;
}

.loadingpartial {
    background: url('../Content/images/loadinggifblue.gif') no-repeat center center;
}

button.bootbox-close-button.close {
    background: red !important;
    opacity: 1;
    padding: 8px 20px 9px;
    margin: -17px -17px -5px -17px !important;
    color: #FFF;
    cursor: default;
    user-select: none;
    font-size: 1.5rem !important;
    font-weight: 700;
    line-height: 1;
    border: 0;
    text-shadow: 0 1px 0 #fff;
    webkit-touch-callout: none;
    -webkit-user-select: none;
    -khtml-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
}

h2.bootbox-body {
    margin-right: 38px;
}

.ui-tooltip {
    background: #000 !important;
    color: #FFF !important;
    font-size: 12px !important;
    padding: 5px 10px
}

.textEditorPlugin.sm-ed-ch .toolbar {
    position: relative !important;
    left: auto !important;
}

.sm-ed-ch .toolbar, .sm-ed-ch .editor {
    border: 1px solid #dee2e6 !important;
}

.sm-ed-ch .editor {
    height: 200px;
    overflow-y: auto;
}

#dvtablegroupSearch .check-container {
    padding-left: 18px;
}

th.text-left, .content.blue-print th.text-left {
    text-align: left !important;
}

@media screen and (min-width:768px) {
    .dvOrginizationTool table {
        min-width: 1050px
    }
}

@media screen and (max-width:1350px) {
    #dvtablegroupSearch label img {
        margin: auto;
        display: block
    }

        #dvtablegroupSearch label img + span {
            display: block;
        }

    .breadcrumb {
        font-size: 12px;
    }

        .breadcrumb h4 {
            font-size: 14px;
        }
}

@media screen and (max-width:991px) {
    .withpresettable {
        width: 100%;
        flex: 0 0 100%;
        text-align: center !important;
    }

    .breadcrumb .withpresettable ul {
        justify-content: center !important;
    }

    .breadcrumb .withpresettable h4 {
        max-width: none !important;
    }

    #dvtablegroupSearch label img {
        display: inline-block
    }

        #dvtablegroupSearch label img + span {
            display: inline-block;
        }

    #dvtablegroupSearch .check-container {
        white-space: nowrap
    }
}

@media screen and (max-width:400px) {
    #dvtablegroupSearch label img {
        margin: auto;
        display: block
    }

        #dvtablegroupSearch label img + span {
            display: block;
        }
}
/*// Mr. Waqas update 20211011 start*/
body.rtl input.text-right {
    text-align: right !important;
}

body.rtl input.text-left {
    text-align: left !important;
}

body.rtl .category-form label {
    width: 120px
}

body.rtl .Status_tbl {
    width: 80px;
}

body.rtl .Abbreviation_tbl {
    width: 115px !important;
}
/*// Mr. Waqas update 20211011 end*/

.modal-link {
    position: fixed;
    top: 0;
    bottom: 0;
    left: 0;
    right: 0;
    background: rgba(0,0,0,0.87);
    overflow: auto;
    z-index: 10000;
}

span.close-popup {
    color: #c0392b;
    position: absolute;
    right: 15px;
    top: 5px;
    cursor: pointer;
}

body.rtl span.close-popup {
    right: auto;
    left: 15px;
}

/*
    .dl-desktop-mac {
    margin-left: 10px;
    border-right: 1px solid #0d6efd;
}
body.rtl .dl-desktop-mac {
    margin-right: 10px;
    border-left: 1px solid #0d6efd;
}

.dl-desktop-win {
    margin-left: 5px;
}

body.rtl .dl-desktop-win {
    margin-right: 5px;
}

*/

@media screen and (max-width:767px) {
    .modal-linkpopup > .row > div:nth-child(2), .modal-linkpopup > .row > div:nth-child(3) {
        margin-bottom: 20px !important;
    }
}

@media screen and (min-width:945px) {
    span.main-img + .form-row .col-auto:first-child {
        border-right: 1px solid #0d6efd;
    }

    body.rtl span.main-img + .form-row .col-auto:first-child {
        border-left: 1px solid #0d6efd;
        border-right: 0;
    }
}


.modal-linkpopup {
    /*background: #dadee7;*/
    background: #fff;
    /*background: -moz-linear-gradient(top, #dadee7 0%, #ffffff 30%, #ffffff 50%, #ffffff 70%, #dadee7 100%);
    background: -webkit-linear-gradient(top, #dadee7 0%,#ffffff 30%,#ffffff 50%,#ffffff 70%,#dadee7 100%);
    background: linear-gradient(to bottom, #dadee7 0%,#ffffff 30%,#ffffff 50%,#ffffff 70%,#dadee7 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#dadee7', endColorstr='#dadee7',GradientType=0 );*/
    width: 96%;
    max-width: 1010px;
    padding: 15px;
    margin: 20px auto;
    position: relative;
}

    .modal-linkpopup h3 {
        margin: 0;
        font-size: 24px;
        font-weight: normal;
        line-height: 24px;
        text-transform: unset
    }

    .modal-linkpopup h2 {
        margin: 0;
        font-size: 24px;
        font-weight: 800;
        line-height: 24px;
        border: none !important;
        text-transform: unset;
    }

/*    .modal-linkpopup a {
        height: 44px;
        display: inline-flex;
        color: #000 !important;
        border-radius: 5px;
        justify-content: center;
        align-items: center;
        border: 1px solid #767676;
        font-weight: 600;
        font-size: 14px;
        padding: 0 19px;
        line-height: 12px;
        text-align: left;
        text-decoration: none;
        margin-bottom: 10px;
        width: 182px
    }*/

body.rtl .modal-linkpopup a {
    text-align: right;
}

    body.rtl .modal-linkpopup a:not(.link) {
        font-size: 12px;
        padding: 0 10px;
        justify-content: flex-start;
    }

.modal-linkpopup a img {
    margin-right: 15px
}

body.rtl .modal-linkpopup a img {
    margin-left: 10px;
    margin-right: 0;
}

.modal-linkpopup a.link img {
    margin: 0 5px 0 0;
    width: 15px;
    display: inline-block;
    vertical-align: middle;
}

.modal-linkpopup a.link {
    display: block;
    text-align: left;
    font-size: 12px;
    padding: 2px 0;
}

.modal-linkpopup a:not(.link) {
    height: 44px;
    display: inline-flex;
    color: #000 !important;
    border-radius: 5px;
    justify-content: center;
    align-items: center;
    border: 1px solid #B5B6B6;
    font-weight: 600;
    font-size: 14px;
    padding: 0 19px;
    line-height: 12px;
    text-align: left;
    text-decoration: none;
    margin-bottom: 10px;
    width: 182px;
    background: rgb(209,209,216);
    background: -moz-linear-gradient(top, rgba(209,209,216,1) 0%, rgba(255,255,255,1) 30%, rgba(255,255,255,1) 70%, rgba(209,209,216,1) 100%);
    background: -webkit-linear-gradient(top, rgba(209,209,216,1) 0%,rgba(255,255,255,1) 30%,rgba(255,255,255,1) 70%,rgba(209,209,216,1) 100%);
    background: linear-gradient(to bottom, rgba(209,209,216,1) 0%,rgba(255,255,255,1) 30%,rgba(255,255,255,1) 70%,rgba(209,209,216,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#d1d1d8', endColorstr='#d1d1d8',GradientType=0 );
}

.modal-linkpopup > .row > div:nth-child(2) {
    margin: 0 5px;
    padding: 0 5px;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(197,226,255,1) 30%, rgba(197,226,255,1) 70%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(197,226,255,1) 30%,rgba(197,226,255,1) 70%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(197,226,255,1) 30%,rgba(197,226,255,1) 70%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 );
}

.modal-linkpopup > .row > div:nth-child(3) {
    margin: 0 5px;
    padding: 0 5px;
    background: -moz-linear-gradient(top, rgba(255,255,255,0) 0%, rgba(227,225,254,1) 30%, rgba(227,225,254,1) 70%, rgba(255,255,255,0) 100%);
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(227,225,254,1) 30%,rgba(227,225,254,1) 70%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(227,225,254,1) 30%,rgba(227,225,254,1) 70%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 );
}

.modal-linkpopup > .row > div:nth-child(4) {
    margin: 0 5px;
    padding: 0 5px;
    background: -webkit-linear-gradient(top, rgba(255,255,255,0) 0%,rgba(178,255,233,1) 30%,rgba(173,255,232,1) 32%,rgba(173,255,232,1) 70%,rgba(255,255,255,0) 100%);
    background: linear-gradient(to bottom, rgba(255,255,255,0) 0%,rgba(178,255,233,1) 30%,rgba(173,255,232,1) 32%,rgba(173,255,232,1) 70%,rgba(255,255,255,0) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00ffffff', endColorstr='#00ffffff',GradientType=0 );
}

.main-img {
    display: flex;
    width: 100%;
    align-items: flex-end;
}

    .main-img img {
        max-width: 100%;
    }
/*Login modal style*/
#manage-UserRoleNoPermissionPopup .modal-header, #manage-UserRoleNoPermissionPopup .modal-header button {
    background: #e74c3c !important;
}

#manage-UserRoleAssignPermissionPopup .modal-header button {
    background: none !important;
}

#manage-UserRoleAssignPermissionPopup label {
    color: unset !important;
}

#manage-UserRoleNoPermissionPopup .modal-header h5, #manage-UserRoleAssignPermissionPopup .modal-header h5 {
    font-size: 0.90rem;
    word-break: break-word !important;
    margin-right: 10px;
}

#manage-UserRoleNoPermissionPopup .modal-dialog, #manage-UserRoleAssignPermissionPopup .modal-dialog {
    max-width: 600px !important;
}

#dvUserRoleSelection > div {
    display: block;
    width: 100%;
    font-size: 12px !important;
    margin: 2px 0px
}

#manage-UserRoleAssignPermissionPopup .tempdiv {
    padding: 5px 0
}

#dvUserRoleSelection > div input {
    margin: 0px 10px !important;
}

#dvUserRoleSelection > div b {
    font-weight: 600;
}

#dvUserRoleSelection > div label {
    font-size: 12px !important;
}

#dvUserRoleSelection > div .label_simple {
    margin: 0 0 0 35px !important;
}

#manage-UserRoleAssignPermissionPopup .tempdiv.alert-success label:last-child {
    color: #16a085 !important;
}

#manage-UserRoleAssignPermissionPopup .tempdiv.alert-danger label:last-child {
    color: #e74c3c !important;
}

#manage-UserRoleAssignPermissionPopup .tempdiv.alert-warning * {
    font-weight: 700;
}

@media screen and (min-width:768px) {
    .modal-link {
        display: flex;
        align-items: center;
    }

    /*.main-img {
        height: 262px;
    }*/
}

@media screen and (max-height:502px) {
    .modal-link {
        display: block;
    }
}

@media screen and (min-width:768px) {
    .topbar {
        display: block !important;
    }

    #searchBar {
        display: inline-flex !important;
    }

        #searchBar[style="display: none;"] {
            display: none !important;
        }
}


.app-downloads {
    font-size: 12px
}

    .app-downloads h2 {
        font-size: 12px !important;
        font-weight: 700 !important;
    }

    .app-downloads .col-md-3 .main-img {
        width: 140px !important;
    }

    .app-downloads .col-md-6 .main-img + div .col-12 span:first-child {
        width: 70px !important;
        text-align: center
    }

    .app-downloads .col-md-3 a span:first-child {
        width: 30px !important;
    }

    .app-downloads .hw-app-gal {
        width: 40px;
    }

@media screen and (min-width:960px) {
    body.rtl .app-downloads .hw-app-gal {
        margin-left: 5px;
    }
}

@media screen and (max-width:1300px) {
    .app-downloads .col-md-3 .main-img {
        width: 130px !important;
    }

    .app-downloads .col-md-3 a span:first-child {
        width: 25px !important;
    }

        .app-downloads .col-md-3 a span:first-child img {
            width: 20px !important;
        }
}

@media screen and (max-width:1260px) {
    .app-downloads .col-md-3 {
        width: 50% !important;
        flex: 0 0 50%;
        max-width: 50%
    }

    .app-downloads .col-md-6 {
        width: 100% !important;
        flex: 0 0 100%;
        max-width: 100%
    }
}

@media screen and (max-width:767px) {
    .app-downloads .col-md-3 {
        width: 100% !important;
        flex: 0 0 100%;
        max-width: 100%
    }

        .app-downloads .col-md-3 a {
            width: auto !important;
            flex: auto !important;
        }

        .app-downloads .col-md-3 .main-img {
            width: 100% !important;
            margin-bottom: 15px
        }

    .app-downloads .col-md-6, .app-downloads .col-md-3 {
        flex-wrap: wrap
    }

        .app-downloads .col-md-3 a br {
            display: none
        }

        .app-downloads .col-md-6 .main-img + div {
            width: 100%;
        }
}

.bootbox-body {
    font-weight: bold !important;
    font-size: medium !important;
}

label.check-container b {
    font-weight: bold !important;
}

.jstree-anchor {
    white-space: normal !important
}

.selectedClassificationContainer td.domainContainer {
    width: 110px;
}

.topbar .col-md-auto a, .topbar .col-md-auto li {
    border: none !important;
}

div#manage-ResetPassword .col {
    max-width: calc(100% - 200px);
}

.coursetype,
.exportWithOption {
    background-color: #000000 !important;
}

    .coursetype .arrow::after {
        border-top-color: #000000 !important;
        border-bottom-color: #000000 !important;
    }

    .coursetype .popover-body a,
    .coursetype .popover-body span {
        color: #fff !important;
    }

body.rtl div#dvRole.onStudentRole {
    border-left: 0;
}

.bootbox .modal-footer {
    display: block !important;
}

    .bootbox .modal-footer button {
        float: right !important;
        margin-left: 10px !important;
    }

body.rtl .bootbox .modal-footer button {
    float: left !important;
    margin-right: 10px !important;
}

span#spnHelp {
    display: inline-block;
    vertical-align: middle;
    line-height: 18px;
}

span#spnUserManual {
    display: inline-block;
    vertical-align: middle;
}

.spnUserManual img {
    remove margin-right
}

.not-rounded-right {
    /*border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;*/
    border-radius: 0 !important;
}

.dropdown-menu > .exportWith:hover {
    color: #000 !important;
    opacity: 0.8;
}

body.rtl .dropdown-toggle-split {
    border-top-left-radius: 0 !important;
    border-bottom-left-radius: 0 !important;
    border-top-right-radius: 0.25rem !important;
    border-bottom-right-radius: 0.25rem !important;
}

.popover-footer {
    margin: 0;
    padding: 8px 14px;
    font-size: 14px;
    font-weight: 400;
    line-height: 18px;
    background-color: #F7F7F7;
    border-bottom: 1px solid #EBEBEB;
    border-radius: 5px 5px 0 0;
}

/*restrict image drag content web*/

img {
    -webkit-user-drag: none;
    -khtml-user-drag: none;
    -moz-user-drag: none;
    -o-user-drag: none;
    user-drag: none;
}

.export-heading {
    color: #FFF;
    margin-bottom: 15px;
    margin-top: -1px;
    flex-wrap: nowrap;
}

    .export-heading h2 {
        font-size: 16px;
        font-weight: 500;
        border: none !important;
        text-transform: uppercase;
        margin: 0;
        color: #FFF;
        padding: 10px 15px;
    }

    .export-heading a {
        background: #ecd078;
        font-size: 14px;
        color: #000;
        text-decoration: none;
        line-height: 40px
    }

.table-wrapper {
    max-height: 300px;
    overflow: auto;
    display: inline-block;
}

.custom-modal {
    max-width: 100%;
    width: 100%;
    margin: 0;
    top: 10px;
    transform: translateY(0);
    border-radius: 0;
}

#consent-popup {
    font-size: 14px;
    position: fixed;
    bottom: 0;
    left: 0;
    right: 0;
    padding: 1rem 2rem;
    background-color: #fff;
    transition: opacity 1s ease;
}

.active-state {
    background-color: #FFFF00 !important;
}

.expander {
    text-decoration: underline !important;
}

.ACright-con {
    min-height: calc(100vh - 221px);
    width: calc(100% - 235px);
    background: #FFF;
    border: 1px solid #428bca;
}

.main_Container2 {
    padding: 2px;
    background: #fff;
}
/*
@font-face {
    font-family: "emirates";
    src: url("../Content/fonts/Emirates/Emirates-Medium.ttf") format("truetype");
    font-weight: bold;
    font-style: normal;
}

@font-face {
    font-family: "emirates";
    src: url("../Content/fonts/Emirates/Emirates-Medium.ttf") format("truetype");
    font-weight: 300;
    font-style: normal;
}

@font-face {
    font-family: "emirates";
    src: url("../Content/fonts/Emirates/Emirates-Medium.ttf") format("truetype");
    font-weight: normal;
    font-style: normal;
}*/

.hideSeekBar > audio::-webkit-media-controls-timeline,
.hideSeekBar > video::-webkit-media-controls-timeline {
    display: none !important;
}

.rubricCourseComponentLink .list-group-item {
    padding: 5px 25px !important;
}

    .rubricCourseComponentLink .list-group-item label {
        margin-bottom: 0px !important;
    }

body.rtl .rubricCourseComponentLink .list-group-item {
    padding: 5px 10px !important;
}

    body.rtl .rubricCourseComponentLink .list-group-item label {
        margin-right: 18px !important;
    }