/**************************
/**************************
            Common CSS
            ************************/

.alertText {
        font-size: 11px;
        padding: 10px;
}

.common-circle {
        border-radius: 50% !important;
        display: inline-block !important;
        background: #dbedff !important;
        border: 1px solid #b9d6ff !important;
}
.common-circle p {
        height: 55px;
        width: 55px;
        display: flex;
        font-size: 18px;
        color: #1967d2;
        align-items: center;
        text-align: center;
        justify-content: center;
        vertical-align: middle;
        text-decoration: none;
        text-transform: uppercase;
}

.th-center {
        text-align: center;
}

.td-center {
        text-align: center;
}

.form-check-input:disabled ~ .form-check-label {
        color: #cdcdcd;
}

.fixFooterModal {
        justify-content: flex-end;
        border-top: 1px solid #e2e5ed;
        padding: 10px 15px;
        display: flex;
        align-items: center;
        position: absolute;
        bottom: 0;
        align-items: center;
        background: #fff;
        width: 100%;
}

.licenceWrapper .progressBox {
        margin-top: 10px;
        background-color: unset;
        border: unset;
        padding: unset;
}

.licenceWrapper .progress_content {
        display: flex;
        justify-content: space-between;
}

.licenceWrapper .progress_content p {
        margin-bottom: 5px;
        font-size: 12px;
        color: #000;
}

.licenceWrapper .dashHeader {
        border-bottom: 1px solid #e2e5ed;
        padding: 5px 0 10px;
        width: 100%;
        position: relative;
}

.licenceWrapper .progress {
        height: 8px;
}

.licenceWrapper .dateBox {
        background: #f6f6f6;
        display: inline-block;
        padding: 5px 10px;
        border-radius: 10px;
        margin-top: 10px;
}

.licenceWrapper .dateBox p {
        margin-bottom: 0;
        font-size: 10px;
        color: #000;
}

.th_center {
        text-align: center;
}

.td_center {
        text-align: center;
}

.dFlex {
        display: flex;
}
select {
        cursor: pointer;
}
.editBtn {
        display: flex;
        align-items: center;
        cursor: pointer;
        color: #007bff; /* Adjust color as needed */
        text-decoration: none;
        padding: 5px; /* Adjust padding as needed */
}

.editBtn:hover {
        color: #0056b3; /* Adjust hover color as needed */
}

.editBtn span {
        margin-right: 5px; /* Space between icon and text */
}
.hideElement {
        display: none;
}

.quizTimer {
        font-size: 12px;
        color: #664d03;
        font-weight: 600;
        padding: 5px 15px;
        border-radius: 5px;
        margin-bottom: 10px;
        background: #fff3cd;
        display: inline-block;
        border: 1px solid #c6c6c6;
}

.autoCampaigndFlex {
        display: flex;
        margin-top: 15px;
}

.autoCampaignleftBox {
        list-style: none;
        padding: 0;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
}

.autoCampaignleftBox li {
        margin-bottom: 20px;
        margin-right: 20px;
}
.rmModal .modal-dialog {
        width: 800px !important;
}

.rmModal .modal-dialog .ul {
        text-decoration: underline;
}

.rmModal .modal-dialog .rmUsersTable {
        height: 50vh;
        overflow: auto;
}

.rmModal .modal-dialog .removeHeight{
        height:auto !important;
}


.cTempWrapper {
        padding: 50px;
}

.creative-table-modal-wrapper,
.course-table-modal-wrapper {
        height: 62vh;
        overflow: auto;
}

.chartBlock {
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        background-color: #fff;
        background-clip: border-box;
        border-radius: 0.5rem;
        border: 1px solid #dfe2e6;
}

.tagTitle {
        font-size: 10px;
        margin-right: 5px;
}
.fs-13 {
        font-size: 13px;
}
.zohohc-84bf3c7a38 {
        z-index: 0 !important;
}

.resend_otp {
        font-size: 16px;
        color: #626262;
        margin-top: -20px;
}

.card-img-top {
        object-fit: cover;
        height: 200px;
}

.course_wrap {
        margin-bottom: 30px;
}

.course_card_border {
        display: block;
        border: 1px solid #eaeaea;
        transition: all 0.5s ease;
        position: relative;
}

.course_card_border:hover {
        box-shadow:
                0 2px 2px 0 rgb(0 0 0 / 14%),
                0 3px 1px -2px rgb(0 0 0 / 12%),
                0 1px 5px 0 rgb(0 0 0 / 20%);
}

.btn-fa-download {
        position: absolute;
        padding: 3px 9px;
        font-size: 12px;
        top: 10px;
        right: 9px;
        z-index: 1;
        background: #00000078;
        color: #fff;
        border: 1px solid #87878782;
}
a[disabled] {
        cursor: not-allowed;
}

.fixed_links {
        position: absolute;
        width: 100%;
        height: 100%;
        left: 0;
        top: 0;
        cursor: pointer;
        z-index: 1;
}

.campaign_res_page {
        text-align: right;
}

.page-switch-wrapper {
        position: -webkit-sticky;
        position: sticky;
        display: flex;
        justify-content: center;
        background: lightblue;
        box-shadow: rgb(0 0 0 / 45%) 0px -25px 20px -30px;
        bottom: 0px;
        /* width: 100%; */
}

.btn-finish {
        background: #5aa7d3de;
        color: #fff;
}

.btn-back {
        background: #464a6b;
        color: #fff;
}

thead {
        background: #f6f6f6;
}

.solo-head {
        padding: 11px 0px;
}
/* .btn {
                border-radius: 3px;
                font-size: 13px;
                padding: 6px 12px;
            } */
h5 {
        font-size: 15px;
}
i {
        margin: 0 !important;
}
.function-bar .dropdown {
        margin: 0px 2px;
}
.function-bar label {
        font-size: 12px;
        margin-bottom: 5px;
}

.function-bar .form-group {
        margin-bottom: 12px;
}
.mobile_depart .row {
        justify-content: flex-end !important;
        margin: 0;
}
.mobile_depart .dropdown {
        margin: 0px 2px;
}

.tablecheckBox {
        width: 0;
        font-size: 15px !important;
        padding: 0 5px 0 15px !important;
        text-align: center;
}

/**************************
            Dashboard Action Cards 
            ************************/

.switch {
        position: relative;
        display: inline-block;
        width: 38px;
        height: 17px;
        margin-bottom: 0px;
        margin: 0px !important;
}

.switch-wrap {
        display: flex;
        align-items: center;
}

.switch input {
        opacity: 0;
        width: 0;
        height: 0;
}

.slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: -4px;
        bottom: 0;
        background-color: #ccc;
        -webkit-transition: 0.4s;
        transition: 0.4s;
}

.slider:before {
        position: absolute;
        content: '';
        height: 14px;
        width: 14px;
        left: 1px;
        bottom: 2px;
        background-color: white;
        -webkit-transition: 0.4s;
        transition: 0.4s;
}

input:checked + .slider {
        background-color: #49a24c;
}

input:focus + .slider {
        box-shadow: 0 0 1px #49a24c;
}

input:checked + .slider:before {
        -webkit-transform: translateX(26px);
        -ms-transform: translateX(26px);
        transform: translateX(26px);
}

/* Rounded sliders */
.slider.round {
        border-radius: 34px;
}

.slider.round:before {
        border-radius: 50%;
}
#checkLogin {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
}
#checkLogin .switch {
        margin-top: -4px !important;
}
#checkLogin h3 {
        margin-bottom: 0px;
}
.upload_set {
        display: flex;
        align-items: center;
        margin-top: 20px;
}
.upload_set .showCert {
        margin-left: 12px;
        margin-bottom: 0;
}
.col_div {
        display: flex;
        justify-content: flex-end;
}
.sign_in_on {
        display: flex;
        justify-content: space-between;
        align-items: center;
}

.sign_in_on .form-group {
        width: 100%;
}

.contentbar h3.setting-subheading {
        font-size: 18px;
        color: #585b5f;
        font-weight: 500;
        margin-bottom: 20px;
        font-weight: 700;
}

.card_sso {
        border: 2px solid rgb(59, 125, 206);
        text-align: center;
}
.file {
        margin: 15px 0px 0px;
}
.file label {
        /* width: 130px; */
        padding: 7px 10px;
        font-size: 14px;
        background-color: rgba(0, 128, 255, 0.1);
        border: none;
        color: #284db3;
        cursor: pointer;
}

.file--upload > label {
        color: hsl(204, 86%, 53%);
        border-color: hsl(204, 86%, 53%);
}
.run_campaign {
        width: 100%;
}
.action-cards .card {
        border: 1px solid #f1f1f1;
        box-shadow: 0 0px 4px 0 rgba(183, 183, 183, 0.39);
}
.report_detail {
        padding: 0px 11px;
        margin-bottom: 25px;
}
.heading_report {
        margin-bottom: 30px;
}
.action-cards .card-body {
        padding: 15px;
}

.action-cards .card-text {
        color: #424444;
        font-size: 15px;
        line-height: 21px;
        min-height: 64px;
}

.report_ui {
        box-shadow: 5px 6px 6px rgba(110, 110, 110, 0.22);
        padding: 10px 10px;
        border-radius: 5px;
}

.report_ui h5 {
        color: #fff;
}

.report_ui p {
        color: #fff;
}

.report_detail .mini-box-1 {
        background: #4081ed;
}

.report_detail .mini-box-2 {
        background: #e85e66;
}

.report_detail .mini-box-3 {
        background: #f0b442;
}

.report_detail .mini-box-4 {
        background: #4fb17a;
}

.report_detail .mini-box-5 {
        background: #6664c8;
}

.report_detail .mini-box-6 {
        background: #e39a65;
}
#TableBox {
        border: 2px solid #ececeb !important;
        border-radius: 13px !important;
}
.formModalinput {
        background-color: #f9f9f9;
}
.bgIconCalendar {
        background-color: #fff !important;
}
.dropdown-menu.show {
        display: block;
        max-height: 263px;
        overflow: auto;
        border: 0.5px solid #cfd0d3;
}
.calendarIcon {
        position: absolute;
        right: 11px;
        bottom: 13px;
}
/**************************
            Course Section Starts
            ************************/
.content a i {
        vertical-align: bottom;
}
.course-section .course_inner_css {
        background: #ececeb;
        /* padding: 4px 0px 2px 0px; */
        /* box-shadow: rgb(0 0 0 / 6%) 0px 21px 20px -20px; */
        /* border: 1px solid #ccc; */
        border-radius: 5px;
        display: flex;
        justify-content: space-between;
        align-items: center;
        padding: 6px 10px;
        margin-bottom: 20px;
}
.video_desc h5 button i {
        margin: 0 !important;
}
.course-section .dropdown-toggle {
        color: #000;
}

.banner-section {
        position: relative;
        display: flex;
        align-items: center;
        margin-top: 61px;
}
.banner-section img {
        position: absolute;
        left: 0px;
        right: 0px;
}
.banner-section h2 {
        font-size: 39px;
        color: #000;
        font-weight: 700;
}
.banner-section p {
        font-size: 18px;
        color: #000;
}
.latest-section {
        position: relative;
        padding: 30px 0px;
}
.latest-section h5 {
        font-size: 17px;
        font-weight: 700;
        color: black;
        margin-bottom: 20px;
}
.latest-section .latest-box {
        box-shadow: 0 3px 15px rgba(0, 0, 0, 0.085);
        margin-bottom: 20px;
}
.latest-section .latest-box p {
        font-size: 13px;
        font-weight: 600;
        color: #797575;
        margin-bottom: 0px;
}
.latest-section .latest-box h6 {
        font-size: 15px;
        font-weight: 700;
        margin-top: 10px;
}
.latest-section .img-overlay {
        position: relative;
}

.mycreativeBadge {
        background: #2185c3b5;
        color: #ffffff;
        font-size: 14px;
        font-weight: 300;
        position: absolute;
        top: 8px;
        left: 8px;
        padding: 1px 4px;
        border-radius: 5px;
}

.newBadgeWrapper {
        position: absolute;
        top: 8px;
        left: 10px;
}

.newBadgeWrapper .badge-new {
        background: #e79b3a;
        color: white;
        font-size: 13px;
        border: none;
        border-radius: 5px;
}

.badge-container .badge-new {
        background: #e79b3a;
        color: white;
        font-size: 10px;
        border: none;
        border-radius: 5px;
        padding: 3px 5px !important;
}

.latest-section .latest-box .overlay-btn {
        transition: 0.5s ease;
        opacity: 1;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        -ms-transform: translate(-50%, -50%);
        text-align: center;
        z-index: 1;
        visibility: hidden;
}
.runINfo-img {
        border: 10px solid #f9f9f9;
}
.latest-section .latest-box .overlay-btn .btn-link {
        color: #fff;
}
.latest-section .latest-box .img-overlay:hover .btn-link {
        visibility: visible;
        color: white;
}
.latest-section .img-overlay:hover img {
        opacity: 0.3;
}
.latest-section .img-overlay {
        background-color: rgb(0, 0, 0, 0.88);
}

.img-overlay .img-icon {
        position: absolute;
        right: 5px;
        top: 6px;
        background: rgb(255 255 255 / 36%);
        padding: 4px;
        color: #fff;
        border-radius: 4px;
}
#course-preview
        .left-sidebar
        .card
        .card-body
        .list-group
        .list-group-item.active {
        background: rgba(0, 128, 255, 0.1);
}

.lecture-text .lecture-num {
        margin-right: 5px;
}
/* .course-section .dropdown-menu {
                top:4px !important;
            } */
.btn-back:hover {
        color: #fff !important;
}
.new_verify.authenticate-bg {
        display: block;
        background: #f8f8fb;
}

.course-section .dropdown-toggle:focus {
        box-shadow: none !important;
        background: unset !important;
}
.export_file i {
        cursor: initial;
}

.course-section .grid_list_item i {
        color: #373a4d;
        font-size: 24px;
        border-radius: 3px;
        background: transparent;
        cursor: pointer;
}

.course-section .grid_sty h5,
#library-video .grid_sty h5,
#lectureCreativeModalBody .grid_sty h5,
#imageModalBody .grid_sty h5 {
        font-size: 14px;
        margin-bottom: 8px;
}

#library-video .grid_sty,
#lectureCreativeModalBody .grid_sty,
#imageModalBody .grid_sty {
        align-items: center;
        border-right: 1px dashed #f3f6fa;
        padding: 0px 10px;
}

#library-video .grid_sty .date-text,
#lectureCreativeModalBody .grid_sty .date-text,
#imageModalBody .grid_sty .date-txt {
        font-size: 13px;
}

#lectureCreativeModalBody .grid_creative_view .dt,
#library-video .grid_video_view .dt {
        font-size: 13px;
}

#library-video .grid_sty .block-head,
#lectureCreativeModalBody .grid_sty .block-head {
        font-size: 13px;
        color: #263a5b;
        line-height: 30px;
}

#lectureCreativeModalBody .grid_creative_view .dt,
#library-video .grid_video_view .dt {
        font-size: 13px;
}

#library-video .grid_sty .video-lecture-addt-text,
.image-library-content .creative-lecture-addt-text,
.image-library-content .image-lecture-addt-text,
#lectureCreativeModalBody .grid_sty .creative-lecture-addt-text {
        font-size: 13px;
        color: #636363;
}

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

#lectureCreativeModalBody .grid_creative_view,
#imageModalBody .grid_image_view {
        border-bottom: 1px solid #f1f1f1;
        margin: 0;
        padding: 5px 0px;
        display: flex;
        align-items: center;
}

#library-video .grid_video_view p,
.grid_creative_view p,
#imageModalBody .grid_image_view p {
        margin-bottom: 0px;
}

#library-video .content-hover,
.grid_course_view p .grid_image_view p {
        position: absolute;
        top: 0;
        background: #e8e8e8;
        width: 100%;
        opacity: 0;
        text-align: center;
        height: 0%;
        transition: all 0.5s ease;
        display: flex;
        align-items: center;
}

.btn-primary.disabled:hover,
.btn-primary:disabled:hover {
        background: #ccc;
        border-color: #ccc;
        color: #000;
        cursor: not-allowed;
}
.btn-primary.disabled,
.btn-primary:disabled {
        background: #ccc;
        border-color: #ccc;
        color: #000;
        cursor: not-allowed;
}

.dash-card .card-header:first-child {
        background: unset;
}

.course-section .content-hover {
        position: absolute;
        top: 0;
        background: #e8e8e8;
        width: 100%;
        opacity: 0;
        text-align: center;
        height: 0%;
        transition: all 0.5s ease;
        display: flex;
        align-items: center;
}

.course-section .content-hover span {
        text-align: center;
        width: 100% !important;
        color: #373a4d;
        font-size: 17px;
        text-decoration: underline;
}

#setting-buttons {
        margin-top: 40px;
}

.loader_con p {
        margin: 0;
        padding: 0px !important;
        font-size: 15px;
}
.btn-primary.disabled:hover,
.btn-primary:disabled:hover {
        background: #ccc;
        border-color: #ccc;
        color: #000;
        cursor: not-allowed;
}
.btn-primary.disabled,
.btn-primary:disabled {
        background: #ccc;
        border-color: #ccc;
        color: #000;
        cursor: not-allowed;
}

#createMet {
        margin: 0 !important;
        margin-top: 12px !important;
}
#setting-buttons p {
        padding-top: 13px;
}
.join_meeting p {
        padding-top: 18px;
}

#demo1 {
        position: absolute;
        top: 1px;
        background: #ff5722;
        padding: 3px 10px;
        right: 1px;
        border-radius: 4px 0px 0px 4px;
        color: #fff;
        margin: 0;
        box-shadow:
                0 2px 2px 0 rgba(0, 0, 0, 0.14),
                0 3px 1px -2px rgba(0, 0, 0, 0.12),
                0 1px 5px 0 rgba(0, 0, 0, 0.2);
}
#demo {
        padding-top: 10px;
}

#demo span {
        border: 1px solid #0e2954;
        background: #0e2954;
        margin-left: 3px;
        color: #fff;
}
.add_date_time {
        text-align: left;
}
.content p span {
        /* background: #f28a3c; */
        border-radius: 5px;
        /* padding: 4px 6px; */
        color: #0e2954;
        line-height: 26px;
        margin-bottom: 0px;
        font-weight: 600;
}

.tab_content_course .create_sk {
        position: absolute;
        right: 18px;
        color: #0e2954;
        font-weight: 600;
}
.create_sk i {
        margin: 0;
}
.back_btn_ev.text-right .save_draft {
        margin: 5px 5px;
}
.back_btn_ev {
        justify-content: flex-end;
        position: absolute;
        right: 0;
        display: flex;
}

.course-section .content-head:hover .content-hover {
        opacity: 0.9;
        height: 100%;
        background: #ececeb;
}

.media.report_ui i {
        margin: 0;
}

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

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

/* Dashboard css start here */

.heading_top_common h1 {
        font-size: 24px;
        margin-bottom: 20px;
        padding: 10px 0px;
        position: relative;
}
.heading_top_common h1:after {
        content: '';
        position: absolute;
        border-bottom: 4px solid #0b7df6;
        bottom: -2px;
        left: 0px;
        width: 60px;
        border-radius: 20px;
}
.heading_top_common p {
        color: #000;
        font-size: 16px;
        line-height: 25px;
        margin-bottom: 30px;
}
.heading_top_common {
        position: relative;
}
.card_link_com {
        background: #0b7dfa;
        text-align: center;
        padding: 8px 16px;
        color: #ffffff;
        font-weight: 600;
        font-size: 16px;
        border-radius: 5px;
        box-shadow:
                0 4px 5px 0 rgba(0, 0, 0, 0.14),
                0 1px 10px 0 rgba(0, 0, 0, 0.12),
                0 2px 4px -1px rgba(0, 0, 0, 0.3);
        transition: all 0.5s ease;
}

.dashboard_css .card {
        box-shadow:
                0 4px 5px 0 rgba(0, 0, 0, 0.14),
                0 1px 10px 0 rgba(0, 0, 0, 0.12),
                0 2px 4px -1px rgba(0, 0, 0, 0.3);
}
.card_link_com:hover {
        background: #fff;
        color: #0a7cfa;
}
/* Dashboard css end here */

/* Course css start here */

.tutorial .slider {
        width: 100%;
        height: 300px;
        background-color: #f03861;
}
.tutorial .information {
        width: 100%;
        padding: 20px 50px;
        margin-bottom: 30px;
        font-family: 'Open Sans', sans-serif;
}
.tutorial .information h1 {
        color: #333;
        font-size: 1.5rem;
        padding: 0px 10px;
        border-left: 3px solid #f03861;
}
.tutorial .information h3 {
        color: #e0e0e0;
        font-size: 1rem;
        font-weight: 300;
        padding: 0px 10px;
        border-left: 3px solid #f03861;
}
.tutorial .information p {
        padding: 10px 0px;
}

.tutorial ul {
        font-size: 0;
        list-style-type: none;
        margin: 0;
        padding: 0;
        z-index: 1;
}
.tutorial ul li {
        font-family: 'Open Sans', sans-serif;
        font-size: 16px;
        font-weight: 400;
        color: #fff;
        display: inline-block;
        position: relative;
}
.tutorial ul li ul {
        display: none;
}
/* .tutorial ul li:hover {
                cursor: pointer;
                background-color: #f2f2f2;
                color: #333;
            } */
.tutorial ul li:hover ul {
        display: block;
        margin-top: 14px;
        width: 200px;
        left: 0;
        position: absolute;
        padding: 0;
}
.tutorial ul li:hover ul li {
        display: block;
        background-color: #e7e7e7;
}
.tutorial ul li:hover ul li span {
        float: right;
        color: #f9f9f9;
        background-color: #f03861;
        padding: 2px 5px;
        text-align: center;
        font-size: 0.8rem;
        border-radius: 3px;
}
.tutorial ul li:hover ul li:hover {
        background-color: #e0e0e0;
}
.tutorial ul li:hover ul li:hover span {
        background-color: #ee204e;
}
.table_css tr td {
        color: #333 !important;
}

.tutorial ul li ul li {
        color: #333;
        font-size: 15px;
        padding: 5px 15px;
}

.tabs-left {
        border-bottom: none;
        border-right: 1px solid #ddd;
}

.tabs-left > li {
        float: none;
        margin: 0px;
}

.tabs-left > li.active > a,
.tabs-left > li.active > a:hover,
.tabs-left > li.active > a:focus {
        border-bottom-color: #ddd;
        border-right-color: transparent;
        background: #f90;
        border: none;
        border-radius: 0px;
        margin: 0px;
}
.nav-tabs > li > a:hover {
        /* margin-right: 2px; */
        line-height: 1.42857143;
        border: 1px solid transparent;
        /* border-radius: 4px 4px 0 0; */
}
.tabs-left > li.active > a::after {
        content: '';
        position: absolute;
        top: 10px;
        right: -10px;
        border-top: 10px solid transparent;
        border-bottom: 10px solid transparent;

        border-left: 10px solid #f90;
        display: block;
        width: 0;
}

.custom-file-uploader {
        position: relative;
}
.custom-file-uploader input[type='file'] {
        display: block;
        color: red;
        position: absolute;
        top: 0;
        right: 0;
        bottom: 0;
        left: 0;
        z-index: 5;
        width: 100%;
        height: 100%;
        opacity: 0;
        cursor: default;
}
.tab_content_course {
        margin-top: 20px;
}
.form-group {
        margin-bottom: 18px;
}

.img_show_upload {
        border: 2px dashed #b7c0cd;
        height: inherit;
        width: 250px;
        padding: 5px 5px;
        border-radius: 5px;
}
.img_show_upload img {
        width: 100%;
        height: auto;
}

/* create curriculum css start here */

.course-box .row {
        margin: 0;
}

.slide_right_modal .modal-dialog {
        max-width: 1000px;
}
.modal-body video {
        width: 100%;
}
ul.pagination {
        margin: 0;
}
i {
        cursor: pointer;
}

.section_co {
        padding: 15px 10px !important;
        margin-bottom: 10px;
        border-radius: 5px;
}

#section_common span {
        color: #fff;
}

.section_common span i:hover {
        color: #ed7c36;
}

.section_name_new {
        color: #000;
}

.btn-outline-primary i:hover i {
        color: #fff;
}

.add_skill {
        margin-bottom: 20px;
}
.add_skil {
        margin-bottom: 10px;
        text-align: right;
}
.modal-dialog.modal-dialog-centered {
        width: 100% !important;
        max-width: 900px;
}
button.btn.btn-secondary.btn_save {
        position: absolute;
        right: 17px;
        top: 0;
}
.create_crourse:hover {
        background: #fff;
        color: #0f7bf6;
}
.create_crourse {
        position: absolute;
        top: 0;
        background: #0b7cf6;
        color: #ffffff;
        right: 3px;
        border-radius: 5px;
        padding: 5px 8px;
        box-shadow:
                0 2px 2px 0 rgba(0, 0, 0, 0.14),
                0 3px 1px -2px rgba(0, 0, 0, 0.12),
                0 1px 5px 0 rgba(0, 0, 0, 0.2);
        transition: all 0.5s ease;
}
.active_video {
        border: 1px dashed blue;
        padding: 5px 5px;
        box-shadow:
                0 4px 5px 0 rgba(0, 0, 0, 0.14),
                0 1px 10px 0 rgba(0, 0, 0, 0.12),
                0 2px 4px -1px rgba(0, 0, 0, 0.3);
        transition: all 0.2s ease;
}

.modal-dialog {
        width: 100%;
        max-width: 100%;
}

.reminderModal .modal-dialog {
        width: 100%;
        max-width: 100%;
        /* max-height: 60%; */
}
#previewModal .modal-dialog {
        max-width: 1000px;
}

#previewModal .modal-content {
        width: 100%;
}

.quiz {
        margin: 30px 0px 0px;
}

.trash_icon i.feather.icon-trash-2 {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        color: red;
}
.quiz_block {
        margin-bottom: 20px;
}
.check_box_quiz .input-group-prepend {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
}
.icon_list i {
        margin: 0px 3px;
}
.question_list {
        position: relative;
}
.icon_list {
        position: absolute;
        right: 3px;
        top: -4px;
        background: #414444;
        padding: 6px 10px;
        color: #fff;
        text-align: center;
}
/* Course css end here */

.infoLead {
        font-size: 12px;
}

/* user management css start here */

.user_mangement tr td p {
        margin: 0;
        font-size: 12px;
}
.user_mangement th i {
        color: #f28a3c;
        font-size: 19px;
        vertical-align: middle;
}
/* .user_mangement table{
                margin: 15px 0px;
            } */
.user_grp_head i {
        margin-right: 6px;
}
/* .user_mangement td .icon-edit {
                padding: 10px;
                border-radius: 3px;
                margin-left: 6px;
                background-color: rgba(255, 168, 0, 0.1);
                color: #ffa800;
            }


            .user_mangement td .icon-trash-2{
            padding: 10px;
                border-radius: 3px;
                margin-left: 6px;
                background-color: rgba(255, 63, 63, 0.1);
                color: #ff3f3f;
            } */

.add_new_user i {
        margin-right: 6px;
}
.user_list .add_user {
        width: 100%;
        max-width: 160px;
}

.add_new_user {
        margin-bottom: 10px;
}

.user_list_table {
        margin: 20px 0px 0px;
}

.top-sec .mini-blocks i {
        cursor: auto;
}
.top-sec .mini-blocks:nth-last-child(1) {
        border-right: 0;
}

.icon_set_depart {
        display: flex;
        justify-content: start;
        align-items: center;
}

.user_mangement td a i {
        vertical-align: bottom;
}
#accordian {
        color: #000;
        border: 1px solid #ced4da;
        border-radius: 4px;
        padding: 1px 0px;
        background: #fff;
        z-index: 1;
}
#accordian.accor {
        color: #000;
        border: 1px solid #ced4da;
        border-radius: 4px;
        padding: 1px 0px;
        position: relative;
        width: 100%;
        background: #fff;
        z-index: 1;
}

#accordian h3 a {
        padding: 0 10px;
        font-size: 14px;
        line-height: 34px;
        display: block;
        color: #0e2954;
        cursor: pointer;
        text-decoration: none;
}

#accordian h3:hover {
        text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);
}
div#accordian h3 {
        margin: 0;
}
i {
        margin-right: 10px;
}

#accordian li {
        list-style-type: none;
        position: relative;
}
.common_form {
        position: absolute;
        left: 20px;
        top: 10px;
        z-index: 999;
}
#accordian ul ul li a,
#accordian h4 {
        color: #414444;
        text-decoration: none;
        font-size: 14px;
        display: block;
        padding: 10px 15px;
        transition: all 0.15s;
        position: relative;
        display: flex;
        align-items: center;
}

#accordian ul ul li a:hover {
        background: #f1f1f1;
}

#accordian ul ul {
        display: none;
        max-height: 150px;
        overflow: auto;
}

#accordian li.active > ul {
        display: block;
}

#accordian ul ul ul {
        margin-left: 15px;
        border-left: 1px dotted rgb(242, 138, 60);
}

#accordian a:not(:only-child):after {
        content: '\f104';
        font-family: fontawesome;
        position: absolute;
        right: 20px;
        font-size: 17px;
        top: 50%;
        color: #fff;
        transform: translateY(-50%);
        background: #0e2954;
        padding: 0px 10px;
        border-radius: 32px;
}

#accordian .active > a:not(:only-child):after {
        content: '\f107';
}

div#accordian ul {
        margin: 0;
        padding: 0;
}
.media_object .media {
        background: #3cbd462b;
        margin-left: 16px;
        padding: 15px 48px;
        border-radius: 5px;
        box-shadow:
                0 4px 5px 0 rgba(0, 0, 0, 0.14),
                0 1px 10px 0 rgba(0, 0, 0, 0.12),
                0 2px 4px -1px rgba(0, 0, 0, 0.3);
        position: relative;
}

/* accordian new css start here */
/* accordian new css start here */

#accordianSet {
        color: #000;
        border: 1px solid #ced4da;
        border-radius: 4px;
        padding: 1px 0px;
        background: #fff;
        z-index: 3;
        position: relative;
        width: 100%;
}
.skill_department #accordianSet {
        z-index: 0;
}
.skill_department {
        margin-bottom: 20px;
}

#accordianSet h3 a span {
        background: #0e2954;
        padding: 0px 8px;
        border-radius: 30px;
        color: #ffffff;
        position: relative;
        margin-left: 3px;
        display: inline-block;
        margin-bottom: 4px;
        margin-top: 4px;
        font-size: 12px;
        line-height: 23px;
}

#accordianSet h3 a {
        padding: 0 10px;
        font-size: 14px;
        line-height: 34px;
        display: block;
        color: #0e2954;
        cursor: pointer;
        text-decoration: none;
}

#showUl {
        display: none;
}

#showUlOfSkills {
        display: none;
}
#accordianSet h3:hover {
        text-shadow: 0 0 1px rgba(255, 255, 255, 0.7);
}
div#accordianSet h3 {
        margin: 0;
}
i {
        margin-right: 10px;
}

#accordianSet li {
        list-style-type: none;
        position: relative;
}
#accordianSet ul ul li a,
#accordianSet h4 {
        color: #414444;
        text-decoration: none;
        font-size: 14px;
        line-height: 27px;
        display: block;
        padding: 10px 40px;
        transition: all 0.15s;
        position: relative;
}

#accordianSet ul ul li a:hover {
        background: #f1f1f1;
}

#accordianSet ul ul {
        display: none;
        max-height: 150px;
        overflow: auto;
}

#accordianSet li.active > ul {
        display: block;
}

#accordianSet ul ul ul {
        margin-left: 15px;
        border-left: 1px dotted rgb(242, 138, 60);
}

#accordianSet a:not(:only-child):after {
        content: '\f104';
        font-family: fontawesome;
        position: absolute;
        right: 10px;
        font-size: 21px;
        top: 50%;
        color: #0e2954;
        transform: translateY(-50%);
}

#accordianSet .active > a:not(:only-child):after {
        content: '\f107';
}

div#accordianSet ul {
        margin: 0;
        padding: 0;
}

.settablebgColor {
        background: #e9e9e9 !important;
}

.media i {
        color: #fff;
}
.media_object .media img {
        max-width: 36px;
        position: absolute;
        left: -7px;
        top: -6px;
        background: #263a5b;
        padding: 10px 10px;
        border-radius: 100%;
        /* box-shadow: 0 4px 5px 0 rgba(0,0,0,0.14), 0 1px 10px 0 rgba(0,0,0,0.12), 0 2px 4px -1px rgba(0,0,0,0.3); */
}
.heading_user_sub h5 {
        margin-bottom: 30px;
}

.heading_user_sub {
        margin-bottom: 40px;
}

.skill_add_list {
        position: absolute;
        right: 0;
        top: 0;
}
.tab_links_ui {
        position: relative;
}

/* run campaign css start here */
/* run campaign css start here */

.run_campaign_ui i {
        font-size: 26px;
        color: #f17f3a;
}

#accordian ul li i {
        margin-right: 10px !important;
}
.run_campaign_ui {
        display: block;
        background: #f28a3c;
        padding: 20px 20px;
        box-shadow:
                0 4px 5px 0 rgba(0, 0, 0, 0.14),
                0 1px 10px 0 rgba(0, 0, 0, 0.12),
                0 2px 4px -1px rgba(0, 0, 0, 0.3);
        border-radius: 5px;
        text-align: center;
}

.bootstrap-select button {
        background: #fff !important;
}

/* dashboard css */

.new_dash ul li {
        display: inline-block;
        width: 22%;
        text-align: center;
        padding: 20px 20px;
        position: relative;
        margin-right: 30px;
}
.new_dash ul li:last-child:after {
        display: none;
}
.new_dash ul li:last-child {
        margin-right: 0;
}
.card_flow_dash {
        margin-top: 20px;
}
.new_dash ul li:after {
        position: absolute;
        width: 110px;
        height: 13px;
        background: url(../assets/images/img/arrow-img.png);
        content: '';
        top: 25%;
        right: -120px;
        transform: translate(-50%, -50%);
        background-size: cover;
}
.dash_flow img {
        max-width: 125px;
        object-fit: cover;
        width: 100%;
}

/* add skill */

.create_skill {
        display: flex;
        justify-content: space-between;
}
.plus_sign i {
        color: white;
        background: #414444;
        padding: 5px 10px;
        border-radius: 4px;
}

.create_new_skill .form-group span i {
        margin: 0;
}
div#addSkill .form-group span {
        position: absolute;
        right: 142px;
        top: 50%;
        transform: translateY(-50%);
        background: #000;
        text-align: center;
        padding: 5px 10px;
        border-radius: 4px;
        color: #fff;
}
div#addSkill {
        position: relative;
}
#addSubSkill .form-group span {
        position: absolute;
        right: 142px;
        top: 50%;
        transform: translateY(-50%);
        background: #000;
        text-align: center;
        padding: 5px 10px;
        border-radius: 4px;
        color: #fff;
}

div#addSubSkill {
        position: relative;
}

#addSubOfSkill {
        position: relative;
}

#addSubOfSkill .form-group span {
        position: absolute;
        right: 142px;
        top: 50%;
        transform: translateY(-50%);
        background: #000;
        text-align: center;
        padding: 5px 10px;
        border-radius: 4px;
        color: #fff;
}

.form-group {
        position: relative;
}

.create_new_skill input {
        width: 60%;
}

.newCampCreate {
        height: calc(100vh - 205px);
        overflow: auto;
}
.newCampCreate .compHeading {
        margin-bottom: 20px;
        font-size: 15px;
        color: #303840;
        display: flex;
        align-items: center;
        letter-spacing: 0.2px;
        font-weight: 600;
        padding: 0px 15px;
}

.newCampCreate .blockSpace {
        border-bottom: 2px dotted #d6d6d6;
        padding: 25px 0px;
}

.newCampCreate .blockSpace:nth-last-child(1) {
        border-bottom: none;
}

.newCampCreate .point {
        font-size: 10px;
        color: #fff;
        padding: 5px 9px;
        border-radius: 15px;
        margin-right: 10px;
        font-weight: 600;
        background: #303840;
}

.mrSwitch {
        margin-left: 8px;
}

.blockSpace .previewBtn {
        cursor: pointer;
        color: #007bff;
        display: flex;
        align-items: center;
        font-size: 11px;
}

.blockSpace .previewBtn .icon-eye {
        font-size: 12px;
}

.blockSpace .dFlex {
        display: flex;
        align-items: center;
}

.blockSpace .btn-container {
        display: flex;
        justify-content: end;
}

.blockSpace .feedbackCheckBtn {
        margin-top: 14px;
}

.blockSpace .feedbackNote {
        margin-top: 10px;
        padding-left: 15px;
}

.blockSpace .feedbackNote p {
        font-size: 11px;
        color: #8e8e8e;
}

.feedbackCheckBtn .autoCheckbox {
        margin-bottom: 6px;
}

.capFooter {
        border-top: 1px solid #ececec;
        padding: 15px;
        width: 100%;
        background: #f8f8f8;
}
.autoCheckbox .form-check-label {
        font-size: 13px;
        margin-left: 5px;
}

.autoCheckbox .form-check-input {
        width: 13px;
        top: -1px;
}

.autoCheckbox .dashinfoIcon {
        position: unset;
        top: 3px;
        right: 22%;
        color: #b6b6b6;
}

.autoCheckbox .footerinfoIcon {
        padding-left: 10px;
}

#automatemodalCampaign {
        top: 60px;
}

.autoCheckbox {
        display: flex;
        align-items: center !important;
}

.autoCheckbox .btn-primary:focus {
        box-shadow: unset;
        border-color: unset;
        color: #fff;
        background: #0b5ed7;
}

.autoCheckbox .btn-primary:not(:disabled):not(.disabled):active {
        background-color: unset;
        border-color: unset;
}

#automatemodalCampaign .dFlex {
        display: flex !important;
        align-items: center !important;
}
#automatemodalCampaign .dFlex .leftBox {
        padding-right: 45px;
}

#automatemodalCampaign .dFlex .form-group {
        margin-bottom: 10px;
}

#automatemodalCampaign .form-check-input {
        width: 12px;
}

#automatemodalCampaign .form-check-label {
        color: #696969;
        font-size: 13px;
        font-weight: 400;
        margin-bottom: 0px;
}

#automatemodalCampaign .form-control {
        background: #f6f6f6;
}

.footerinfoIcon .form-check {
        display: flex;
        align-items: center;
}

.footerinfoIcon {
        right: 44% !important;
}

.footerinfoIcon .edit-button {
        background: unset;
        color: black !important;
        padding: 2px 6px;
        font-size: 9px;
        margin-left: 8px;
        border-color: #000 !important;
}

.edit_del i {
        margin: 0px 4px;
}
.edit_del {
        position: absolute;
        right: 191px;
        top: -32px;
        background: #000000;
        padding: 5px 10px;
        color: #fff;
        border-radius: 4px;
}

.new_skill ul li {
        display: inline-block;
        width: 28%;
        position: relative;
}
.common .skill_show:after {
        display: none;
}
.new_skill ul li:last-child:after {
        display: none;
}

/* .new_skill ul li:after {
/* .new_skill ul li:after {
                content: "";
                position: absolute;
                width: 110px;
                height: 13px;
                background: url(../assets/images/img/arrow-img.png);
                content: "";
                top: 25%;
                right: -24px;
                transform: translate(-50%,-50%);
                background-size: cover;
            } */

.skill_show span {
        background: #eaeaea;
        padding: 10px;
        color: #000;
        float: right;
}

.icon_pls {
        margin-top: 30px;
}

.icon_pls span {
        padding: 10px 10px;
        background: #eaeaea;
}

.skill_show {
        border: 1px solid #eaeaea;
        padding: 10px 10px;
        margin-bottom: 12px;
        position: relative;
        box-shadow: 0 8px 6px -6px #eaeaea;
}
.skill_show p {
        margin: 0;
        overflow: hidden;
}
.skill_show:after {
        content: '';
        position: absolute;
        border-right: 15px solid transparent;
        border-left: 15px solid #eaeaea;
        border-top: 15px solid transparent;
        border-bottom: 15px solid transparent;
        width: 0;
        height: 0;
        right: -31px;
        top: 50%;
        transform: translateY(-50%);
}
#showSub .skill_show:after {
        display: none;
}

.icon_pls {
        margin-top: 30px;
        overflow: hidden;
        padding: 10px 0px;
}
.icon_form i {
        margin: 0;
}
.icon_form {
        position: absolute;
        top: 0;
        right: 0;
        background: #f07e39;
        color: #fff;
        padding: 4px 7px;
        border-radius: 4px;
}
.form_shw {
        position: absolute;
        width: 100%;
        left: 0;
        top: 0;
        border-radius: 4px;
        background: white;
        padding: 10px 10px;
        box-shadow:
                0 4px 5px 0 rgba(0, 0, 0, 0.14),
                0 1px 10px 0 rgba(0, 0, 0, 0.12),
                0 2px 4px -1px rgba(0, 0, 0, 0.3);
}
/* add skill */
.custom-control.custom-checkbox.custom-control-inline {
        vertical-align: middle;
}

/* course analytic css start here */

.courseTitleH {
        color: #08a256;
        background: #ececeb;
        padding: 5px 10px;
        border-radius: 8px;
        font-size: 13px;
        margin-left: 10px;
        font-weight: 600;
}
.course_container {
        display: -webkit-box;
        display: flex;
        -webkit-box-pack: space-evenly;
        justify-content: start;
        -webkit-box-align: center;
        align-items: center;
        flex-wrap: wrap;
        margin-bottom: 5px;
}

.course_container .box {
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        background-color: #fff;
        background-clip: border-box;
        border-radius: 0.5rem;
        border: 1px solid #dfe2e6;
        padding: 8px 15px;
        margin-right: 10px;
        height: 60px;
}

.course_container .box .bcTitle {
        font-size: 13px;
}

.course_container .box .subTitle {
        font-weight: 600;
        color: #0ca257;
}

.viewLink {
        font-size: 12px;
        float: right;
        text-decoration: underline;
        color: #08a256;
}

.viewLink:hover {
        color: #1ba25f;
}

.table_view_course {
        margin-top: 20px;
}
#types-tree {
        padding: 20px;
        height: calc(100vh - 280px);
        overflow: auto;
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        background-clip: border-box;
        border: 1px solid #dfe2e6;
        border-radius: 0.5rem;
        background-color: #fff;
}
.table_skill {
        height: calc(100vh - 280px);
        overflow: auto;
}

.table_skill table tr td:nth-last-child(1) {
        display: flex;
}
.course_container a .box .boxContent .title sub {
        color: #d8dbe1;
        font-size: 14px;
}

.chat-detail .chat-bottom {
        padding: 15px 30px;
        border-top: 1px solid rgba(0, 0, 0, 0.03);
        position: sticky;
        width: 100%;
        bottom: 0;
        z-index: 9;
        background: #d4d8de;
}
.chat-detail .chat-bottom .chat-messagebar input[type='text'] {
        background-color: transparent;
        color: #1e2f49;
        font-size: 16px;
        border: none;
        border-radius: 0;
}
/* .button:active .front {
                border-radius: 0;
                background-color: transparent;
                color: #191919;
            } */
/* .button:active .front::before {
/* .button:active .front::before {
                background-color: #D6D35D;
                transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
            }
            .button:active .front::after {
                left: 120%;
                transition: all 0.3s cubic-bezier(0.19, 1, 0.22, 1);
            } */

.minutes_data p sub {
        color: #414444;
}
.minutes_data p {
        font-size: 28px;
        color: #f28a3c;
        margin: 0;
}
.minutes_data {
        display: flex;
        justify-content: center;
        align-items: center;
        height: 66px;
        margin-bottom: 20px;
}
.chat-list {
        border: 1px solid #eee;
}

.chat_reply {
        display: inline-block;
        margin-right: 10px;
        background: #f3f6fa;
        padding: 1px 10px;
        border-radius: 10px;
        color: #414444;
}

.create_run {
        margin-bottom: 20px;
}

/* checkBox Card */

:root {
        --card-line-height: 1.2em;
        --card-padding: 1em;
        --card-radius: 0.5em;
        --color-green: #558309;
        --color-gray: #e2ebf6;
        --color-dark-gray: #c4d1e1;
        --radio-border-width: 2px;
        --radio-size: 1.5em;
}

.campaignCard {
        background-color: #fff;
        border-radius: var(--card-radius);
        position: relative;
}

.radio {
        font-size: inherit;
        margin: 0;
        position: absolute;
        right: calc(var(--card-padding) + var(--radio-border-width));
        top: calc(var(--card-padding) + var(--radio-border-width));
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
        .radio {
                appearance: none;
                -webkit-appearance: none;
                -moz-appearance: none;
                background: #fff;
                border: 2px solid #e2ebf6;
                border-radius: 50%;
                cursor: pointer;
                height: var(--radio-size);
                outline: none;
                transition:
                        background 0.2s ease-out,
                        border-color 0.2s ease-out;
                width: var(--radio-size);
        }
        .radio::after {
                border: var(--radio-border-width) solid #fff;
                border-top: 0;
                border-left: 0;
                content: '';
                display: block;
                height: 11px;
                left: 24%;
                position: absolute;
                top: 50%;
                transform: rotate(45deg) translate(-50%, -50%);
                width: 0.375rem;
        }
        .radio:checked {
                background: #558309;
                border-color: #558309;
        }

        .card:hover .radio {
                border-color: var(--color-dark-gray);
        }
        .card:hover .radio:checked {
                border-color: var(--color-green);
        }
}
.plan-details {
        min-height: 181px;
        border: 2px solid #e1e5ed;
        border-radius: 0.5em;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        padding: 1em;
        transition: border-color 0.2s ease-out;
}

.card:hover .plan-details {
        border-color: var(--color-dark-gray);
}

.radio:checked ~ .plan-details {
        border-color: #558320;
}

.radio:focus ~ .plan-details {
        box-shadow: 0 0 0 2px var(--color-dark-gray);
}

.radio:disabled ~ .plan-details {
        color: var(--color-dark-gray);
        cursor: default;
}

.radio:disabled ~ .plan-details .plan-type {
        color: var(--color-dark-gray);
}

.card:hover .radio:disabled ~ .plan-details {
        border-color: var(--color-gray);
        box-shadow: none;
}

.card:hover .radio:disabled {
        border-color: var(--color-gray);
}

.campaignCard h3 {
        font-size: 15px;
        color: #303840;
}
.campaignCard p {
        color: #696969;
        font-size: 13px;
        font-weight: 400;
        margin-bottom: 0px;
}

.plan-details img {
        width: 50px;
        padding-bottom: 15px;
}

.run_enrollment_section .plan-details .imngFlex {
        display: flex;
        align-items: center;
}

.run_enrollment_section .plan-details .imngFlex {
        margin-bottom: 10px !important;
}
.run_enrollment_section .plan-details .imngFlex img {
        width: 18px;
        padding-bottom: 0px;
}

.run_enrollment_section .campaignCard h3 {
        font-size: 14px !important;
        margin-bottom: 0px !important;
        font-weight: 700 !important;
        margin-left: 8px !important;
}

.run_enrollment_section .plan-details p {
        font-size: 12px !important;
        line-height: 18px !important;
}

.run_enrollment_section .plan-details {
        min-height: 160px !important;
}

/*  */

/* sfgbdgdfghdbg */

/*--------------------------
/*--------------------------
            Common
            ----------------------------*/

/* #main-wrapper{
                margin-top:-29px;
            } */
.headings {
        margin-bottom: 20px;
        font-size: 1.1rem;
        text-transform: uppercase;
}
#main-courses-wrapper {
        padding-top: 20px;
}

.back_link {
        position: absolute !important;
        right: 0 !important;
        color: #565656 !important;
        padding: 6px 10px;
        border: 1px solid #565656;
        transition: all 0.5s ease;
        text-decoration: none;
        border-radius: 4px;
}
.back_link:hover {
        background: #f28a3c;
        text-decoration: none;
        color: #fff !important;
        border: 1px solid #f28a3c;
}
#main-courses-wrapper .content-wrapper .card {
        margin-bottom: 10px;
}

#main-courses-wrapper .content-wrapper .card-body {
        padding: 15px 0px;
}

#main-courses-wrapper .content-wrapper .card-body .card-text p {
        font-size: 14px;
        color: #333232;
}
#main-courses-wrapper .content-wrapper .card-body .card-text .progress {
        height: 8px;
        margin-bottom: 14px;
}
#main-courses-wrapper .content-wrapper .card-body .card-text .btn-study {
        color: #fff;
        background: #125fa2;
        font-size: 14px;
        border: none;
}

#main-courses-wrapper .content-wrapper .card-body .card-text .btn-study:hover {
        box-shadow: 2px 8px 8px #898585;
        border: none;
}

/* ------------------------------------Sub Courses Css Starts----------------------------------------- */
#sub-course-wrapper .course-content-wrapper {
        padding-top: 25px;
}

#sub-course-wrapper .course-content-wrapper .course-card .card-wrapper {
        margin-bottom: 30px;
        transition: all 0.8s cubic-bezier(0.25, 0.8, 0.25, 1);
        display: inline-block;
        border: 1px solid #ececec;
        width: 100%;
        padding: 10px 10px 0px 10px;
}

#sub-course-wrapper .course-content-wrapper .course-card .card-wrapper img {
        height: 160px !important;
}

/* #sub-course-wrapper .course-content-wrapper .course-card .card-wrapper:hover{
/* #sub-course-wrapper .course-content-wrapper .course-card .card-wrapper:hover{
            text-decoration: none;
            box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.25);
            padding: 11px 10px 0px 11px;
            } */

#sub-course-wrapper
        .course-content-wrapper
        .course-card
        .card-wrapper
        .card-title {
        font-size: 15px;
        margin-top: 10px;
        line-height: 23px;
        margin-bottom: 0px;
}

#sub-course-wrapper
        .course-content-wrapper
        .course-card
        .card-wrapper
        .published {
        font-size: 13px;
        margin-top: 8px;
        color: #616161;
        margin-bottom: 6px;
}

#sub-course-wrapper
        .course-content-wrapper
        .course-card
        .card-wrapper
        .category {
        font-size: 13px;
        color: #3b6a95;
        margin-bottom: -4px;
        margin-top: 12px;
}

#sub-course-wrapper
        .course-content-wrapper
        .course-card
        .card-wrapper
        .cat-text {
        color: black;
}

/* ------------------------------------Sub Courses Css Ends----------------------------------------- */

/*--------------------------
            Footer
            ----------------------------*/

#footer {
        background: #f9f9f9;
        padding: 7px 0px 1px 0px;
        box-shadow: 0 5px 12px 0 rgba(0, 0, 0, 0.25);
        position: relative;
        z-index: 10000;
}

#footer .line-footer {
        height: 1.5px;
        width: 200px;
        margin: auto;
        background: #d0d0d0;
        margin-top: 8px;
}

#footer .copyright {
        text-align: center;
        margin-top: 12px;
        color: #737373;
        font-size: 14px;
}

#footer .list-group-horizontal {
        -ms-flex-direction: row;
        flex-direction: row;
        margin: auto;
}

#footer .list-group-item {
        position: relative;
        display: block;
        padding: 0.75rem 1.25rem;
        background: transparent;
        border: none;
        margin: auto;
        font-size: 14px;
        color: #3b6a95;
}

#quiz-modal .resultWrap .numpara {
        background: #dde1e4;
        color: #fff;
        height: 75px;
        border-radius: 51px;
        width: 75px;
        /* display: flex; */
        /* align-items: center; */
        text-align: center;
        font-size: 18px;
        padding: 24px 0px;
        margin: 0px 10px;
}
#quiz-modal .resultWrap h5 {
        height: 40px;
        text-align: center;
}
#quiz-modal .score {
        font-size: 21px;
        color: #0e9a35;
}
.switch_css {
        display: none;
}
.profilename:hover .switch_css {
        display: inline-flex;
}

.course_list_learner {
        display: block;
        border: 1px solid #eaeaea;
        transition: all 0.5s ease;
        position: relative;
}

.new_course p {
        margin: 0;
        color: #fff;
        font-size: 11px;
}
.new_course {
        position: absolute;
        z-index: 1;
        border: 1px solid #414444;
        background: #414444;
        top: 10px;
        left: 0;
        padding: 0px 8px;
        text-align: center;
        border-radius: 0px 5px 5px 0px;
}

.ourworks-box {
        width: 60%;
        justify-content: center;
        text-align: center;
}

.our-works-head {
        font-size: 30px;
        font-weight: 400;
        color: black;
}
.introduce {
        height: 250px;
        background-color: white;
        box-shadow: 0 3px 10px #5969f642;
        border-bottom: 4px solid #5969f6;
        color: black;
}

.introduce:hover {
        box-shadow: 0 3px 15px #5969f666;
        border-bottom: 4px solid #b122e5;
        color: black;
        text-decoration: none;
}
.flex-column-1 {
        height: 70%;
        width: 100%;
}
.flex-column-2 {
        height: 30%;
        width: 100%;
        align-items: center;
}
.text-gray {
        color: gray;
}
.pic {
        height: 70px;
        width: 70px;
        margin-left: 20px;
        border-radius: 50%;
        transition: all 0.2s ease-in-out;
}

.introduce:hover .pic {
        transform: scale(1.1);
}
.carousel-indicators .active {
        background-color: #46eeaa;
}
.carousel-indicators li {
        background-color: #c8e5ff;
}
.carousel-indicators {
        bottom: -50px;
}
.p1 {
        background-image: url('http://lorempixel.com/150/150/nature');
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
}
.p2 {
        background-image: url('http://lorempixel.com/150/150/people');
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
}
.p3 {
        background-image: url('http://lorempixel.com/150/150/cats');
        background-position: center;
        background-repeat: no-repeat;
        background-size: contain;
}

.circle-1 .carousel-control-prev {
        right: 42px;
        left: unset;
        height: 0;
        top: -31px;
        opacity: 1;
        color: #000;
        background: #f3f6fa;
        padding: 16px 20px;
        width: 20px;
        z-index: 1;
}

.circle-1 .carousel-control-next {
        right: 0px;
        /* left: 0; */
        height: 0;
        top: -31px;
        opacity: 1;
        color: #000;
        background: #f3f6fa;
        padding: 16px 20px;
        width: 20px;
        z-index: 1;
}

.run_compaign_ui .run_comp {
        text-align: center;
        background: #f6f6f6;
        padding: 10px;
        border-radius: 15px;
}

.run_compaign_ui .campTitle {
        font-size: 14px;
        margin-top: 10px;
        text-align: center;
        font-weight: 700;
}

.campGrey {
        padding: 4px 6px;
        font-size: 9px;
        border-radius: 5px;
        background-color: #f4f6f9;
        color: #838383;
        border: 1px solid #d0d0d0;
        margin-left: 10px;
        display: inline;
}

.ul_drop {
        display: inline-block;
}

.auth-box .auth-box-right .card .form-group label {
        float: left;
}

.back_btn a {
        padding: 7px 18px;
        background: #eaeaea;
        color: #000;
}
.verify_page h6 {
        color: #495057;
        margin: 15px 0px 6px;
        font-size: 18px;
}
.verify_page p {
        color: #666;
        margin-bottom: 0;
}
.verify_page h5 {
        font-size: 20px;
}
.verify_page {
        background: #ffffff;
        color: #fff;
        padding: 25px 25px;
        text-align: center;
        max-width: 400px;
        margin: auto;
        box-shadow: 0 0.75rem 1.5rem rgba(18, 38, 63, 0.03);
        border-radius: 6px;
}

.img_lo img {
        width: 100%;
}

.img_lo {
        text-align: center;
        max-width: 135px;
        margin: 20px auto 40px;
}
.active_btn {
        background: #0e2954;
        border: 1px solid #0e2954;
        color: #fff;
}
#iam-header {
        background: #f1f1f1;
        margin-bottom: 20px;
        border-radius: 5px;
}

#iam-header .navbar .nav-item {
        border-right: 2px solid #f17f3a;
}

#iam-header .navbar .nav-item:nth-last-child(1) {
        border-right: none;
}

#iam-header .navbar-dark .navbar-nav .nav-link {
        color: #f17f3a;
}

#iam-header .navbar-dark .navbar-brand {
        color: #f17f3a;
}

.icon_det {
        cursor: pointer;
}

.loader-wrap {
        width: 100%;
        height: 100vh;
        display: flex;
        align-items: center;
        text-align: center;
        background: #0000008a;
        position: fixed;
        z-index: 10000;
        pointer-events: auto;
}

.loader-wrap .mid {
        margin: auto;
}

.loader-wrap i {
        color: gainsboro;
        font-size: 74px;
        margin-bottom: 10px;
}

#ellipsis-loader-wrapper {
        margin: 0.5rem 0rem 2rem;
        display: flex;
        justify-content: center;
        padding-bottom: 1rem;
}

.ellipsis-loader {
        /* the colors */
        --c1: #f77825;
        --c2: #d3ce3d;
        --c3: #60b99a;
        --c4: #554236;
        /**/

        width: 80px; /* control the size */
        aspect-ratio: 8/5;
        --_g: no-repeat radial-gradient(#000 68%, #0000 71%);
        mask: var(--_g), var(--_g), var(--_g);
        mask-size: 25% 40%;
        -webkit-mask: var(--_g), var(--_g), var(--_g);
        -webkit-mask-size: 25% 40%;
        background:
                conic-gradient(var(--c1) 50%, var(--c2) 0) no-repeat,
                conic-gradient(var(--c3) 50%, var(--c4) 0) no-repeat;
        background-size: 200% 50%;
        animation:
                ellipsis-back 3s infinite steps(1),
                ellipsis-load 1.5s infinite linear;
}

@keyframes ellipsis-load {
        0% {
                -webkit-mask-position:
                        0% 0%,
                        50% 0%,
                        100% 0%;
        }
        12.5% {
                -webkit-mask-position:
                        0% 50%,
                        50% 0%,
                        100% 0%;
        }
        25% {
                -webkit-mask-position:
                        0% 100%,
                        50% 50%,
                        100% 0%;
        }
        37.5% {
                -webkit-mask-position:
                        0% 100%,
                        50% 100%,
                        100% 50%;
        }
        50% {
                -webkit-mask-position:
                        0% 100%,
                        50% 100%,
                        100% 100%;
        }
        62.5% {
                -webkit-mask-position:
                        0% 50%,
                        50% 100%,
                        100% 100%;
        }
        75% {
                -webkit-mask-position:
                        0% 0%,
                        50% 50%,
                        100% 100%;
        }
        87.5% {
                -webkit-mask-position:
                        0% 0%,
                        50% 0%,
                        100% 50%;
        }
        100% {
                -webkit-mask-position:
                        0% 0%,
                        50% 0%,
                        100% 0%;
        }
}
@keyframes ellipsis-back {
        0%,
        100% {
                background-position:
                        0% 0%,
                        0% 100%;
        }
        25% {
                background-position:
                        100% 0%,
                        0% 100%;
        }
        50% {
                background-position:
                        100% 0%,
                        100% 100%;
        }
        75% {
                background-position:
                        0% 0%,
                        100% 100%;
        }
}

/* Safari */
@-webkit-keyframes spin {
        0% {
                -webkit-transform: rotate(0deg);
        }

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

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

        100% {
                transform: rotate(360deg);
        }
}

/* setting view css here */

.setting_lms {
        display: block;
        text-align: center;
        padding: 20px 10px;
        box-shadow: 0px 2px 9px rgba(110, 110, 110, 0.18);
        border-radius: 5px;
        background-color: #fff;
}
.setting_lms h5 {
        margin-top: 10px;
        margin-bottom: 0px;
        font-size: 14px;
}
.setting_lms img {
        filter: invert(0.6) sepia(1) saturate(1) hue-rotate(185deg);
        width: 50px;
}

.email_list_table table p {
        margin: 0;
        font-size: 12px;
}

.email_list_table .table tr td {
        padding: 15px 20px;
}

.email_list_table .table tr {
        cursor: pointer;
}
.email_list_table .table tr:hover {
        background: #f8f8f8;
}

/*
            *
            * ==========================================
            * CUSTOM UTIL CLASSES
            * ==========================================
            *
            */

.new_result_comp .progress {
        width: 200px;
        height: 200px;
        background: none;
        position: relative;
}

.new_result_comp .progress::after {
        content: '';
        width: 100%;
        height: 100%;
        border-radius: 50%;
        border: 15px solid #eee;
        position: absolute;
        top: 0;
        left: 0;
}

.new_result_comp .progress > span {
        width: 50%;
        height: 100%;
        overflow: hidden;
        position: absolute;
        top: 0;
        z-index: 1;
}

.new_result_comp .progress .progress-left {
        left: 0;
}

.new_result_comp .progress .progress-bar {
        width: 100%;
        height: 100%;
        background: none;
        border-width: 15px;
        border-style: solid;
        position: absolute;
        top: 0;
}

.new_result_comp .progress .progress-left .progress-bar {
        left: 100%;
        border-top-right-radius: 109px;
        border-bottom-right-radius: 109px;
        border-left: 0;
        -webkit-transform-origin: center left;
        transform-origin: center left;
}

.new_result_comp .progress .progress-right {
        right: 0;
}

.new_result_comp .progress .progress-right .progress-bar {
        left: -100%;
        border-top-left-radius: 107px;
        border-bottom-left-radius: 107px;
        border-right: 0;
        -webkit-transform-origin: center right;
        transform-origin: center right;
}

.new_result_comp .progress .progress-value {
        position: absolute;
        top: 0;
        left: 0;
}
.nav-header {
        background: #f3f6fa;
        height: 50px;
        padding: 10px 10px;
}
.center_btn {
        text-align: center;
}
.timer_sty {
        color: #0e2954;
        font-weight: bold;
        font-size: 16px;
        text-align: center;
        margin: 0;
}
.quiz_sec {
        border: 1px solid #0e2954;
        padding: 10px 20px;
        text-align: center;
        border-radius: 4px;
        width: 300px;
}

.quiz_sec p {
        margin: 0;
}
.quiz_de {
        display: flex;
        justify-content: space-between;
        align-items: center;
        /* margin-bottom: 30px; */
        margin: 20px 0px;
}
.acrr_btn {
        margin: 0;
}
.accordion .acrr_btn:not(.collapsed):after {
        font-family: 'FontAwesome';
        content: '\f077' !important;
        float: right;
}
.accordion .acrr_btn.collapsed:after {
        /* symbol for "collapsed" panels */
        content: '\f078';
        font-family: 'FontAwesome';
        float: right;
}

.quiz_Main button span {
        margin: 0px 6px;
}

.quiz_Main button {
        position: relative;
}

.video_pdf {
        display: flex;
}
/* #img-2 {
                width: 100px;
            } */
.video_pdf img {
        object-fit: cover;
        max-height: 60px;
}
.img_video {
        margin-right: 15px;
}
.new_border {
        border-top: 1px solid #ced4da;
        padding: 20px 0px;
        margin-top: 13px;
}
/*
            *
            * ==========================================
            * FOR DEMO PURPOSE
            * ==========================================
            *
            */
.pageNo i {
        margin: 0;
}
.grid_sty.img_show img {
        max-height: 120px;
}

.toast-box {
        position: fixed;
        bottom: 55px;
        right: 0;
        z-index: 9999;
        display: none;
}
.video_desc button i {
        margin-right: 5px !important;
}
#h2 {
        max-width: 200px;
        width: 100%;
        height: auto;
        object-fit: cover;
}
#h2 img {
        width: 100%;
        height: auto;
}

#section-holder .btn-outline-primary.disabled,
.btn-outline-primary:disabled {
        color: #fff;
        background-color: #00428a;
}

.rounded-lg {
        border-radius: 1rem;
}

.text-gray {
        color: #aaa;
}

div.h4 {
        line-height: 1rem;
}
.irs-line {
        height: 8px;
        top: 25px;
        border-radius: 15px;
        background: #f3f6fa;
}
.pointer_set .date_after:before {
        content: '';
        position: absolute;
        width: 20px;
        height: 20px;
        background: #f28a3c;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        z-index: 9;
        border-radius: 100%;
}
.pointer_set .date_after:after {
        content: '';
        position: absolute;
        width: 20px;
        height: 20px;
        background: #f28a3c;
        top: 50%;
        right: 0;
        transform: translateY(-50%);
        z-index: 9;
        border-radius: 100%;
}
.pointer_set {
        position: relative;
}

#body-overlay {
        width: 100vw;
        height: 100vh;
        display: none;
        position: fixed;
        z-index: 3;
        top: 0;
        left: 0;
        overflow: hidden;
        background: rgba(0, 0, 0, 0.5);
}

/* .user_mangement table tr {
/* .user_mangement table tr {
                cursor: pointer;
            } */

.real-menu {
        position: fixed;
        top: 0;
        right: -900px;
        z-index: 4;
        width: 520px;
        height: 100%;
        padding: 0.5rem 1rem;
        box-shadow: 0 6px 12px rgba(107, 82, 82, 0.3);
        background-color: white;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        transition: ease 0.2s all;
}

body.menu-open #body-overlay {
        display: block;
}
body.menu-open .real-menu {
        right: 0;
}

.real-menu #types-tree {
        background: unset;
        color: #f17f3a;
        padding: 20px 20px;
        box-shadow: unset;
}

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

.sidepanel {
        width: 0;
        position: fixed;
        z-index: 1;
        height: 75vh;
        bottom: 0px;
        /* top: 199px; */
        right: 20px;
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        background-clip: border-box;
        border-radius: 0.5rem;
        background-color: #fff;
        overflow-x: auto;
        transition: 0.5s;
        padding-top: 0px;
        z-index: 2;
}

.new_sup {
        color: #000000;
        background: #ffd596;
        padding: 1px 4px;
        border-radius: 5px;
        margin-left: 1px;
        font-size: 10px;
        font-weight: 600;
}

.courseSettingmodal {
        padding: 0px !important;
}

.courseSettingmodal .logsInfo {
        margin: 10px;
}

.tableHeightfix {
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        background-clip: border-box;
        border: 1px solid #dfe2e6;
        border-radius: 0.5rem;
        background-color: #fff;
        height: 56vh;
}

.sidepanel .slideContent {
        padding: 15px;
        overflow-y: auto;
}

.sidepanel
        .slideContent
        .basicInfo
        .list-group:nth-last-child(1)
        > .list-group-item {
        border-bottom: 1px solid rgba(0, 0, 0, 0.125);
}

.sidepanel .slideContent .list-group-item {
        padding: 2px 10px;
        border-radius: 0;
        border-bottom: 0;
}

.sidepanel .slideContent .list-group-item ul {
        padding-left: 12px;
        margin: 5px 0px;
        line-height: 22px;
}

.sidepanel .slideContent .tbCrHeading {
        padding: 8px 15px;
        color: #000;
        margin-bottom: 0;
}

.sidepanel .slideContent .form-label,
.sidepanel .slideContent .col-sm-7 {
        font-size: 12px;
}

.sidepanel .slideContent .col-sm-7 {
        font-size: 13px;
}

.sidepanel .slideContent .page-separator__text {
        background-color: #fff;
}

.sidepanel .slideContent .page-separator__text-integration {
        background-color: #fff;
}

.sidepanel .closebtn {
        position: absolute;
        top: -9px;
        right: 12px;
        font-size: 28px;
        cursor: pointer;
}
.sidepanel a {
        padding: 8px 8px 8px 32px;
        text-decoration: none;
        font-size: 25px;
        color: #818181;
        display: block;
        transition: 0.3s;
}
.new_result_comp i {
        margin: 0;
}

#mySidepanel {
        text-align: left;
        box-shadow: rgba(0, 0, 0, 0.15) -2.4px -2.4px 3.2px;
}

.campaign_name_info {
        /* border: 1px solid #f1f1f1; */
        padding: 10px 10px;
        border-bottom: 2px solid #92b4d4;
}

.back_btn_ev i {
        margin: 0;
}

.settingSidepanel {
        text-align: left !important;
        box-shadow: 1px 0px 15px 0px #afafaf !important;
        /* border: 1px solid #e7e7e7 !important; */
}

.setHeightWrapper {
        height: calc(100% - 100px);
        overflow: auto;
}

/* quiz section start here */

.instructions_lines ul {
        padding: 0;
}
.instructions_lines li:before {
        content: '';
        position: absolute;
        width: 6px;
        height: 6px;
        background: #0e2954;
        left: 0;
        vertical-align: middle;
        border-radius: 100%;
        top: 50%;
        transform: translateY(-50%);
}
.tab_sty {
        padding: 20px 0px;
}
.user_setting {
        border-bottom: 2px solid #ececeb;
        margin-top: 30px;
}
.settings_list .tab-content {
        border: 1px solid #ececeb;
        padding: 20px 0px;
}
.settings_list .nav-tabs {
        margin: 0;
}
.heading_quiz h5 i {
        margin-right: 5px !important;
}
.instructions_lines li {
        list-style: none;
        position: relative;
        padding-left: 20px;
        margin-bottom: 15px;
}

.quiz_desc ul {
        padding: 0;
}
.quiz_desc li:before {
        content: '';
        position: absolute;
        width: 10px;
        height: 10px;
        background: #eaeaea;
        left: 0;
        vertical-align: middle;
        border-radius: 100%;
        top: 50%;
        transform: translateY(-50%);
}
.quiz_desc li {
        list-style: none;
        position: relative;
        padding-left: 20px;
        margin-bottom: 15px;
}

.quiz_desc {
        border: 1px solid #eaeaea;
        padding: 20px 20px;
        border-radius: 6px;
        box-shadow: 0 8px 6px -6px #eaeaea;
}
.quiz_desc span {
        color: #f17f3a;
}
.heading_quiz {
        border-bottom: 1px dashed #0e2954;
        margin-bottom: 15px;
}

.header {
        padding: 15px;
        position: fixed;
        top: 0;
        width: 100%;
        z-index: 9999;
}
.left-title {
        width: 80px;
        color: #fff;
        font-size: 18px;
        float: left;
}
.right-title {
        width: 150px;
        text-align: right;
        float: right;
        color: #fff;
}
.option-block-container {
        margin-top: 20px;
}
.option-block {
        background: #f3f6fa;
        border: 1px solid #f3f6fa;
        margin-bottom: 10px;
        cursor: pointer;
        position: relative;
        width: 100%;
        padding-left: 0px;
}
.result-question {
        font-weight: bold;
}
.c-wrong {
        margin-left: 20px;
        color: #ff0000;
}
.c-correct {
        margin-left: 20px;
        color: green;
}
.last-row {
        border-bottom: 1px solid #ccc;
        padding-bottom: 25px;
        margin-bottom: 25px;
}
.res-header {
        border-bottom: 1px solid #ccc;
        margin-bottom: 15px;
        padding-bottom: 15px;
}

.question_numer ul {
        padding: 0;
        margin: 0;
}

.testResult .modal-dialog.modal-lg {
        max-width: 800px;
}
.testResult .modal-footer {
        justify-content: space-around;
}

.testResult .modal-content {
        max-width: 1000px !important;
        width: 100%;
}

.butn_set {
        width: 100%;
        border-top: 1px solid #ddd;
        margin-top: 14px;
        padding: 20px 0px;
}

.next_btn {
        text-align: right;
}
.modal_resend ul {
        padding: 0;
}

.modal_resend ul li {
        list-style: none;
        margin-bottom: 10px;
}
.quiz_wrp_all {
        padding: 0px 20px;
}
.quiz_overview {
        overflow-x: hidden;
}

.info_quiz h5 {
        font-size: 26px;
        padding-bottom: 15px;
        margin: 0;
}

.info_quiz h5 span {
        color: #f17f3a;
}
.info_quiz h6 {
        font-size: 21px;
}
.info_quiz h6 span {
        color: #f17f3a;
        font-weight: 600;
}
.info_quiz p {
        font-size: 20px;
        padding: 7px 0px;
        margin: 0;
}
.quiz_result_per p {
        color: #f17f3a;
        font-size: 17px;
        margin: 0;
        padding: 10px 0px 10px;
        border-bottom: 1px dashed #263a5b;
        font-weight: 600;
}
.info_quiz img {
        padding-bottom: 20px;
}
.form-head {
        position: absolute;
        top: 30px;
        text-align: center;
        left: 50%;
        transform: translateX(-50%);
}
.quiz_img_re {
        background: #263a5b;
        padding: 20px 20px;
}
.quiz_result_per {
        border: 1px solid #263a5b;
        width: 200px;
        border-radius: 6px;
}

.quiz_result_per h5 {
        color: #263a5b;
        font-weight: 600;
        margin: 0;
        padding: 11px 0px;
}
.quiz_wrap h5 {
        text-align: center;
        font-weight: 600;
        margin-bottom: 30px;
}
.quiz_result_per {
        border: 1px solid #263a5b;
        width: 200px;
        border-radius: 6px;
}
.action_per {
        display: flex;
}

.quiz_performance {
        display: flex;
        justify-content: space-around;
        align-items: center;
        padding: 20px 20px;
        max-width: 1200px;
        margin: auto;
}

.main-content {
        width: 100%;
}
.tooltip {
        pointer-events: none !important;
}
.result_per {
        display: block;
        justify-content: center;
        align-items: center;
        width: 100%;
}
.grey:before {
        position: absolute;
        content: '';
        background: #f17f3a;
        width: 10px;
        height: 10px;
        left: 0;
        top: 50%;
        vertical-align: middle;
        transform: translateY(-50%);
        border-radius: 100%;
}
.green:before {
        position: absolute;
        content: '';
        background: #15bb5f;
        width: 10px;
        height: 10px;
        left: 0;
        top: 50%;
        vertical-align: middle;
        transform: translateY(-50%);
        border-radius: 100%;
}

.li-sty {
        padding: 0 20px;
        position: relative;
}
.main-content .form-head img {
        max-width: 200px;
        margin-bottom: 20px;
}
.main-content i {
        font-size: 50px;
        color: rgb(11, 185, 11);
}

.quiz_result {
        background: #f3f6fa;
        padding: 20px 30px;
        border-radius: 6px;
}

label.form-check-label span {
        margin-right: 10px;
}

.add_quiz {
        border: 1px solid #ccc;
        padding: 10px 10px;
        border-radius: 4px;
        margin: 20px 0px;
}

.answ_icon {
        position: absolute;
        right: 0;
        top: 50%;
        transform: translateY(-50%);
        color: red;
}

.accordion {
        margin-bottom: 20px;
}

.nav-header {
        background: #f3f6fa;
        height: 50px;
        padding: 10px 10px;
        margin-bottom: 20px;
}
.quiz_overview label {
        display: block;
        cursor: pointer;
        padding: 10px 0px 10px 30px;
}

.quiz-body {
        background: #f3f6fa;
        padding: 20px 30px;
        max-height: 700px;
        overflow: auto;
}

.quiz_wrap {
        position: relative;
}

.question_numer {
        max-height: 600px;
        overflow: auto;
        padding: 10px 0px;
        position: relative;
}
.question_numer::-webkit-scrollbar-track {
        -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
        background-color: #f5f5f5;
        border-radius: 10px;
}

.show_qui {
        position: relative;
}

.question_numer::-webkit-scrollbar {
        width: 10px;
        background-color: #f5f5f5;
}

.question_numer::-webkit-scrollbar-thumb {
        border-radius: 10px;
        background-color: #ccc;
}

.test_actions {
        border-top: 1px solid #ddd;
        padding: 20px 20px;
        font-size: 12.5px;
        background: #f5f8fa;
}

.test_q_list_item .icon.answered,
.test_icons.answered {
        background: #55bbea;
        background: #5cb85c;
        border: 1px solid transparent;
        color: #fff;
}
.test_q_list_item .icon.skipped,
.test_icons.skipped {
        background: #d9534f;
        border: 1px solid transparent;
        color: #fff;
}
.test_q_list_item .icon.marked,
.test_icons.marked {
        background: #9b59b6;
        border: 1px solid transparent;
        color: #fff;
}
.test_icons {
        padding-top: 2px;
        width: 30px;
        height: 30px;
        border-radius: 50%;
        text-align: center;
        font-weight: bold;
        font-size: 12px;
        border: 1px solid transparent;
        background: #eee;
        border: 1px solid #eee;
        display: inline-block;
        /* float: left; */
        margin-right: 10px;
        margin-bottom: 10px;
        cursor: pointer;
}

.test_q_list_item.active .icon,
.test_q_list_item.active .icon:hover,
.test_question_btns .test_icons.active,
.test_question_btns .test_icons:hover {
        box-shadow: 0px 0px 5px 1px #31b0d5;
}

.test_question_btns .test_icons {
        margin-left: 14px;
        margin-right: 14px;
        margin-bottom: 12px;
}
.test_icons.lg {
        width: 32px;
        height: 32px;
        padding-top: 6px;
}

.test_q_list_item .icon.skipped,
.test_icons.skipped {
        background: #d9534f;
        border: 1px solid transparent;
        color: #fff;
}
.option-block:hover {
        background: #f1f1f1;
}

.box-content h5 a {
        color: #0e2954;
        font-weight: 700;
}

.box-content h5 a {
        color: #0e2954;
}
.strip p {
        margin: 0;
        color: #fff;
        font-weight: 600;
}

.strip.draft {
        background: #a0a0a0;
}

.strip.danger {
        background: #d9534f;
}

.strip {
        position: absolute;
        width: 110px;
        top: 0;
        left: 0px;
        text-align: center;
        background: #8bc34a;
        padding: 3px 0px;
        border-radius: 0px 30px 0px 30px;
        box-shadow: 0 8px 6px -6px black;
}
.photo img {
        width: 100%;
        max-height: 200px;
        object-fit: cover;
}
.description ul li {
        list-style: none;
        margin-bottom: 10px;
}
.description ul {
        margin: 0;
        padding: 0;
}
.quiz_box {
        display: block;
        align-items: center;
        border: 1px solid #f1f1f1;
        position: relative;
        margin-bottom: 20px;
}

.box-wrapper {
        background-color: #fff;
        overflow: hidden;
        padding: 0;
        position: relative;
        border: 1px solid #f1f1f1;
        margin-bottom: 20px;
        border-radius: 6px;
}

.box-wrapper img {
        max-width: 100%;
        height: 250px;
        object-fit: cover;
        width: 100%;
}

.box-content {
        position: relative;
        z-index: 1;
        padding: 10px 15px;
        font-size: 13px;
        line-height: 12px;
}
.box-content:before {
        content: '';
        width: 200%;
        height: 100px;
        position: absolute;
        display: block;
        background-color: #fff;
        -webkit-transform: rotate(-8deg);
        transform: rotate(-8deg);
        top: -50px;
        left: -10%;
        z-index: -1;
}

/**************************
/**************************
            quiz end
            ************************/

/**************************
            Customer Support Left Bar
            ************************/

.customer-support-wrapper {
        background: #0000001f;
        position: absolute;
        bottom: 0;
        width: 191px;
        text-align: center;
        padding: 20px;
        padding-bottom: 0px;
        margin: 20px 28px;
        border-radius: 15px;
}
.yes_con {
        text-align: center;
        padding: 20px 0px;
}

.yes_con p {
        font-size: 18px;
        line-height: 25px;
}
.customer-support-wrapper .btn-warning {
        font-size: 12px !important;
        padding: 4px 11px;
        margin-bottom: 10px;
        background: #f28a3c;
        border: none;
}

.customer-support-wrapper h5 {
        color: #fff;
}

.customer-support-wrapper p {
        color: #a5a9ad;
        display: block;
        font-size: 13px;
        line-height: 15px;
        margin-bottom: 15px;
}

.customer-support-wrapper img {
        width: 70px;
}

.img_set_asses {
        height: 120px;
        object-fit: contain;
        margin-top: 12px;
        width: 100%;
}

.img-list {
        text-align: center;
}
.img-list li {
        width: 250px;
        display: inline-block;
        list-style-type: none;
}
.img-list li img {
        width: 100%;
}

.mask {
        display: none;
        position: fixed;
        top: 0;
        width: 100%;
        height: 100%;
        background: rgba(0, 0, 0, 0.8);
        z-index: 2;
        left: 0;
}

.img-wrap {
        pointer-events: none;
}

.img-wrap a img {
        width: 400px;
        pointer-events: auto;
}
.mask .img-box {
        width: 100%;
        max-width: 650px;
        padding: 10px;
        background: #fff;
        position: relative;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
}
.mask .img-box img {
        width: 100%;
}
.mask .img-box .close {
        color: #000;
        background: rgba(255, 255, 255, 0.8);
        width: 30px;
        height: 30px;
        text-align: center;
        line-height: 30px;
        position: absolute;
        top: -35px;
        right: -35px;
        font-size: 24px;
        font-weight: bold;
        border-radius: 50%;
        cursor: pointer;
}
.mask .img-box .close:hover {
        background: white;
}

.is-visible {
        display: block !important;
}

.fadein {
        animation: fadein 400ms ease-in-out;
}

@keyframes fadein {
        from {
                opacity: 0;
        }
        to {
                opacity: 1;
        }
}
.fadeout {
        animation: fadeout 400ms ease-in-out;
}

@keyframes fadeout {
        from {
                opacity: 1;
        }
        to {
                opacity: 0;
        }
}

.pro_lo {
        border: 1px solid #dadce0;
        border-radius: 10px;
        background: #fbfbfb;
        display: block;
        padding: 5px;
}
.log_img {
        margin-right: 5px;
}
.ver_log {
        vertical-align: middle;
}

.side-box {
        display: flex;
        align-items: center;
}

.com_logo {
        max-height: 100px;
        width: 200px;
        object-fit: contain;
        margin-bottom: 40px;
        /* margin-top: -50px; */
}


.announcement_main_logo {
        width: 145px;
        object-fit: cover;
}
.announcement_logo {
        height: auto;
        width: 560px;
        margin: 20px 0px;
        object-fit: cover;
}
.side-icon {
        max-height: 48px;
        width: 134px;
}
.logoImage {
        max-height: 30px;
        width: 85px;
        vertical-align: middle;
        object-fit: contain;
        text-align: center;
}
.client_logo {
        background: blue;
        color: white;
        border-radius: 50%;
        font-size: 23px;
        width: 32px;
        text-align: center;
        height: 32px;
        margin-top: 0px;
        display: block;
}

/*Right*/
.modal.right.fade .modal-dialog {
        right: -320px;
        -webkit-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        -moz-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        -o-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog {
        right: 0;
}

/* ----- MODAL STYLE ----- */
/* ----- MODAL STYLE ----- */

/* .reminderModal .modal-dialog{
/* .reminderModal .modal-dialog{
                margin-top: 100px;
            } */

.reminderModal {
        background: #0000006e;
}

.textMuted {
        font-size: 11px;
        color: #828282;
        margin-bottom: 0;
}

.course_setting .btn {
        margin: 2px;
}
.datepickers-container {
        z-index: 9999;
}

#remainderModal .modal-header {
        display: block;
}

.modal_resend ul {
        margin: 0;
        padding: 0;
}

.modal_resend ul li {
        list-style: none;
        padding-bottom: 10px;
}

.lms-quick-wrapper .btn-wraps .btn {
        font-size: 12.5px;
}
#accordian h3 a span {
        background: #0e2954;
        padding: 0px 8px;
        border-radius: 30px;
        color: #ffffff;
        position: relative;
        margin-left: 3px;
        display: inline-block;
        margin-top: 3px;
        margin-bottom: 3px;
        font-size: 12px;
        line-height: 23px;
}

.anchor-card {
        display: block;
        text-align: center;
        border: 1px dashed #373a4d;
        padding: 25px 0px;
        /* background: #373a4d; */
        border-radius: 4px;
        box-shadow: 0px 0px 1px 0px #92b4d4;
}
#accordian h3 a span i {
        margin: 0 !important;
        margin-left: 4px !important;
}

.anchor-card i {
        font-size: 31px;
}

.new_load {
        position: absolute;
        left: 50%;
        top: 50%;
}
#sidebar_menu .real-menu {
        position: fixed;
        top: 0px;
        right: -900px;
        z-index: 4;
        width: 900px;
        height: 100%;
        padding: 0;
        box-shadow: 0 6px 12px rgba(107, 82, 82, 0.3);
        background-color: white;
        -webkit-box-sizing: border-box;
        -moz-box-sizing: border-box;
        box-sizing: border-box;
        transition: ease 0.2s all;
}

body.menu-open #body-overlay {
        display: block;
}
body.menu-open #sidebar_menu .real-menu {
        right: 0;
}

#sidebar_menu .real-menu #types-tree {
        background: unset;
        color: #f17f3a;
        padding: 20px 20px;
        box-shadow: unset;
        height: calc(100vh - 60px);
        overflow: auto;
}
/* 
            .card-header:first-child {

                background: #373a4d;
            } */

/* modal right sidebar */
.modal.left .modal-dialog,
.modal.right .modal-dialog {
        position: fixed;
        margin: auto;
        width: 800px;
        height: 100%;
        -webkit-transform: translate3d(0%, 0, 0);
        -ms-transform: translate3d(0%, 0, 0);
        -o-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
}

.modal.left .modal-content,
.modal.right .modal-content {
        height: 100%;
        overflow-y: auto;
        display: block;
        width: 100%;
}

.side-modal-header {
        display: block;
        border: none;
}
.modal-header {
        border-bottom-color: #fff;
        background-color: #fff;
        border-bottom: 1px solid #e1e5ee;
        padding: 10px 15px;
}

.custom-file {
        position: relative;
        display: block;
        width: 100%;
        height: auto;
        margin-bottom: 0;
}

/*Right*/
.modal.right.fade .modal-dialog {
        right: -800px;
        -webkit-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        -moz-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        -o-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
}

.modal.right.fade.show .modal-dialog {
        right: 0;
}

#modalReminderList {
        width: 86.5% !important;
}
/* modal right sidebar */

/*Filters sidebar */
.sidebarSm {
        width: 300px !important;
}

.sidebarSm .modal-body {
        padding: 0px 15px 80px !important;
}

.ResetIcon {
        padding: 10px 15px;
        margin-bottom: 12px;
}

.ResetIcon a {
        font-size: 12px;
        text-decoration: none;
        cursor: pointer !important;
}

.dropdownReminder {
        padding: 0px 40px 0px 0px;
        justify-content: flex-start;
        align-items: center;
        display: flex;
}

.dropdownReminder .form-group {
        margin-right: 20px !important;
}

.newReminderAddBtn {
        padding: 0px 40px 0px 0px;
        justify-content: flex-end;
        align-items: center;
        display: flex;
}
.BtnReset {
        margin-right: 20px !important;
}
.filterIcon {
        margin-right: 20px !important;
}
.refreshIcon {
        color: #000 !important;
        font-size: 20px !important ;
}
.GotoPageRowBox {
        display: flex !important;
        justify-content: center !important;
        align-items: center !important;
}

.blue-btn:hover,
.blue-btn:active,
.blue-btn:focus,
.blue-btn {
        background: transparent;
        border: solid 1px #27a9e0;
        border-radius: 3px;
        color: #27a9e0;
        font-size: 16px;
        margin-bottom: 20px;
        outline: none !important;
        padding: 10px 20px;
}

.fileUpload {
        position: relative;
        overflow: hidden;
        height: 43px;
        margin-top: 0;
}

.fileUpload input.uploadlogo {
        position: absolute;
        top: 0;
        right: 0;
        margin: 0;
        padding: 0;
        font-size: 20px;
        cursor: pointer;
        opacity: 0;
        filter: alpha(opacity=0);
        width: 100%;
        height: 42px;
}

/*Chrome fix*/
input::-webkit-file-upload-button {
        cursor: pointer !important;
        height: 42px;
        width: 100%;
}

.skill_create {
        padding: 6px 14px;
}
.heading_modal {
        background: #373a4d;
        padding: 15px 10px;
        margin-bottom: 18px;
        position: relative;
}

/* .body_css{
/* .body_css{
                display: block
            } */
/* body.menu-open #sidebar_menu .real-menu.close_css {
/* body.menu-open #sidebar_menu .real-menu.close_css {
                right: -990px;
            }

            body.menu-open #sidebar_menu .real-menu.add_css {
                right: 0px;
            } */
.heading_modal h5 {
        color: #fff;
}
.heading_modal button {
        position: absolute;
        color: #fff !important;
        right: 9px;
        top: 50%;
        transform: translateY(-50%);
        opacity: 1;
}
.profilename ul {
        padding: 0;
        text-align: left;
        padding-bottom: 12px;
}

.profilename ul li {
        list-style-type: none;
        margin-bottom: 0px;
}

.profilename ul li label {
        font-size: 13px;
        font-weight: 300;
        line-height: 25px;
}

.name_pro {
        padding: 0px 0px 8px 0px;
        font-size: 13px;
        border-bottom: 1px solid #e4e4e4;
}
.profilebar .dropdown-menu .dropdown-item {
        padding: 10px;
        color: #fff;
}

#pagination li.active a {
        background-color: #e9ecef;
        border-color: #dee2e6;
        border-radius: 3px;
}
.role-switch-wrapper {
        margin-bottom: -20px;
}
.filter_btn button {
        font-size: 16px;
        color: #373a4d;
        padding: 0;
        outline: none;
        border: none;
}

.filter_btn button:focus {
        border: none;
        box-shadow: none;
        outline: none;
}

.filter_btn {
        /* border-bottom: 1px solid #373a4d; */
        margin-left: 30px;
}

.table_view_course td a {
        color: #373a4d;
        text-decoration: underline;
}

.close_icon_quiz {
        position: absolute;
        right: -1px;
        top: 50%;
        transform: translateY(-50%);
        color: #ffffff;
        background: #373a4d;
        padding: 7px 9px;
        border-radius: 0px 5px 5px 0px;
        cursor: pointer;
}

.new_img img {
        max-height: 200px;
        width: 100%;
}
.new_img {
        margin-top: 20px;
}
.course_analytic {
        margin-bottom: 30px;
}

/* #wrapper{
/* #wrapper{
                position: relative;
                top: 80px;
                width: 404px;
            }
            .center {
                left: 50%;
                -webkit-transform: translate( -50% );
                -ms-transform: translate( -50% );
                transform: translate( -50% );
            } */

/*===== The CSS =====*/
.progress .track,
.progress .fill {
        fill: rgba(0, 0, 0, 0);
        stroke-width: 3;
        transform: rotate(90deg) translate(0px, -80px);
}
.progress .track {
        stroke: #f1f1f1;
        stroke-width: 9px;
}
.progress .fill {
        stroke: red;
        stroke-dasharray: 219.99078369140625;
        stroke-dashoffset: -219.99078369140625;
        transition: stroke-dashoffset 1s;
        stroke-width: 9px;
}
.progress.blue .fill {
        stroke: #92b4ce;
}

#link-clicked .fill {
        stroke: #ff736f;
}

.progress.blue.noselect {
        background: unset;
        height: 135px;
        width: 100%;
        padding: 6px;
}
.apexcharts-legend.center.position-bottom {
        bottom: 39px !important;
}
.progress.green .fill {
        stroke: rgb(186, 223, 172);
}
.svg_text {
        text-align: center;
        padding-top: 10px;
        font-size: 13px;
}
.progress .value,
.progress .text {
        fill: rgb(44, 88, 130);
        text-anchor: middle;
}
.progress .text {
        font-size: 8px;
        font-weight: 600;
}
.noselect {
        -webkit-touch-callout: none;
        -webkit-user-select: none;
        -khtml-user-select: none;
        -moz-user-select: none;
        -ms-user-select: none;
        user-select: none;
        cursor: default;
}
.table_skill td a {
        color: #0e2954;
}

.widgetbar {
        display: flex;
        justify-content: flex-end;
}

/* .content{
/* .content{
                position: relative;
            } */

.reset_fil {
        margin-left: 10px;
}

.tooltip {
        pointer-events: none !important;
}

.modal-btn {
        background-color: #1062ac !important;
        color: #fff !important;
        padding: 13px 30px;
        font-size: 0.875rem;
        vertical-align: bottom;
        min-width: 160px;
        cursor: pointer;
        border: 0;
        outline: 0;
        border-radius: 3px;
        text-align: center;
        letter-spacing: 1px;
        text-transform: uppercase;
        display: inline-block;
        transition: background-color 0.15s ease-in;
        white-space: normal;
}
.btn-wrap .btn {
        margin: 0;
}

.creat_policy {
        position: absolute;
        right: 270px;
        z-index: 1;
        top: 20px;
}

.threatimg {
        text-align: center;
        margin: auto;
        margin-bottom: 5px;
        margin-top: 10px;
}
.support-img {
        width: 65px;
        height: auto;
        text-align: center;
        margin: auto;
        margin-bottom: 20px;
}
.btn-wrap {
        margin: auto;
        display: block;
        text-align: center;
}

.btn-wrap h5 {
        background: #373a4d;
        padding: 15px 0px;
        color: #fff;
        border-radius: 5px;
}

.led_str {
        padding: 15px 15px;
        background: #f1f1f1;
        display: block;
        color: #000;
        font-size: 19px;
        border-radius: 6px;
        box-shadow:
                0 2px 2px 0 rgba(0, 0, 0, 0.14),
                0 3px 1px -2px rgba(0, 0, 0, 0.12),
                0 1px 5px 0 rgba(0, 0, 0, 0.2);
        transition: all 0.5s ease;
}

.led_str:hover {
        color: #fff;
        transition: all 0.5s ease;
        transform: translateY(-10px);
        box-shadow: 0px 15px 10px -15px #111;
}
.join_meeting {
        text-align: center;
}

.icon_img img {
        width: 24px;
}
.course_row {
        justify-content: flex-end;
}
.icon_img {
        padding-right: 14px;
}
.start_met .btn {
        margin: 0;
}
.start_met {
        padding-bottom: 10px;
}
.order-primary-detail {
        display: flex;
        align-content: center;
}
.join_meeting .btn {
        text-align: center;
        box-shadow:
                0 2px 2px 0 rgba(0, 0, 0, 0.14),
                0 3px 1px -2px rgba(0, 0, 0, 0.12),
                0 1px 5px 0 rgba(0, 0, 0, 0.2);
        padding: 15px 0px;
        width: 200px;
        margin: 0;
        font-size: 20px;
}

.order-primary-detail h5:before {
        border-bottom: 2px solid #f28a3c;
        content: '';
        position: absolute;
        width: 54px;
        left: 0;
        top: 0;
        bottom: -4px;
}
.order-primary-detail h5 {
        position: relative;
}
.info_quiz .failed span {
        color: red;
}

.butn_set .btn {
        margin: 0;
}

.dat_se span {
        position: absolute;
        right: -60px;
        top: 50%;
        transform: translateY(-50%);
}

/* quiz new css  */
.quiz_modal_wrap .modal.left .modal-dialog,
.modal.right .modal-dialog {
        position: fixed;
        margin: auto;
        width: 750px;
        height: 100%;
        -webkit-transform: translate3d(0%, 0, 0);
        -ms-transform: translate3d(0%, 0, 0);
        -o-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
}

/* .alphabet {
/* .alphabet {
                position: absolute;
                top: 9px;
                left: 11px;
                color: #000;
                font-weight: 600;
            } */

/* .footer_quiz_fix {
/* .footer_quiz_fix {
                position: absolute;
                width: 100%;
                bottom: 0;
            } */
.btn_quiz_head {
        color: #000;
        width: 96% !important;
        text-align: left;
        font-size: 12px;
}

.quiz-question-modal .btn-link {
        color: #000 !important;
}

.quiz_modal_wrap .accordion .card {
        overflow: inherit;
}
.card.quiz_card {
        background: #f8f8f8;
}
.card.quiz_card input {
        font-size: 12px !important;
        padding: 15px 12px;
        background: #fff;
        border: 1px solid #e2e2e2;
}
.quiz_card_head {
        position: relative;
}
.del_quizQuest {
        position: absolute;
        right: 15px;
        top: 30%;
}

.quiz-question-modal .del_quizQuest i {
        font-size: 14px;
}

.quiz-question-modal .del_quizQuest .icon-edit {
        color: #0049b0 !important;
        padding-right: 16px;
}

.quiz-question-modal .del_quizQuest .fa-trash {
        color: #e46a69;
}

.quiz-question-modal .addquestionBtn {
        color: #ffffff;
        background-color: #0e2954;
        border-color: #0e2954;
        box-shadow: none;
}

.setaccordionCss .quiz_card {
        background-color: unset !important;
}

.addOptioncss h6 {
        font-size: 13px !important;
        margin-bottom: 0px;
        font-weight: 600;
        margin-right: 12px;
}

.setaccordionCss .addOptioncss {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
}

.setaccordionCss .addOptioncss .btnCreatTrans {
        padding: 2px 10px !important;
        font-size: 10px !important;
        margin-bottom: 0px;
}

.setaccordionCss .btn-info {
        color: #ffffff !important;
        background-color: #0e2954 !important;
        border-color: #0e2954 !important;
        box-shadow: none;
}

.setaccordionCss .fa-trash {
        color: #e46a69;
        font-size: 15px;
}

.setaccordionCss .alphaBox {
        display: flex;
        align-items: center;
}

.setaccordionCss .alphaBox .alphabet {
        font-size: 10px;
        color: #818181;
        padding: 5px 9px;
        border-radius: 15px;
        margin-right: 10px;
        font-weight: 600;
        border: 1px solid #818181;
}

.setaccordionCss .btn-warning {
        background: #e3e5ed !important;
        color: #373a4d;
        border-color: #e3e5ed;
        margin-right: 10px;
}

.setaccordionCss .alphaBox .form-group {
        width: 100% !important;
        margin-bottom: 0px !important;
}

.setaccordionCss .alphaBox {
        margin-bottom: 24px;
}

.setaccordionCss .del_quiz {
        margin-left: 10px;
}

.bgColorset {
        padding: 15px;
        background: #f6f6f6;
}

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

.setaccordionCss .queInput {
        padding: 15px;
        border-bottom: 1px solid #f1f1f1;
}

.setaccordionCss .queInput .form-group {
        margin-bottom: 0px;
}

.sideModal {
        height: calc(100vh - 190px);
        overflow: auto;
}
.store_img img {
        width: 180px;
        max-height: 140px;
        object-fit: cover;
}
.quiz_modal_wrap .accordion {
        margin-bottom: 0px;
}
.quiz_card {
        margin-bottom: 8px;
        border: 1px solid #f1f1f1 !important;
}
.quiz_modal_wrap .modal-header {
        display: block;
}
/* .del_quiz {
                position: absolute;
                right: 0;
                top: 24%;
                transform: translate(-50%);
                right: 0;
                font-size: 15px;
                color: #666;
            } */

.save_quiz_quest {
        text-align: right;
}
.footer_quiz_fix {
        background: #f8f8f8;
}

.question_title img {
        width: 440px;
        margin-bottom: 20px;
}

.quiz_modal_wrap .modal-header {
        border-bottom: 1px solid #e2e2e2;
        padding-bottom: 10px;
}

.quiz-question-modal .btn_import_cent {
        text-align: unset;
        display: flex;
        align-items: center;
        justify-content: space-between;
}

.quiz-question-modal .btn_import_cent p {
        font-size: 12px;
        color: #8e8e8e;
        margin-bottom: 0px;
}

.quiz-question-modal .btn_import_cent {
        margin-bottom: 15px !important;
}

.quiz-question-modal .btn_import_cent {
        text-align: unset;
        margin-bottom: 10px;
}

.quiz-question-modal .infoHeader {
        background-color: #f6f6f6;
        display: flex;
        align-items: center;
        justify-content: space-between;
        padding: 10px 15px;
        margin-bottom: 10px;
        border-radius: 3px;
        border: 1px solid #f1f1f1;
}

.quiz-question-modal .infoHeader h6 {
        font-size: 11px !important;
        margin-bottom: 0px;
        font-weight: 700;
}

.quiz-question-modal .accordion .card {
        overflow: inherit;
}

.quiz-question-modal .accordion > .card .card-header {
        margin-bottom: 0px !important;
}

.quiz-question-modal .card-header {
        padding: 8px 5px !important;
}

.optionname .quuiz_box {
        padding-bottom: 10px;
        padding-left: 23px;
}

.optionname .quuiz_box:nth-last-child(1) {
        padding-bottom: 0px;
}

.passed_per {
        background: #d4d8de;
        height: 200px;
        width: 200px;
        margin: auto;
        border-radius: 100%;
}
.passed_per h5 {
        font-size: 75px;
        color: #fff;
        padding-top: 65px;
}

.passed_per p {
        font-weight: 600;
        color: #ffffff;
        font-size: 21px;
}

.passed_per {
        height: 250px;
        width: 250px;
        margin: auto;
        border-radius: 100%;
}

.text_passed h5 {
        font-size: 28px;
}
.pasesd_status {
        text-align: center;
}

.text_passed p {
        font-size: 17px;
}

.text_passed {
        margin-top: 20px;
}
.passed_fail {
        width: 260px;
        height: 260px;
        margin: auto;
        padding: 3px 0px;
        border: 2px solid #ccc;
        border-radius: 100%;
}
.already_act a {
        color: #ed7c36 !important;
        font-weight: bold;
        /* font-size: 16px; */
}
.already_act {
        text-align: center;
        font-size: 16px;
}

.trail_css {
        font-size: 18px;
        color: #ed7c36;
        font-weight: 600;
}

/* billing css start here */

.common_billing_css {
        border-bottom: 1px solid #ececeb;
        margin-bottom: 20px;
}

.usage_plans p {
        margin: 0;
}
.usage_plans i {
        font-weight: 600 !important;
        color: #0e2954;
}
.usage_plans h5 {
        margin: 7px 0px;
}
.usage_plans {
        text-align: center;
        background: #ececeb;
        padding: 20px 20px 30px;
        border-radius: 6px;
        margin: 5px 0px 20px;
        position: relative;
}

.billing_tick li:after {
        position: absolute;
        top: 0;
        left: 0;
        content: '\f00c';
        font-family: FontAwesome;
        color: #8bc34a;
}
.billing_tick {
        padding: 0px 10px;
}
.billing_tick li {
        list-style: none;
        position: relative;
        padding-left: 20px;
        padding-bottom: 7px;
}
.headin_appsumo {
        position: relative;
        padding-bottom: 6px;
}

.note_data {
        font-size: 12px;
        color: #f28a3c;
        position: absolute;
        left: 50%;
        transform: translate(-50%);
        width: 100%;
}
.headin_appsumo:after {
        position: absolute;
        bottom: 0px;
        left: 0;
        width: 100px;
        content: '';
        border-bottom: 2px solid #f28a3c;
}
.t_app {
        vertical-align: text-top;
}

/* desc add css */
/* desc add css */

.btn_desc_action {
        margin-top: 20px;
        text-align: right;
}
.ck_text_wrap {
        margin-top: 20px;
}
.lect_dec {
        padding-bottom: 10px;
        border-bottom: 1px solid #ccc;
}
.minimize {
        font-size: 12px;
        line-height: 17px;
}

/* setting attack css start here */

.form-edit {
        padding-top: 20px;
}

.form-edit .table thead th {
        vertical-align: bottom;
        color: unset;
        background-color: unset;
        border-bottom: 2px solid rgba(0, 0, 0, 0.03);
}

.form-edit thead {
        background: unset;
}

.form-edit .btn {
        margin-left: 0;
}
.radio_sel {
        display: flex;
}
.radio_sel .form-check {
        padding-right: 20px;
}

.smtpBoxflex .form-check {
        border: 1px solid #e4e4e4;
        padding: 10px 10px 10px 30px;
        margin-right: 5px;
        cursor: pointer;
        width: 220px;
}

.radio_sel .form-check-label {
        color: #000;
}

.smtpBoxflex .form-check p {
        font-size: 12px;
        line-height: 20px;
        color: #707070;
}

.individual_list p {
        margin-bottom: 6px;
        padding-left: 7px;
}

.individual_list h5 {
        padding: 8px 0px;
}
.individual_list .icon_feat {
        padding-right: 3px;
        color: #8bc34a;
}

.icon_not {
        color: #ddd;
        padding-right: 3px;
}

.feature_list {
        margin-top: 20px;
}

.apexcharts-legend.position-bottom.center,
.apexcharts-legend.position-top.center {
        justify-content: center;
}
.apexcharts-legend.position-bottom .apexcharts-legend-series,
.apexcharts-legend.position-top .apexcharts-legend-series {
        display: flex;
        align-items: center;
        width: 111px;
}

/* 
            guide css start here */

.profilebar.sw_Img img {
        max-height: 32px;
}

.profilebar.sw_Img .name_pro {
        margin-bottom: 0;
}

.profilebar.sw_Img .userbox .profile-icon img {
        filter: none;
}

.profilebar.sw_Img .userbox .profile-icon:hover img {
        width: auto;
}

.profilebar.sw_Img .swDrop {
        border-bottom: 0;
        margin-bottom: -12px;
}

.main_wrap {
        margin-bottom: 10px;
        box-shadow: 0 3px 6px 0 rgba(41, 70, 97, 0.15);
}
.inactive_milestone {
        background: #e9ecef;
        color: #000;
        font-size: 15px;
        padding: 20px 30px;
        margin: 0;
}
.guide_ui .accordian_wrap .accordion > .card .card-header {
        cursor: pointer;
}
.guide_ui .accordian_wrap .card .card-header .card-title {
        font-size: 14px;
        margin-bottom: 0px;
        color: #2f3031;
}

.card_head_acc {
        padding: 20px 30px !important;
}
.sender-identity-accordion-content-not-completed {
        display: flex;
        justify-content: space-between;
}
.sender-identity-accordion-content-not-completed
        .sender-identity-accordion-content-not-completed-left {
        margin-right: 80px;
        padding: 0px 10px;
}
.sender-identity-accordion-content-not-completed
        .sender-identity-accordion-content-not-completed-left
        p {
        font-size: 15px;
        line-height: 27px;
        margin-bottom: 30px;
}
.sender-identity-accordion-content-not-completed
        .sender-identity-accordion-content-not-completed-left
        .sender-identity-accordion-buttons {
        display: flex;
        align-items: center;
}
.sender-identity-accordion-content-not-completed
        .sender-identity-accordion-content-not-completed-right
        img {
        width: 360px;
        margin-bottom: -15px;
}
.question_list_cyber li {
        margin-bottom: 11px;
        color: #333;
}

.question_list_cyber {
        padding: 0;
        padding-left: 16px;
}

.quiz_font {
        font-size: 12px;
        margin-bottom: 0 !important;
}

.check_right {
        margin-top: -3px;
        margin-left: 20px;
        background: #8bc34a;
        border-radius: 100%;
        font-size: 10px;
        color: #fff;
        display: inline-block;
        width: 15px;
        height: 15px;
        padding-left: 3px;
        vertical-align: middle;
}

.check_wrong {
        margin-top: -3px;
        margin-left: 13px;
        background: red;
        border-radius: 100%;
        font-size: 10px;
        color: #fff;
        display: inline-block;
        width: 15px;
        height: 15px;
        padding: 0px 3px;
        vertical-align: middle;
}
.question_name {
        margin-bottom: 20px;
        font-size: 14px;
}
.qname {
        font-size: 14px;
        line-height: 5px;
        margin-top: 4px;
        padding-bottom: 16px;
        color: #1f51b3;
        border-bottom: 1px solid #dfe2e6;
        margin-bottom: 15px;
}

.cyber_question_all {
        border: 1px solid #dee2e6;
        padding: 16px;
        border-radius: 10px;
        margin-bottom: 15px;
}

.quiz_detail_heading {
        position: relative;
        border-bottom: 1px solid #263a5b;
        padding-bottom: 10px;
        font-size: 14px;
}

.right_ans_wrap {
        height: auto;
        padding: 20px 20px;
        border: 1px solid #dee2e6;
}
.detail_resut h5 {
        margin-bottom: 0px;
        margin-left: 5px;
}

.email-container img {
        height: 70px;
        object-fit: contain;
}

.assessment_logo h5 {
        margin-bottom: 16px;
}

.assessment_description h5 {
        margin-top: 24px;
}
.assess_src {
        width: 200px;
        height: auto !important;
}

.detail_resut {
        margin-left: 5px;
        display: flex;
        align-items: center;
}

.detail_resut .title {
        margin-right: 10px;
        margin-bottom: 0;
}
.result_wrap_cyber img {
        height: 25px;
}
.result_wrap_cyber {
        display: flex;
        align-items: center;
        margin-bottom: 12px;
}
.result_wrap_cyber i {
        width: 25px;
        font-size: 20px;
}
.duration_quiz {
        margin: 20px 0px;
        font-size: 13px;
}

/* .quiz_detail_heading:after {
/* .quiz_detail_heading:after {
                border-bottom: 2px solid #0E2954;
                content: "";
                position: absolute;
                width: 150px;
                left: 0;
                bottom: -10px;
            } */

#container svg {
        width: 100%;
        margin-top: 25px;
        margin-bottom: 10px;
        height: auto;
        fill: none;
        stroke: #3b78fa;
        stroke-width: 10;
        stroke-linecap: round;
}
.your_score {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        font-size: 14px;
        font-weight: 600;
        color: #0e2954;
}
.progressbar-text {
        left: 50% !important;
        top: 74% !important;
        transform: translate(-50%, -50%) !important;
        font-size: 20px !important;
}

/* activity css start here */
.view_activ {
        text-align: right;
}
.view_activ a {
        color: #0e2954;
}

.activity_list_wrap {
        /* display: none; */
        align-items: center;
        margin-bottom: 25px;
}

.activity_descrption {
        width: 70%;
        display: flex;
        float: left;
}
.time_acti_wrap {
        width: 30%;
        text-align: right;
        float: right;
}
.name_acti {
        color: #0e2954;
}
.list_name {
        color: #000;
}
.name_desc {
        color: #666;
}

.filter_setup {
        background: #ececeb;
        height: 100vh;
        padding: 20px 20px;
}
.heading_select {
        position: relative;
        margin-bottom: 25px;
}
.heading_select:after {
        position: absolute;
        content: '';
        bottom: -10px;
        left: 0;
        width: 150px;
        height: 2px;
        background-color: #263a5b;
}
.ul_list_act {
        padding: 0;
}
.ul_list_act {
        padding: 0;
}

.ul_list_act li {
        list-style: none;
        margin-bottom: 8px;
        position: relative;
        cursor: pointer;
}
#categorySelect .active:after {
        content: '\f00c';
        position: absolute;
        right: 0;
        background-color: #8bc34a;
        color: #fff;
        padding: 0px 3px;
        font-family: 'fontAwesome';
        border-radius: 100%;
        width: 20px;
        height: 20px;
}
#selectDate .active:after {
        content: '\f00c';
        position: absolute;
        right: 0;
        background-color: #8bc34a;
        color: #fff;
        padding: 0px 3px;
        font-family: 'fontAwesome';
        border-radius: 100%;
        width: 20px;
        height: 20px;
}
.loader_with {
        text-align: center;
        margin-top: 30px;
}

.icon_show:after {
        content: '';
        position: absolute;
        border: 1px dashed #ccc;
        height: 57px;
        left: 50%;
        transform: translate(-50%);
        bottom: -23px;
}

.icon_show {
        position: relative;
        margin-right: 20px;
}

.icon_show .img_icon_act {
        background: #0e2954;
        width: 30px;
        height: 30px;
        color: #fff;
        padding: 7px 8px;
        border-radius: 6px;
}
.heading_activity {
        margin-bottom: 30px;
}

.dots-circle-spinner {
        display: inline-block;
        margin-right: 10px;
        height: 1em;
        width: 1em;
        line-height: 1;
        vertical-align: middle;
        border-radius: 1em;
        transition: all 150ms linear 0s;
        transform: scale(0);
        opacity: 0;
        box-shadow:
                2em 0em 0 0em,
                1.41421356em 1.41421356em 0 -0.4375em,
                0em 2em 0 -0.375em,
                -1.41421356em 1.41421356em 0 -0.3125em,
                -2em 0em 0 -0.25em,
                -1.41421356em -1.41421356em 0 -0.1875em,
                0em -2em 0 -0.125em,
                1.41421356em -1.41421356em 0 -0.0625em;
}
.dots-circle-spinner.loading {
        transform: scale(0.25);
        opacity: 1;
        -webkit-animation: 1.5s linear 150ms normal infinite forwards running
                dots-circle-rotation;
        animation: 1.5s linear 150ms normal infinite forwards running
                dots-circle-rotation;
}
@-webkit-keyframes dots-circle-rotation {
        100% {
                box-shadow:
                        2em 0em 0 0em,
                        1.41421356em 1.41421356em 0 -0.4375em,
                        0em 2em 0 -0.375em,
                        -1.41421356em 1.41421356em 0 -0.3125em,
                        -2em 0em 0 -0.25em,
                        -1.41421356em -1.41421356em 0 -0.1875em,
                        0em -2em 0 -0.125em,
                        1.41421356em -1.41421356em 0 -0.0625em;
        }
        87.5% {
                box-shadow:
                        2em 0em 0 -0.4375em,
                        1.41421356em 1.41421356em 0 -0.375em,
                        0em 2em 0 -0.3125em,
                        -1.41421356em 1.41421356em 0 -0.25em,
                        -2em 0em 0 -0.1875em,
                        -1.41421356em -1.41421356em 0 -0.125em,
                        0em -2em 0 -0.0625em,
                        1.41421356em -1.41421356em 0 0em;
        }
        75% {
                box-shadow:
                        2em 0em 0 -0.375em,
                        1.41421356em 1.41421356em 0 -0.3125em,
                        0em 2em 0 -0.25em,
                        -1.41421356em 1.41421356em 0 -0.1875em,
                        -2em 0em 0 -0.125em,
                        -1.41421356em -1.41421356em 0 -0.0625em,
                        0em -2em 0 0em,
                        1.41421356em -1.41421356em 0 -0.4375em;
        }
        62.5% {
                box-shadow:
                        2em 0em 0 -0.3125em,
                        1.41421356em 1.41421356em 0 -0.25em,
                        0em 2em 0 -0.1875em,
                        -1.41421356em 1.41421356em 0 -0.125em,
                        -2em 0em 0 -0.0625em,
                        -1.41421356em -1.41421356em 0 0em,
                        0em -2em 0 -0.4375em,
                        1.41421356em -1.41421356em 0 -0.375em;
        }
        50% {
                box-shadow:
                        2em 0em 0 -0.25em,
                        1.41421356em 1.41421356em 0 -0.1875em,
                        0em 2em 0 -0.125em,
                        -1.41421356em 1.41421356em 0 -0.0625em,
                        -2em 0em 0 0em,
                        -1.41421356em -1.41421356em 0 -0.4375em,
                        0em -2em 0 -0.375em,
                        1.41421356em -1.41421356em 0 -0.3125em;
        }
        37.5% {
                box-shadow:
                        2em 0em 0 -0.1875em,
                        1.41421356em 1.41421356em 0 -0.125em,
                        0em 2em 0 -0.0625em,
                        -1.41421356em 1.41421356em 0 0em,
                        -2em 0em 0 -0.4375em,
                        -1.41421356em -1.41421356em 0 -0.375em,
                        0em -2em 0 -0.3125em,
                        1.41421356em -1.41421356em 0 -0.25em;
        }
        25% {
                box-shadow:
                        2em 0em 0 -0.125em,
                        1.41421356em 1.41421356em 0 -0.0625em,
                        0em 2em 0 0em,
                        -1.41421356em 1.41421356em 0 -0.4375em,
                        -2em 0em 0 -0.375em,
                        -1.41421356em -1.41421356em 0 -0.3125em,
                        0em -2em 0 -0.25em,
                        1.41421356em -1.41421356em 0 -0.1875em;
        }
        12.5% {
                box-shadow:
                        2em 0em 0 -0.0625em,
                        1.41421356em 1.41421356em 0 0em,
                        0em 2em 0 -0.4375em,
                        -1.41421356em 1.41421356em 0 -0.375em,
                        -2em 0em 0 -0.3125em,
                        -1.41421356em -1.41421356em 0 -0.25em,
                        0em -2em 0 -0.1875em,
                        1.41421356em -1.41421356em 0 -0.125em;
        }
        0% {
                box-shadow:
                        2em 0em 0 0em,
                        1.41421356em 1.41421356em 0 -0.4375em,
                        0em 2em 0 -0.375em,
                        -1.41421356em 1.41421356em 0 -0.3125em,
                        -2em 0em 0 -0.25em,
                        -1.41421356em -1.41421356em 0 -0.1875em,
                        0em -2em 0 -0.125em,
                        1.41421356em -1.41421356em 0 -0.0625em;
        }
}
@keyframes dots-circle-rotation {
        100% {
                box-shadow:
                        2em 0em 0 0em,
                        1.41421356em 1.41421356em 0 -0.4375em,
                        0em 2em 0 -0.375em,
                        -1.41421356em 1.41421356em 0 -0.3125em,
                        -2em 0em 0 -0.25em,
                        -1.41421356em -1.41421356em 0 -0.1875em,
                        0em -2em 0 -0.125em,
                        1.41421356em -1.41421356em 0 -0.0625em;
        }
        87.5% {
                box-shadow:
                        2em 0em 0 -0.4375em,
                        1.41421356em 1.41421356em 0 -0.375em,
                        0em 2em 0 -0.3125em,
                        -1.41421356em 1.41421356em 0 -0.25em,
                        -2em 0em 0 -0.1875em,
                        -1.41421356em -1.41421356em 0 -0.125em,
                        0em -2em 0 -0.0625em,
                        1.41421356em -1.41421356em 0 0em;
        }
        75% {
                box-shadow:
                        2em 0em 0 -0.375em,
                        1.41421356em 1.41421356em 0 -0.3125em,
                        0em 2em 0 -0.25em,
                        -1.41421356em 1.41421356em 0 -0.1875em,
                        -2em 0em 0 -0.125em,
                        -1.41421356em -1.41421356em 0 -0.0625em,
                        0em -2em 0 0em,
                        1.41421356em -1.41421356em 0 -0.4375em;
        }
        62.5% {
                box-shadow:
                        2em 0em 0 -0.3125em,
                        1.41421356em 1.41421356em 0 -0.25em,
                        0em 2em 0 -0.1875em,
                        -1.41421356em 1.41421356em 0 -0.125em,
                        -2em 0em 0 -0.0625em,
                        -1.41421356em -1.41421356em 0 0em,
                        0em -2em 0 -0.4375em,
                        1.41421356em -1.41421356em 0 -0.375em;
        }
        50% {
                box-shadow:
                        2em 0em 0 -0.25em,
                        1.41421356em 1.41421356em 0 -0.1875em,
                        0em 2em 0 -0.125em,
                        -1.41421356em 1.41421356em 0 -0.0625em,
                        -2em 0em 0 0em,
                        -1.41421356em -1.41421356em 0 -0.4375em,
                        0em -2em 0 -0.375em,
                        1.41421356em -1.41421356em 0 -0.3125em;
        }
        37.5% {
                box-shadow:
                        2em 0em 0 -0.1875em,
                        1.41421356em 1.41421356em 0 -0.125em,
                        0em 2em 0 -0.0625em,
                        -1.41421356em 1.41421356em 0 0em,
                        -2em 0em 0 -0.4375em,
                        -1.41421356em -1.41421356em 0 -0.375em,
                        0em -2em 0 -0.3125em,
                        1.41421356em -1.41421356em 0 -0.25em;
        }
        25% {
                box-shadow:
                        2em 0em 0 -0.125em,
                        1.41421356em 1.41421356em 0 -0.0625em,
                        0em 2em 0 0em,
                        -1.41421356em 1.41421356em 0 -0.4375em,
                        -2em 0em 0 -0.375em,
                        -1.41421356em -1.41421356em 0 -0.3125em,
                        0em -2em 0 -0.25em,
                        1.41421356em -1.41421356em 0 -0.1875em;
        }
        12.5% {
                box-shadow:
                        2em 0em 0 -0.0625em,
                        1.41421356em 1.41421356em 0 0em,
                        0em 2em 0 -0.4375em,
                        -1.41421356em 1.41421356em 0 -0.375em,
                        -2em 0em 0 -0.3125em,
                        -1.41421356em -1.41421356em 0 -0.25em,
                        0em -2em 0 -0.1875em,
                        1.41421356em -1.41421356em 0 -0.125em;
        }
        0% {
                box-shadow:
                        2em 0em 0 0em,
                        1.41421356em 1.41421356em 0 -0.4375em,
                        0em 2em 0 -0.375em,
                        -1.41421356em 1.41421356em 0 -0.3125em,
                        -2em 0em 0 -0.25em,
                        -1.41421356em -1.41421356em 0 -0.1875em,
                        0em -2em 0 -0.125em,
                        1.41421356em -1.41421356em 0 -0.0625em;
        }
}

/* deparments modal sidebar css */
/*******************************
            * MODAL AS LEFT/RIGHT SIDEBAR
            * Add "left" or "right" in modal parent div, after class="modal".
            * Get free snippets on bootpen.com
            *******************************/
.department_sec.modal.right .modal-dialog {
        position: fixed;
        margin: auto;
        width: 800px;
        height: 100%;
        -webkit-transform: translate3d(0%, 0, 0);
        -ms-transform: translate3d(0%, 0, 0);
        -o-transform: translate3d(0%, 0, 0);
        transform: translate3d(0%, 0, 0);
}

.department_sec.modal.right .modal-body .modal-content {
        height: 100%;
        overflow-y: auto;
}

.department_sec.modal.right .modal-body {
        padding: 15px 15px 80px;
}

/*Right*/
.modal.right.fade .modal-dialog {
        right: -320px;
        -webkit-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        -moz-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        -o-transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
        transition:
                opacity 0.3s linear,
                right 0.3s ease-out;
}

.modal.right.fade.in .modal-dialog {
        right: 0;
}
.btn_wrap_depart {
        text-align: right;
}
.padding_wrap_depart {
        padding-left: 39px;
}
.check_all_box {
        display: flex;
        align-items: center;
        border-radius: 3px;
}
.table_user_group {
        margin-top: 20px;
        height: calc(100vh - 242px);
        /* background: #f1f1f1; */
        overflow: auto;
        position: relative;
}
.table_user_group1 {
        margin-top: 20px;
        height: calc(100vh - 372px);
        /* background: #f1f1f1; */
        overflow: auto;
        position: relative;
}
.card_body_depart {
        height: calc(100vh - 200px);
}
.fixed_bottom {
        position: fixed;
        bottom: 0px;
        background: #f9f9f9;
        width: 94%;
        text-align: right;
        padding: 10px 20px;
        border: 1px solid #f1f1f1;
        left: 30px;
}
.total_val {
        padding-top: 10px;
        text-align: right;
}
.pad_depart {
        padding-left: 39px;
}
.tab_pane_depart {
        display: block;
        border-top: 1px solid #f1f1f1;
        padding: 15px 15px;
}
.department_sec {
        z-index: 9999;
}

.card_body_depart .nav-pills .nav-link.active {
        color: #373a4d;
        background-color: unset;
        border-bottom: 2px solid #373a4d;
        border-radius: 0;
}
.department_sec .modal_header_depart {
        display: block;
}
.wrap_depart_field {
        background-color: #f6f6f6;
        padding: 15px 15px;
        margin-bottom: 15px;
}
.wrap_depart_field .form-group {
        margin-bottom: 0;
}
.fix_with_url {
        max-width: 100px;
        display: flex;
        align-items: flex-end;
        padding-left: 11px !important;
}
.zohohc-c9ab05e085.zohohc-b6b72e1b7a.zohohc-3dec8d4fef {
        z-index: 99;
        border-radius: 15px;
}
.settings_list .tab_pane_depart {
        border-top: none;
}

.settings_list .tab_pane_depart .gray-box {
        background: #f2f2f2;
        padding: 20px;
        border-radius: 5px;
        padding-bottom: 45px;
}
.settings_list .tab_pane_depart .gray-box .user-box p {
        margin: 0px;
        border-bottom: 1px solid #e8e7e7;
        padding: 10px 0px;
}
.settings_list .tab_pane_depart .gray-box h6 {
        border-bottom: 2px solid black;
        padding-bottom: 10px;
        /* width: max-content; */
        font-size: 17px;
        font-weight: 700;
}
.settings_list .tab_pane_depart .gray-box .user-box span {
        color: black;
        padding-right: 6px;
}
.settings_list .tab_pane_depart .gray-box .user-box .btn-link {
        float: right;
}
.set_width_set {
        width: 63%;
}
.width_setup {
        width: 97%;
}
.place_right {
        margin-right: 19px;
}

.btn-wraps .btn {
        margin-left: 0;
}

/*=============== question bank css start here =============*/

.fixed_height_bank {
        height: calc(100vh - 208px);
        overflow: auto;
}
.question_nav .nav-link.active {
        color: #fff !important;
        background-color: #0e2954;
        position: relative;
}
.question_nav .nav-link {
        background-color: #fff;
        position: relative;
        border-bottom: 1px solid #ebebeb;
        padding: 10px 15px;
        border-radius: 0;
}
.add-question-group-btn {
        position: absolute;
        right: 10px;
        font-size: 22px;
        top: 50%;
        transform: translateY(-50%);
}

.nav-link {
        display: block;
}

.questionbank_set_wrap ol {
        padding-left: 20px;
}
.questionbank_set_wrap ol li {
        color: #000;
}
.anser_color {
        color: green;
}

.answer_color {
        color: #000;
}
.add_question_down {
        text-align: right;
}
.questionbank_set_wrap ol li {
        color: #000;
        margin-bottom: 5px;
}


.horizontal-Card .cyberBadge{
 margin-left: 5px;
}

.cyberBadge {
        font-size: 10px;
        background: linear-gradient(15deg, #8b4088 0%, #2b4eaf 100%);
        display: inline-block;
        white-space: pre;
        padding: 4px 7px;
        border-radius: 8px;
        color: #fff;
}
.disabledGroupBar {
        pointer-events: none;
        opacity: 0.5;
        cursor: not-allowed;
        background-color: #f5f5f5;
}

.border_btm_questionbank:hover .edit_del_question {
        opacity: 1;
}
.border_btm_questionbank .btn-success {
        background: #15bb5f;
}

.edit_del_question ul li {
        display: inline-block;
        margin-right: 20px;
}
.edit_del_question ul li {
        display: inline-block;
        margin-right: 20px;
        cursor: pointer;
}
.edit_color {
        color: #51bb60;
}
.danger_color {
        color: #f44336;
}
.edit_del_question {
        position: absolute;
        right: 0;
        bottom: -9px;
        opacity: 0;
}
.input_alpha input {
        padding-left: 30px;
}

.modal.right.question_bank_modal .modal-body {
        padding: 17px 15px 72px;
}

.question_bank_modal .modal-header {
        display: block;
}

.img_up_quest {
        text-align: center;
        border-bottom: 2px dashed #f1f1f1;
}
.input_uplaod_file {
        text-align: center;
}

.img_up_quest .img_up_dn {
        width: 90px;
        margin-bottom: 15px;
}

.choose_question_file {
        background-color: #0e2954;
        color: white;
        cursor: pointer;
        margin-top: 1rem;
        padding: 5px 15px;
        border-radius: 3px;
}
.download_save_btn {
        display: flex;
        justify-content: space-between;
        border-top: 2px dashed #f1f1f1;
        padding-top: 15px;
}

.question_bank_btn {
        position: absolute;
        bottom: 50px;
        left: 50%;
        transform: translate(-50%);
        margin-left: 0;
        width: 90%;
        color: #0e2954;
        background: #fff;
        background: rgb(23, 195, 178) !important;
        border: none;
        font-weight: 700;
        box-shadow:
                0 4px 5px 0 rgba(0, 0, 0, 0.14),
                0 1px 10px 0 rgba(0, 0, 0, 0.12),
                0 2px 4px -1px rgba(0, 0, 0, 0.3);
}

.question_bank_btn:focus {
        box-shadow: none !important;
}

.footerbar {
        position: fixed;
        bottom: 0;
        right: 0;
        left: 250px;
        padding: 8px 0px;
        text-align: center;
        background-color: #ffffff;
        box-shadow: 0 1px 5px 0 rgba(62, 62, 79, 0.23);
}

.footerbar p {
        font-size: 0.8125rem;
}

.contentbar {
        margin-bottom: 0px;
        padding: 15px;
}

.custom-space {
        padding: 90px 15px 50px 15px !important;
}

.contentBarSpaced {
        padding: 90px 15px 50px 15px;
}

.vertical-menu > li.active {
        background: unset;
}
.vertical-menu > li.active > a {
        background-color: hsla(0, 0%, 100%, 0.08);
        color: #fff !important;
        opacity: 1;
        transition: all 0.3s ease;
        font-size: 12px !important;
        text-decoration: none !important;
        align-items: center !important;
        width: 100% !important;
        position: relative !important;
        font-weight: 400 !important;
        border-radius: 8px;
}
/* .main .active{
                background-color: #3a7cc5;
            } */
.set_width_show {
        min-width: 100px;
}

.topbar {
        z-index: 3;
}
div#zohohc-asap-web-launcherbox {
        z-index: 99;
}

#activityDataWrap {
        height: calc(100vh - 300px);
        overflow: auto;
        padding-right: 10px;
}

#basic-addon2 {
        display: none;
}
.d_verify i {
        font-size: 26px;
}
.d_verify {
        display: flex;
        width: 65px;
        height: 65px;
        border-radius: 100%;
        background-color: #eff2f7;
        justify-content: center;
        margin: auto;
        color: #3f51b5;
        align-items: center;
        margin: 0px auto 20px;
}

.login_btn_verify_succes {
        padding: 4px 10px;
}

.datepicker--cell.-disabled- {
        cursor: no-drop;
        color: #000;
        background: #ccc;
        opacity: 0.6;
        border-radius: 0px;
}
#usersignin .btn {
        margin-left: 0;
}

.assign_user {
        display: block;
}
.assign_btn button {
        margin-left: 0;
}
.assign_btn .bootstrap-select {
        width: 100% !important;
}

.questionBank .modal-dialog {
        width: 99% !important;
}
.questionBank .modal-content {
        width: 100%;
}
.all_groups_list .ul_list_groups .group_list_check {
        list-style: none;
        margin-bottom: 13px;
}

.tab_question_bank .nav-tabs .nav-link.active {
        color: #0e2954;
        background-color: unset;
        border-color: unset;
        border: none;
        border-bottom: 2px solid #0e2954;
        font-weight: 700;
}
.all_groups_list .ul_list_groups {
        padding-left: 0;
}
.all_groups_list .searchbar .search_groups {
        width: 100%;
        margin-bottom: 20px;
}
.groups_question_det_list {
        padding: 20px 20px;
        height: calc(100vh - 137px);
        overflow: auto;
        border-radius: 5px;
        background: #f3f6fa;
        /* box-shadow: 0 2px 2px 0 rgba(0,0,0,0.14), 0 3px 1px -2px rgba(0,0,0,0.12), 0 1px 5px 0 rgba(0,0,0,0.2); */
}
.import_ques {
        margin-top: 14px;
        text-align: right;
}
.tab_content_question {
        height: calc(100vh - 200px);
        overflow: auto;
        border: 1px solid #ccc;
        padding: 10px 10px;
}
.modal_fix_he {
        padding-bottom: 0 !important;
        padding-top: 0 !important;
}
.heading_gr {
        color: #0e2954;
        border-bottom: 1.5px solid #0e2954;
        font-weight: 700;
        padding-bottom: 5px;
}
.tab_question_bank .btn {
        margin-left: 0;
}

.tab_question_bank .accordion > .card h2 .btn-link {
        color: #0e2954;
}
.answer_check_quest {
        color: #000;
}
.answer_group_list ul {
        padding-left: 0;
}

.answer_group_list ul li {
        color: #000;
        list-style: none;
        margin-bottom: 8px;
}

.btn_import_cent {
        text-align: right;
        margin-bottom: 20px;
}

.btn_assessment {
        position: absolute;
        top: 0;
        right: 0;
}
.cancel_dis {
        display: flex;
        justify-content: flex-end;
}

.democlass .accordion > .card h2 {
        line-height: 20px;
        position: relative;
}
.custom_clas {
        position: absolute;
        left: 8px;
        top: 50%;
        transform: translateY(-50%);
}
.btn_ques {
        padding: 20px 30px !important;
}

.questionBank .modal-dialog.modal-lg {
        padding: 20px 12px 20px 0px;
}

.ui_question_btn {
        background: #f3f6fa !important;
        color: #373a4d !important;
        opacity: 1;
}

.drfault_tab_set {
        height: calc(100vh - 247px);
        overflow: auto;
}

.quiz_btn_import_check {
        margin-top: 20px;
        float: right;
}

.add_question_down .btn-success:not(:disabled):not(.disabled):active:focus {
        box-shadow: none !important;
}

.add_question_down .btn-success:focus {
        color: #ffffff;
        background-color: #15bb5f;
        border-color: #15bb5f;
        box-shadow: none;
}

.note_template_desc {
        font-size: 13px;
        display: block;
        margin-bottom: 20px;
}

.user_tracking_list .modal-header {
        display: block;
}
.accordian_user_tracking .btn {
        margin-left: 0;
}

.user_tracking_list .modal-dialog {
        width: 1080px !important;
}
.npci_logo {
        position: absolute;
        top: 40px;
        width: 140px;
        z-index: 2;
        left: 60px;
}

.depart_role {
        display: flex;
        justify-content: space-between;
}
.btn_close_depart {
        display: block;
        opacity: 1;
        color: #263a5b;
        font-size: 16px;
        border-radius: 5px;
        margin-top: -11px;
}

/* Image Cropping */
/* Image Cropping */

.crop_image {
        display: block;
        max-width: 100%;
}
.crop_preview {
        overflow: hidden;
        width: 160px;
        height: 160px;
        border: 1px solid red;
}

.croplogoSection {
        padding: 0px 20px;
}

.selectCrop {
        margin-top: 20px;
}

.selectCrop .form-label {
        margin-bottom: 5px !important;
}
.cropBox .form-check-input {
        width: 12px;
}

.cropBox .form-check {
        margin-bottom: 2px;
}

.cropBox .form-check-label {
        font-size: 12px;
        font-weight: 400;
}

#modal_crop .modal-content {
        border: none;
        background-color: #ffffff;
        margin: auto;
        width: 670px;
}

#modal_crop_scorm .modal-content {
        border: none;
        background-color: #ffffff;
        margin: auto;
        width: 670px;
}

.grp_add .create_sk {
        position: absolute;
        right: 18px;
        top: 0;
        color: #464a6b;
        font-weight: 600;
}

#btnOpenInClient {
        display: none;
}
.showing_cam {
        position: absolute;
        top: -63px;
        margin-left: 27px;
}
.txt_position {
        position: relative;
}
#apex-pie-chart .apexcharts-canvas {
        margin: 0 auto;
        left: -4px;
}
.form_video {
        border: navajowhite;
        border-bottom: 1px solid whitesmoke;
        border-radius: 0;
        padding-left: 20px;
}
.icon_cross {
        display: none;
        position: absolute;
        top: 50%;
        right: 27px;
        transform: translateY(-50%);
}
.video_vimeo_up .modal-content {
        width: 1080px;
}
.video_vimeo_up .modal-header {
        background-color: #fff;
        padding: 20px 20px 0px;
}
.video_vimeo_up .modal-footer {
        border: none;
}
.video_vimeo_up .modal-title {
        color: #000;
}
.video_vimeo_up .modal-header .close {
        color: #000000;
}
.add_flex {
        justify-content: space-evenly;
}
.attach_link {
        position: absolute;
        top: 50%;
        left: 0;
        transform: translateY(-50%);
        z-index: 2;
}
.input_wrap_video {
        position: relative;
}
.video_vimeo_up .custom-file-label {
        border: none;
        border-bottom: 1px solid #eee;
        border-radius: 0;
        padding-left: 20px;
}
.video_vimeo_up .custom-file-label::after {
        background-color: unset;
        border: none;
        color: #ffffff;
        height: 36px;
        line-height: 24px;
}
.video_vimeo_up .custom-file-input:lang(en) ~ .custom-file-label::after {
        content: '';
}

.load_more_btn {
        text-align: center;
        margin-top: 30px;
}

.drive_heading {
        min-height: 42px;
}

.frame_ref {
        width: 100%;
        max-height: 187px;
}

/* Store ui start here */

.filter_list_store .filter_advance li.active {
        background: #e5f2fe;
        padding: 10px;
        color: #000;
        list-style: none;
        margin-bottom: 9px;
        border-radius: 4px;
}
.filter_list_store .filter_advance li {
        padding-left: 10px;
        color: #000;
        list-style: none;
        margin-bottom: 9px;
        border-radius: 4px;
        border: 1px solid #f8f8f8;
        padding: 10px 10px;
        cursor: pointer;
}

.filter_list_store .filter_advance li a {
        color: #000;
}

.infographic-list .grid_view_card {
        background-color: #fff !important;
        height: auto;
        position: relative;
}

.infographic-list .img-overlay {
        border: 1px solid #dfe2e6;
}

.infographic-list .card {
        border: none !important;
}

.courseCards.crsCrd .grid_view_card {
        background-color: #fff !important;
        box-shadow: rgb(99 99 99 / 20%) 0px 2px 8px 0px;
        margin-bottom: 20px;
        height: auto;
}

.img_hover_link {
        position: relative;
}
/* .img_hover_link:hover .overlay_hover{
                opacity: 1;
                height: 100%;
            } */
/* .overlay_hover {
/* .overlay_hover {
                position: absolute;
                width: 100%;
                height: 0%;
                top: 0;
                left: 0;
                background: rgba(0,0,0,.2);
                display: flex;
                align-items: center;
                justify-content: center;
                opacity: 0;
                transition: all .5s ease;
                cursor: pointer;
            }
            .overlay_hover a {
                color: #0E2954;
                z-index: 9;
                font-weight: 700;
                font-size: 20px;
            } */
.content {
        position: relative;
}
.analytic_store {
        padding: 10px 12px;
        display: flex;
}

.button_manage {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-top: 20px;
}
.all_published_info {
        margin-top: 10px;
}
.all_published_info h6 span {
        color: #0e2954;
}
.all_published_info h6 {
        color: #6c757d;
        font-size: 14px;
}

.date-text {
        font-size: 11px;
        margin-bottom: 0;
        background: rgb(0 0 0 / 3%);
        width: 100%;
        padding: 7px 13px;
        color: #636363;
}

.mini-blocks {
        display: flex;
        align-items: center;
}
.mini-blocks .text-icon {
        font-size: 16px;
        text-align: center;
        color: #0e2954 !important;
        margin-right: 1px;
}

.catTitle {
        color: #000;
        background: #e9e9e9e6;
        font-size: 11.5px;
        padding: 2px 4px;
        border-radius: 5px;
        display: -webkit-box !important;
        line-clamp: 1;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
}

.btn_managed_store_cr {
        position: absolute;
        top: 10px;
        right: 5px;
        z-index: 2;
}

/* .tutorial_store_filter ul li {
/* .tutorial_store_filter ul li {
                list-style: none;
                margin-bottom: 6px;
                border: 1px solid #e5f2fe;
                border-radius: 5px;
            } */

.tutorial_store_filter ul {
        padding-left: 0;
        margin-bottom: 0;
}

.tutorial_store_filter .btn {
        margin-left: 0;
}

.tutorial {
        width: 70%;
}
.search_box {
        display: flex;
        align-items: center;
        justify-content: space-evenly;
        width: 30%;
}

.grid_list_item {
        display: flex;
        align-items: center;
}

.course-section .sort_by_store {
        color: #000;
        padding: 0;
        margin-left: 0;
        margin-right: 10px;
}

.custom_drop {
        display: flex;
        align-items: center;
        justify-content: space-between;
        margin-bottom: 10px;
        border-bottom: 1px solid #e5f2fe;
        padding-bottom: 5px;
}
.list_of_skill ul li {
        margin-bottom: 7px;
        cursor: pointer;
        position: relative;
}
.wrap_drop {
        border: 1px solid #e5f2fe;
        padding: 10px 10px;
        border-radius: 5px;
}

.custom_drop h5 {
        margin-bottom: 0;
        /* border-radius: 5px; */
}
.active_check {
        position: relative;
        background: #f8f8f8;
}

.active_check:after {
        position: absolute;
        font-family: FontAwesome;
        content: '\f00c';
        right: 5px;
        top: 50%;
        transform: translateY(-50%);
        color: #15bb5f;
}
.list_of_skill {
        height: 110px;
        overflow: auto;
}

/* width */
.list_of_skill::-webkit-scrollbar {
        width: 5px;
}

/* Track */
.list_of_skill::-webkit-scrollbar-track {
        background: #f1f1f1;
        border-radius: 10px;
}

/* Handle */
.list_of_skill::-webkit-scrollbar-thumb {
        background: #ccc;
        border-radius: 10px;
}

/* Handle on hover */
.list_of_skill::-webkit-scrollbar-thumb:hover {
        background: #555;
}
.language_ui {
        margin-top: 20px;
}

.badge {
        display: inline-block;
        padding: 0.25em 0.5em;
        font-size: 12px;
        line-height: 1;
        text-align: center;
        white-space: nowrap;
        vertical-align: baseline;
        border-radius: 0.25rem;
}

.badges {
        font-size: 10px;
        font-weight: 400;
        padding: 5px 10px;
}

.badge-secondary {
        color: #000;
        background-color: #eeeeee;
}

.badge-success {
        background: #d1e7dd !important;
        color: #318860 !important;
}

.training-content-table-modal-wrapper .course_img_store {
  height: 70px;
}

.course_img_store {
        width: 100%;
        object-fit: contain;
      
}

.filter_list_store {
        border: 1px solid #ccc;
        padding: 20px 15px;
        border-radius: 5px;
}

.reset_filters_store {
        color: #212529;
        font-weight: 600;
}

.filter_reset_head {
        display: flex;
        justify-content: space-between;
        border-bottom: 1px solid #e5f2fe;
        margin-bottom: 20px;
        padding-bottom: 10px;
}
.filter_cour {
        margin-bottom: 0;
}

.preview_space {
        margin-bottom: 10px;
}
.demo-container {
        width: 300px;
        margin: auto;
        z-index: 2;
        position: relative;
}
.demo-container .progress-bar {
        height: 3px;
        background-color: #0e2954;
        width: 100%;
        overflow: hidden;
}

.card-reminder {
        background-color: #fbfbfb;
        display: none;
        border: 1px solid #dfe2e6;
        margin-bottom: 10px;
}

.course_wrap .progress-bar {
        width: 100%;
        overflow: hidden;
}
.font_btn_store {
        margin-right: 0;
        background: rgb(236 236 235);
        color: #000000;
        padding: 0;
        font-size: 18px;
}
.wrap_loader {
        padding: 20px 20px;
}
.postion_rel {
        position: relative;
        border: none;
}
.progress-bar-value {
        width: 100%;
        height: 100%;
        background-color: #fff;
        animation: indeterminateAnimation 1s infinite linear;
        transform-origin: 0% 50%;
}

@keyframes indeterminateAnimation {
        0% {
                transform: translateX(0) scaleX(0);
        }
        40% {
                transform: translateX(0) scaleX(0.4);
        }
        100% {
                transform: translateX(100%) scaleX(0.5);
        }
}
.auth_verify ul {
        display: flex;
        padding-left: 0;
        justify-content: space-evenly;
}

.auth_verify ul li {
        padding: 20px 20px;
        width: 45%;
        margin-right: 20px;
        text-align: center;
        list-style: none;
        box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}

.auth_verify ul li img {
        width: 40px;
        object-fit: cover;
        margin-bottom: 15px;
}
.auth_verify ul li {
        cursor: pointer;
}

.auth_verify ul li:last-child {
        margin-right: 0;
}
.active_auth {
        background: #e5f2fd;
        border: 2px solid #18d26b;
        position: relative;
}
.active_auth:after {
        position: absolute;
        content: '\f058';
        top: -15px;
        right: -12px;
        color: #18d26b;
        font-family: FontAwesome;
}
.btn_enable {
        text-align: right;
}
.verification.Name {
        font-size: 20px;
        border-bottom: 1px solid #ddd;
        margin-bottom: 15px;
        padding-bottom: 8px;
}
.mera_css {
        display: flex;
        margin-bottom: 8px;
}
.mera_css h5 {
        margin-right: 10px;
        margin-bottom: 0;
}
.btn_remove_margin {
        margin-left: 0px !important;
}

.select_role {
        display: flex;
        justify-content: space-between;
}
.info-card {
        box-shadow: 0px 0px 30px 0px rgb(0 0 0 / 6%);
        padding: 15px;
        border-radius: 10px;
        margin-bottom: 25px;
        background-color: #fff;
}
.info-card .card-height {
        height: 502px;
        overflow: auto;
}
.info-card .info-icons {
        background: #ececeb;
        padding: 5px;
        border-radius: 6px;
}
.info-card h5 {
        margin: 20px 0px;
}

.close_to_search {
        margin-left: -29px;
        margin-top: 2px;
}

.reset_button_users {
        background-color: #0e2954;
        color: #fff;
        margin-left: 3px;
        border: 1px solid #0e2954;
}

iframe {
        border-width: 0px;
}

iframe img {
        width: 100% !important;
}

.announcement_wrap {
        background: url(../assets/images/img/announcement.jpg);
        background-size: cover;
        position: relative;
        height: 200px;
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
}

.has-search .form-control {
        padding-left: 2.375rem;
}

.has-search .form-control-feedback {
        position: absolute;
        z-index: 2;
        display: block;
        width: 2.375rem;
        height: 2.375rem;
        line-height: 2.375rem;
        text-align: center;
        pointer-events: none;
        color: #aaa;
}
.width_set {
        width: 40%;
        text-align: center;
        position: relative;
}
.position_relative {
        position: relative;
}
.icon_search_position {
        position: absolute;
        right: 10px;
        top: 50%;
        transform: translateY(-50%);
}
.position_relative .form-control {
        padding-left: 10px;
}
.announcement_heading {
        margin-bottom: 20px;
}
.ul_filter_list li.active {
        border-bottom: 3px solid #0e2954;
        border-radius: 1px;
}

.ul_filter_list li {
        list-style: none;
        margin: 0px 30px;
        font-size: 16px;
        font-weight: 600;
        color: #000;
        cursor: pointer;
}
.ul_filter_list {
        display: flex;
}
.ul_imge_html {
        display: flex;
        padding-left: 0;
}
.ul_imge_html li {
        list-style: none;
        margin-right: 10px;
        background: #ccc;
        border: 1px solid #ccc;
        padding: 10px 30px;
        border-radius: 5px;
        color: #000;
        cursor: pointer;
}
.ul_imge_html li.active {
        background: #060505;
        border-radius: 5px;
        color: #fff;
}
#infographic-image-header-alignment {
        margin-bottom: 20px;
}
.label-flex {
        display: flex;
        justify-content: space-between;
}
.image_wrap {
        display: flex;
        justify-content: space-between;
        margin-bottom: 20px;
}
.img_header_info {
        width: 48%;
}

.announce_filter_wrap {
        width: 80%;
        margin: auto;
        margin-top: 30px;
}
.today_wrap {
        padding: 20px 20px;
        border-right: 3px solid #f3f3f3;
        width: 20%;
}
.announcement_heading_name {
        padding-left: 20px;
}
.announcement_name {
        display: flex;
        margin-bottom: 40px;
}
.campaign_css {
        display: block;
}

.two_img {
        position: absolute;
        width: 90px;
        right: -120px;
        top: 50%;
        transform: translateY(-50%);
}
.one_img {
        position: absolute;
        width: 90px;
        left: -130px;
        top: 50%;
        transform: translateY(-50%);
}
.box_test {
        box-shadow:
                rgb(50 50 93 / 25%) 0px 50px 89px -20px,
                rgb(0 0 0 / 30%) 0px 21px 51px -30px,
                rgb(10 37 64 / 35%) 0px -2px 6px 0px inset;
}
#test .modal-header {
        display: block;
}
.flex_text {
        display: flex;
}
.width_test {
        width: 40%;
}
.traning_wrap .form-group {
        width: 50%;
}
.traning_wrap {
        display: flex;
        align-items: end;
        padding-left: 20px;
        margin-top: 20px;
}

#quizAllQuestion .card-body {
        overflow: auto;
}

#store-content h5:after {
        position: absolute;
        content: '';
        left: 0;
        background: #ff9800;
        width: 50px;
        height: 3px;
        bottom: 0;
        border-radius: 30px;
}

#store-content h5 {
        margin-bottom: 10px;
        position: relative;
        padding-bottom: 6px;
}
#showUlofCampaigns {
        display: none;
}

.hr {
        color: red;
}

.expText {
        margin-bottom: 0;
        font-size: 12px;
        padding-top: 5px;
}

.slimScrollDiv {
        height: calc(100vh - 105px);
        overflow: auto;
        -ms-overflow-style: none; /* Internet Explorer 10+ */
        scrollbar-width: none; /* Firefox */
}
.slimScrollDiv::-webkit-scrollbar {
        display: none; /* Safari and Chrome */
}

.table-responsive {
        /* box-shadow: 0 3px 3px -2px rgb(39 44 51 / 10%), 0 3px 4px 0 rgb(39 44 51 / 4%), 0 1px 8px 0 rgb(39 44 51 / 2%); */
        background-clip: border-box;
        border: 1px solid #dfe2e6;
        /* border-radius: 0.5rem; */
        background-color: #fff;
        overflow-x: visible;
}
.table-responsive p {
        margin-bottom: 0;
        color: rgba(39, 44, 51, 0.5);
}

.campTblSummary table tr td:nth-child(1) {
        width: 40%;
        font-weight: 600;
        color: #484848;
}

.card {
        background: #fbfbfb;
        border: 1px solid #dfe2e6;
        margin-bottom: 10px;
}

.card .card-header {
        border-bottom: unset !important;
}

.footer-pg {
        border-top: 1px solid #dfe2e6;
        padding: 10px 0px;
}

.footer-pg .pgCount {
        font-size: 12px;
        margin-right: 20px;
}

.form-check-input.select-all {
        width: 1rem;
        height: 1rem;
        position: relative;
        margin-left: 0;
        margin-top: 0;
        margin-right: 10px;
}

.page-separator {
        position: relative;
        color: #868e96;
        display: flex;
        align-items: center;
        justify-content: start;
        z-index: 0;
}

.page-separator:before {
        content: '';
        height: 1px;
        width: 100%;
        top: 50%;
        position: absolute;
        z-index: -1;
        background-color: rgba(0, 0, 0, 0.1);
}

.page-separator-integration {
        position: relative;
        color: #868e96;
        display: flex;
        align-items: center;
        justify-content: start;
        z-index: 0;
}

.configureModal .page-separator__text {
        align-items: center;
        position: relative;
        text-transform: capitalize;
        letter-spacing: 0px;
        font-size: 13px;
}

.configureModal .page-separator__text-integration {
        align-items: center;
        position: relative;
        text-transform: capitalize;
        letter-spacing: 0px;
        font-size: 13px;
}

.configureModal .dashinfoIcon {
        position: absolute;
        top: 0px;
        right: -12px;
        color: #b6b6b6;
}

.configureModal .fa-info-circle {
        font-size: 13px;
}

.page-separator__text {
        display: inline-flex;
        max-width: 90%;
        text-transform: uppercase;
        font-size: 12px;
        color: #303840;
        font-weight: 600;
        letter-spacing: 2px;
        border-radius: 0.25rem;
        background-color: #fff;
        padding-right: 0.5rem;
        line-height: 20px;
}

.page-separator__text-integration {
        font-size: 16px;
        color: #303840;
        font-weight: 600;
        line-height: 25px;
}

.form-label {
        color: #000000;
        font-size: 13px;
        font-weight: 600;
        margin-bottom: 0.5rem;
}

#coBranding .form-check-input {
        margin-left: 19px;
        margin-top: 10px;
}
#coBranding .form-check-label {
        margin-top: 28px;
}

.alert-soft-warning {
        background-color: rgba(228, 169, 60, 0.05);
        color: #e4a93c;
        border: 1px solid #f7e7c8;
        border-radius: 0.25rem;
}

.alert-soft-warning .text-black-100 {
        color: #272c33 !important;
}

.alert-soft-warning .flex {
        min-width: 180px;
        flex: 1 1 0% !important;
}
.alert-soft-warning .close {
        position: absolute;
        right: 10px;
        top: 2px;
}

.lcCardP {
        font-size: 0.8125rem;
        font-weight: 400;
        color: rgba(39, 44, 51, 0.7);
        margin-top: 10px;
}

.settings-Vsec {
        margin-top: 0px;
        margin-bottom: 18px;
}

.tfauth-wrap {
        margin-top: 20px;
        padding-top: 18px;
        border-top: 1px solid #cdd4da;
        position: relative;
        padding-bottom: 20px;
}

.tfauth-wrap .btn-primary {
        position: absolute;
        top: 45px;
        left: 0;
}

.settingTab .unsetBorder {
        border-top: unset;
        padding-top: 0px !important;
        padding-bottom: 26px;
}

.unsetBorder .btn-primary {
        top: 28px;
}

.form-group .url-l {
        width: 90px;
}

.form-group .url-r {
        width: calc(100% - 95px);
        margin-left: 5px;
}

.settings-Vsec .tabHeader .page-separator:before {
        content: unset;
}

.settings-Vsec .tabHeader .page-separator-integration:before {
        content: unset;
}

.settingTab {
        margin: unset !important;
}

.settingTab .lcCardP {
        margin-top: 0px !important;
        margin-bottom: 0px !important;
}

.settingTab .tabHeader {
        margin-bottom: 20px;
}

/* Select Dropdown Starts */
.selectDropdown label {
        font-weight: 600;
        color: #000;
        line-height: 0;
        margin-bottom: 0;
        margin-left: 8px;
}

/* Select Dropdown Ends */

/*********** Filter - Top Bar Starts ************/
.filter-wrapper {
        border-bottom: 1px solid rgba(72, 94, 144, 0.16) !important;
        padding: 0px 15px 0px 15px;
        background: white;
        height: 36px;
}

.filter-wrapperModal {
        border-top: 1px solid rgba(72, 94, 144, 0.16) !important;
        margin-bottom: 0;
}

.filter-wrapperModal .custom-select {
        background-color: #f6f6f6;
        color: #8a98ac;
        font-size: 12px;
        height: 2.1rem;
        border-top: 0;
        border-bottom: 0;
        border-radius: 0;
        margin: 0px 3px;
        width: 160px;
        cursor: pointer;
}

.filter-wrapperModal .custom-select:focus {
        border-color: #ced4da;
}

.filter-wrapper .btn:hover {
        background: #ececeb;
        border-radius: 0;
}

.filter-wrapper .searchBar {
        width: 140px;
        border-right: 1px solid rgba(72, 94, 144, 0.16) !important;
}

.filter-wrapper .btn-container .dropdown {
        display: inline-block;
}

.filter-wrapper .date-pick {
        border-radius: 0;
        width: 165px;
        height: 35px;
        padding: 0px 12px 0px 0px;
        font-size: 12px;
        border: 0;
        background: #f6f6f6;
        border-right: 1px solid rgba(72, 94, 144, 0.16) !important;
}

.filter-wrapper .date-pick-sm {
        width: 160px;
        padding: 0px 8px;
        height: 30px;
        font-size: 12px;
        border: 0.5px solid #ced4da;
        color: #737c83;
        border-radius: 5px;
}

.filter-wrapper .icon-actions {
        display: flex;
        align-items: center;
        margin-left: 15px;
        font-size: 16px;
}

.filter-wrapper .col-md-2 {
        -ms-flex: 0 0 18%;
        flex: 0 0 18%;
        max-width: 18%;
}

.breadcrumbbar .searchbar {
        display: inline-block;
        width: 198px;
        height: auto;
}
.game-library-searchbar .form-inline {
        flex-flow: unset;
}
.searchBar {
        height: calc(1.5em + 1rem + 1px);
        background: #f6f6f6;
        border-radius: 0;
        border: none;
        font-size: 12px;
        padding: 0px;
}

.searchBar:focus {
        background: #f6f6f6;
        border-radius: 0 0.25rem 0.25rem 0;
}

.searchIcon {
        background: #f6f6f6;
        padding: 7px 15px;
        border-left: 1px solid rgba(72, 94, 144, 0.16);
}

.bar_Icons {
        background: #f6f6f6;
        color: #000;
        padding: 6px 7px 5px 7px;
        border-radius: 51%;
        border: 1px solid #ced4db;
        margin-right: 5px;
        font-size: 11px;
}
.profilebar {
        margin-left: 6px;
}

.tooltip {
        font-size: 12px;
}
.language_wrap {
        background-color: #fff;
        border: 0.5px solid #ced4db;
        color: #737c83;
        height: 32px;
        width: 94px;
        border-radius: 10px;
        margin-right: 5px !important;
        padding: 7px 1px;
}

.filter-wrapper .form-row select {
        background-color: #fff;
        border: 0.5px solid #ced4db;
        text-transform: uppercase;
        font-size: 11px;
        font-weight: 600;
        color: #737c83;
        height: 35px;
}

.filter-wrapper .form-group {
        margin-bottom: 0;
}

.filter-wrapper .form-row .dropdown {
        display: inline-block;
        margin-right: 10px;
}
.filter-wrapper .form-row .dropdown:nth-last-child(1) {
        margin-right: 0px;
}

.filter-wrapper .form-row .text-muted {
        text-transform: uppercase;
        font-weight: 600;
}

.courses-tab .nav-link {
        background-color: white;
        color: #757575;
        text-transform: capitalize;
        font-size: 13px;
        padding: 8px 15px !important;
}

.courses-tab .nav-pills .nav-link.active {
        background: #f6f6f6;
        color: #1967d2;
        border-bottom: 2px solid #1967d2;
        border-radius: unset;
        padding-bottom: 5px;
}
.courses-tab .nav-pills .nav-link {
        line-height: 17px;
}

#addUser {
        display: none;
}

/* .rectbox .plan-details{
/* .rectbox .plan-details{
                width: 250px;
                min-height: 100px;
            }

            .companyLogo .sqrtbox .plan-details{
                width: 145px;
                min-height: 145px;
            } */

/* .companyLogo .plan-details{
/* .companyLogo .plan-details{
                border: 2px dotted #e1e5ed;
            } */

/* .companyLogo .campaignCard h3{
/* .companyLogo .campaignCard h3{
                margin-bottom: 0px !important;
            }  */

.companyLogo .campaignCard h3 {
        font-size: 13px;
        color: #495057;
        font-weight: 400;
}

.custameLogo .custom-file-label {
        bottom: 0px !important;
        top: unset;
        width: 100%;
        position: unset;
        border: 1px solid #ced4da;
}

.custameLogo .custom-file-label::after {
        top: 23px;
}

/************ Filter - Top Bar Ends ************/

/************** IAM Table Starts *************/
.iAmTable .dataTables_wrapper {
        padding: 0;
}

.iAmTable .dataTables_wrapper .col-sm-12.col-md-5,
.iAmTable .dataTables_wrapper .col-sm-12.col-md-7 {
        border-top: 1px solid #dfe2e6;
        padding: 10px 15px;
        padding-left: 15px !important;
        padding-right: 15px !important;
}

.iAmTable .dataTables_wrapper .col-sm-12.col-md-5 {
        display: flex;
        align-items: center;
}

.iAmTable .dataTables_wrapper .dataTables_info {
        padding: 0;
}

.iAmTable .dataTables_wrapper .col-sm-12.col-md-6 {
        padding: 20px 15px 0px 15px !important;
}
/************** IAM Table Ends *************/

/************** TAB Content Starts *************/
.course-section .tab-content {
        padding: 20px 0px;
}
.course-section .nav-tabs .nav-link {
        border-radius: 0;
        border: none;
        padding: 1rem 1rem;
}

.course-section .nav-tabs .nav-link.active {
        color: #5c80bc;
        background-color: #ffffff;
        border-left: 5px solid #5c80bc !important;
}

.course-section .nav-tabs .nav-item {
        box-shadow: 5px 5px 10px #d9d9d9;
}

.course-section .nav-tabs .nav-link.disabled {
        color: rgba(39, 44, 51, 0.5);
}

/************** TAB Content Ends *************/

/************** Create Course Starts *************/

.tab_content_course .course-card .course-block {
        background-color: #fff;
        background-clip: border-box;
        border: 1px solid #dfe2e6;
        border-radius: 0.5rem;
        margin-bottom: 1.5rem;
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        padding: 20px;
}

.tab_content_course .course-card .course-block .sectionTitle {
        border-bottom: 1px solid #ced4da;
        padding-bottom: 10px;
}

.tab_content_course .course-card .course-block .courseActions {
        float: right;
}

.tab_content_course .course-card .course-block a {
        color: #303840;
}

.tab_content_course .course-card .editableClass {
        background: #f8f9fc;
        padding: 20px;
        border-radius: 5px;
        margin-bottom: 20px;
        margin-top: 5px;
}

.tab_content_course .course-card .lecture-box {
        border-radius: 5px;
        margin-bottom: 20px;
        background: #f8f9fc;
        padding: 15px 15px;
}

.tab_content_course .course-card .lecture-box .editableClass {
        padding: 20px 0px;
}

.tab_content_course .course-card .section-num,
.tab_content_course .course-card .lecture-num {
        color: rgba(39, 44, 51, 0.5);
        text-transform: uppercase;
        font-size: 0.8125rem;
        font-weight: 600;
}

.tab_content_course .course-card .lecture-num.active {
        color: #303840;
}

/************** Create Course Ends *************/

/*  Create Course Curriculam Drag Css Start*/

/* dragSectionWrap */
/* dragSectionWrap */

/* .btn-link {
/* .btn-link {
                display: flex;
                justify-content: space-between;
                align-items: center;
                width: 100%;
                text-align: left;
                } */

.arrow-icon {
        transition: transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
        transform: rotate(0deg);
        display: inline-block;
}
.arrow-icon.rotate {
        transform: rotate(90deg);
}

.dragSectionWrap .course-card .accordionBox {
        background-color: #fff;
        background-clip: border-box;
        border: 1px solid #dfe2e6;
        border-radius: 0.5rem;
        margin-bottom: 1.5rem;
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        padding: 15px;
        width: 100%;
}

.dragSectionWrap .course-card .section-num,
.tab_content_course .course-card .lecture-num {
        color: rgba(39, 44, 51, 0.5);
        text-transform: uppercase;
        font-size: 12px;
}

.dragSectionWrap .section_name_new {
        color: #000;
        font-size: 12px;
}

.dragSectionWrap .course-card .course-block-div .courseActions {
        float: right;
}

.dragSectionWrap .course-card .course-block-div a {
        color: #303840;
        font-size: 12px;
}

.dragSectionWrap .course-card .course-block-div .sectionTitle {
        border-bottom: unset;
        display: flex;
        align-items: center;
        justify-content: space-between;
}

.leftsectionToggle {
        width: 80%;
}

.dragSectionWrap .card-header {
        padding: 0px;
        border-bottom: unset !important;
}

.dragSectionWrap .course-card .lecture-box {
        border: 1px solid #dfe2e6;
        margin-bottom: 10px;
        width: 100%;
}

.dragSectionWrap .cardBody {
        padding: 15px 20px 0px 0px !important;
}

.dragSectionWrap .cardBody .dFlex {
        display: flex;
        align-items: center;
}

.dragSectionWrap .cardBody .lecture_commmon {
        width: 100%;
}

.dragSectionWrap .marginRight {
        margin: 20px 12px 0px 0px;
        cursor: pointer;
}

.course-block-div {
        display: flex;
}

.dragSectionWrap .card-header {
        cursor: pointer;
}

.lecture_sortable {
        cursor: pointer;
}
/*  Create Course Curriculam Css End */

.selectionModal .modal-dialog {
        width: 900px !important;
}

/* Coourses List Grid Starts */
.box-grid-container {
        position: relative;
        margin-top: 20x;
}

.courseCards .card-body {
        padding: 0.625rem 0.75rem;
}
.courseCards .col-sm-3,
.courseCards .col-md-3 {
        flex: 0 0 20%;
        max-width: 20%;
}

.courseCards .col-sm-3,
.videoCards .col-md-3 {
        margin-bottom: 15px;
}

.courseCards .content_store_heading h5 {
        font-size: 12px;
        display: -webkit-box !important;
        line-clamp: 1;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        white-space: normal;
        font-weight: 600;
        margin-bottom: 7px;
}

.courseCards .card-footer {
        padding: 0.425rem 0.75rem;
}

.courseCards .heading_cur .bgStatus {
        font-size: 12px;
        font-weight: 600;
}

/* Courses List Grid Starts */
/* Courses List Grid Starts */

.infographic-list .img-overlay img {
        height: 305px;
        width: 100%;
        object-fit: cover;
        object-position: top;
}

.infographic-list .tooltip {
        pointer-events: all !important;
}
.infographic-list .prBtn {
        font-size: 12px;
        font-weight: 600;
}

.WModal .modal-content {
        width: 100% !important;
}

.creativeModal .modal-dialog {
        margin: 0 auto;
}
.creativeModal .modal-content {
        width: 700px;
        position: relative;
        top: 0;
        margin: auto;
}

.creativeModal .creativeWrapper {
        overflow: auto;
        height: calc(100vh - 65px);
}

.creativeModal .creativeWrapper img {
        width: 100%;
}

.creativeModal .modal-header {
        padding: 0px;
        background: #fff;
        margin-top: 20px;
        padding-bottom: 15px;
        margin-bottom: 5px !important;
        display: block;
        border: none;
}

.creativeModal .modal-header .dataBlock {
        font-size: 13px;
}

.creativeModal .modal-title {
        color: #fff;
        font-size: 14px;
        background: #0e2954;
        padding: 5px 15px;
        border-radius: 0px 0px 10px 0px;
}

.creativeModal .modal-header .close {
        color: #fff;
        margin: 6px 5px 0px 0px;
        font-size: 15px;
        background: #0e2954;
        opacity: 1;
        padding: 4px 9px 6px 9px;
        border-radius: 22px;
}
.gameModalWrap .gameCard img {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        width: 100%;
        border-bottom: 1px solid #e1e5ee;
}

.gameModalWrap .gameCard {
        background: rgb(247 247 247);
        height: auto;
        border-radius: 5px;
}

.gameModalWrap .gameCard .gameName h5 {
        text-align: center;
        font-size: 11px;
        font-weight: 500;
        margin-bottom: 0px;
        padding: 7px 0px;
}

.gameModalWrap .gamemodalDialog {
        width: 900px !important;
}

.gameSubModalBody {
        width: 100%;
        height: calc(100vh - 98px);
        overflow-x: hidden;
}
.game-banner {
        display: flex;
        flex-direction: column;
        min-height: 100vh;
}
.game-banner iframe {
        flex-grow: 1;
}

.gameWrapper .game-banner {
        overflow: auto;
        width: 1000px !important;
        margin: auto;
        height: unset !important;
}

.gameWrapper {
        overflow-y: hidden !important;
        height: 100% !important;
        background: #eaeaea !important;
        max-height: 84vh;
}

#gameSubModalBody {
        padding-bottom: 0 !important;
}

.game_wrapper .gameCard {
        background: rgb(247 247 247);
        height: auto;
        border-radius: 5px;
        border: 1px solid #e1e5ee;
        margin-bottom: 10px;
}

.game_wrapper .gameCard img {
        border-top-left-radius: 5px;
        border-top-right-radius: 5px;
        width: 100%;
        height: 273px;
        object-fit: cover;
}

.game_wrapper .gameCard .content {
        position: absolute;
        bottom: 0;
        width: 100%;
        word-break: break-word;
}

.game_wrapper .gameCard .setimgHeight {
        position: relative;
}

.game_wrapper .game-card-footer .content h5 {
        text-align: center;
        font-size: 12px;
        font-weight: 500;
        margin-bottom: 0px;
        padding: 10px;
        background-color: #00000094;
        color: #ffffff;
        line-height: 17px;
}

.fullscreenIcon {
        position: absolute;
        right: 10px;
        top: 20%;
        z-index: 99999;
}

.fullscreenIcon .ti-fullscreen {
        background: white;
        border-radius: 50px;
        padding: 10px;
        font-size: 12px;
}

.fullscreeniconTop {
        top: 20px;
}

.game-fullscreen {
        position: absolute;
        top: 0;
        left: 0;
        bottom: 0;
        z-index: 10000;
        height: 100vh;
        width: 100%;
}

.announcModal {
        padding-top: 30px;
}

.announcModal .modal-content {
        width: 90% !important;
        border-radius: 15px 15px 0px 0px;
        height: calc(100vh - 30px);
        overflow: auto;
        position: relative;
}

.announcModal .modal-body {
        width: 800px !important;
        margin: 0 auto;
}

.vModal .modal-body {
        width: 1000px !important;
}

.miniIcons {
        font-size: 13px;
        cursor: pointer;
}

.announcModal .creativeWrapper {
        height: unset;
        overflow: unset;
}
.table-responsives {
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        background-clip: border-box;
        border: 1px solid #dfe2e6;
        border-radius: 0.5rem;
        background-color: #fff;
}
.hideReminderOption {
        cursor: not-allowed !important;
        opacity: 0.3;
}
.announcModal .close {
        color: #fff;
        margin: 6px 5px 0px 0px;
        font-size: 15px;
        background: #0e2954;
        opacity: 1;
        padding: 4px 9px 6px 9px;
        border-radius: 22px;
        position: absolute;
        right: 10px;
        top: 10px;
}

/* Question Bank Starts */
/* Question Bank Starts */

.questionBank_wrap {
        width: 100%;
}

.questionBank_wrap .heading_question .headn_main {
        margin-top: 20px;
}

.questionBank_wrap .qSet {
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
        background: white;
        padding: 10px;
}

.questionBank_wrap .border_btm_questionbank {
        border-bottom: 1px solid #f1f1f1;
        padding: 15px;
}

.questionBank_wrap .quesTitle {
        font-size: 14px;
        color: #303840;
        line-height: 1.5;
}

.questionBank_wrap .questionbank_set_wrap ol li {
        font-size: 0.8125rem;
        font-weight: 400;
        color: rgba(39, 44, 51, 0.7);
}

.questionBank_wrap .qgroup {
        /* box-shadow: 0 3px 3px -2px rgb(39 44 51 / 10%), 0 3px 4px 0 rgb(39 44 51 / 4%), 0 1px 8px 0 rgb(39 44 51 / 2%);
                background: white; */
        padding: 0px 15px;
}

.questionBank_wrap .question_groups_wrap {
        padding: 15px 10px;
        position: relative;
        background: #ececeb;
        margin-bottom: 0;
}

.questionBank_wrap .ul_drop {
        position: absolute;
        right: 0;
        background: #fff;
        top: 36px;
        width: 118px;
        z-index: 2;
        box-shadow:
                0 5px 5px -3px rgb(39 44 51 / 10%),
                0 8px 10px 1px rgb(39 44 51 / 4%),
                0 3px 14px 2px rgb(39 44 51 / 2%);
        background-color: #ffffff;
        font-size: 13px;
}

.questionBank_wrap .ul_drop li {
        padding: 0.5rem 1rem;
        color: #8a98ac;
}

.questionBank_wrap .ul_drop li:hover {
        color: #373a4d;
        background-color: rgba(129, 167, 205, 0.1);
}

.questionBank_wrap .icon_drop,
.questionBank_wrap .ti-check-box,
.questionBank_wrap .ti-download {
        padding: 2px 8px;
        position: absolute;
        top: 50%;
        right: 7px;
        transform: translateY(-50%);
}

.questionBank_wrap .ti-check-box {
        color: greenyellow;
}

/* .questionBank_wrap .ti-download {
/* .questionBank_wrap .ti-download {
                color: greenyellow;
            } */

.count_wrap {
        position: absolute;
        left: 50%;
        top: 50%;
        transform: translate(-50%, -50%);
}
.wrap_count_div {
        position: relative;
        display: inline-block;
        width: 50px;
}

/* Question Bank Ends */

/* Edit Template Section Starts */
.edtempContent,
.edtempPreview {
        /* box-shadow: 0 3px 3px -2px rgb(39 44 51 / 10%), 0 3px 4px 0 rgb(39 44 51 / 4%), 0 1px 8px 0 rgb(39 44 51 / 2%); */
        background-clip: border-box;
        /* border: 1px solid #dfe2e6; */
        border-radius: 0.5rem;
        background-color: #fff;
        padding: 20px;
        height: 77vh;
        overflow: scroll;
}

/* Edit Template Section Ends */

/***************************
            Course Preview Starts 
            ************************/
.coursePreview {
        height: calc(100vh - 195px);
        overflow: hidden;
}

.coursePreview .leftSection {
        overflow: auto;
        border-right: 1px solid rgba(0, 0, 0, 0.1);
        padding: 15px;
        flex: 0 0 73%;
        max-width: 73%;
}

.coursePreview .rightSection {
        flex: 0 0 27%;
        max-width: 27%;
}

.coursePreview .leftSection .page-separator {
        margin-bottom: 15px;
}

.coursePreview .leftSection .page-separator-integration {
        margin-bottom: 15px;
}

.coursePreview .leftSection .list-unstyled {
        line-height: 30px;
}

.coursePreview .leftSection .list-unstyled .infoCourse {
        margin-left: 5px;
        font-weight: 600;
}

.coursePreview .rightSection {
        padding: 0;
        border-right: 1px solid rgba(0, 0, 0, 0.1);
}

.coursePreview .mainWrap {
        margin: 0;
        padding: 0;
}

.coursePreview .rightSection .secHead {
        border-bottom: 1px solid rgba(72, 94, 144, 0.16);
        padding: 12px;
        text-transform: uppercase;
        font-weight: 600;
        letter-spacing: 2px;
}

.coursePreview .rightSection .contentTable {
        background-color: #fff;
        background-clip: border-box;
        border-radius: 0.5rem;
        height: calc(100vh - 195px);
        overflow: auto;
        border-top: none;
        padding: 10px;
}

.coursePreview .rightSection .card-header {
        cursor: pointer;
        padding: 7px 15px 18px 10px;
        display: flex;
        align-items: center;
        justify-content: space-between;
}

.coursePreview .rightSection .count {
        background: #e4e4e4;
        padding: 4px 10px;
        font-size: 11px;
        border-radius: 5px;
        margin-right: 11px;
}

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

.coursePreview .rightSection .card-header h5 {
        font-size: 0.8125rem;
        color: #272c33;
}

.coursePreview .rightSection .list-group-item {
        cursor: pointer;
        border-radius: 0;
        background: #fff;
        border: none;
        padding: 7px 0px 16px 16px;
        margin-bottom: 0px;
        display: flex;
        align-items: center;
}
.coursePreview .rightSection .lecWrapper {
        font-size: 0.8125rem;
        background: #eaeaea;
}

.coursePreview .rightSection .lecWrapper .wrapTop img {
        height: 32px;
        margin-right: 10px;
}

.coursePreview .rightSection .descIcon {
        position: absolute;
        right: 0;
        top: 5px;
}

.coursePreview .rightSection .list-group-item.active {
        border: unset !important;
        border-radius: 0px !important;
        background-color: #f3f3f3 !important;
        border-left: 4px solid #1f51b3 !important;
        padding-left: 12px;
}

.coursePreview .rightSection .wrapTop .check-circle {
        width: 15px;
        height: 15px;
        color: white;
        border: none;
        display: flex;
        font-size: 10px;
        border-radius: 50%;
        align-items: center;
        justify-content: center;
}

.coursePreview .rightSection .wrapTop .check-bg-color-circle {
        background: #28a745 !important;
}

.coursePreview .rightSection .wrapTop .check-bg-none-circle {
        border: 1px solid #e1e3eb;
        background: white;
}

.ti-angle-down::before {
        color: #000000;
        font-size: 10px;
}

.coursePreview .rightSection .list-group-item .lecTimer {
        font-size: 10px;
        color: #000;
        margin-top: 3px;
}

.coursePreview .rightSection .list-group-item .lecTitle {
        font-size: 12px;
        color: #000;
        margin-bottom: 8px;
        display: block;
}

.coursePreview .rightSection .list-group-item .lecTimer .duration {
        border-left: 1px solid rgba(72, 94, 144, 0.16);
        padding-left: 6px;
        margin-left: 4px;
}

.coursePreview .rightSection .list-group-item .lecTimer .lecStats span {
        margin-top: 5px;
}

.coursePreview .rightSection .list-group-item .completion {
        color: #4a9b2e;
        width: 50%;
}

.coursePreview .rightSection .list-group-item .wrapBottom {
        width: 100%;
}

.cur_upperSection .horizontal-Card .colRightspace .rightData {
        gap: unset !important;
}

/* Leaderboard Modal Css Start */

.leaderboard-modal-wrapper .set-width-modal {
        position: relative;
        width: 500px !important;
        overflow: auto;
}

.leaderboard-modal-wrapper .modal_close {
        position: absolute;
        right: 10px;
        top: 20px;
}

.leaderboard-modal-wrapper .modal_close .close {
        color: white;
        border: 1px solid #82afff;
        border-radius: 50px;
        width: 25px;
        height: 25px;
        font-size: 16px;
        opacity: 1;
        font-weight: 100;
}

.leaderboard-modal-wrapper .modal-top-header {
        padding: 20px;
        text-align: center;
        background: linear-gradient(180deg, #1967d2 0%, #183994 100%);
}

.leaderboard-modal-wrapper .modal-top-header .modal-title {
        color: #fff;
        font-size: 16px;
        margin-bottom: 25px;
        font-weight: 600;
}

.leaderboard-modal-wrapper .user-profile .common-circle {
        margin-bottom: 10px;
}

.leaderboard-modal-wrapper .user-name h5 {
        color: #fff;
        font-size: 13px !important;
        font-weight: 500;
        margin-bottom: 0px;
}

.leaderboard-modal-wrapper .user-profile .user-name p {
        font-size: 12px !important;
        color: #f7f7f7;
}

.leaderboard-modal-wrapper .user-profile .user-name .user-rank {
        margin-top: 10px;
        display: flex;
        align-items: center;
        text-align: center;
        justify-content: center;
}

.leaderboard-modal-wrapper .user-profile .user-name .user-rank h6 {
        color: #fff;
        font-size: 12px !important;
        margin-bottom: 0px;
}

.leaderboard-modal-wrapper .user-profile .user-name .user-rank span {
        font-weight: 600;
        color: #fff;
}

.leaderboard-modal-wrapper .user-name .rightBorder {
        border-right: 1px solid #fffbfb;
        padding-right: 10px;
        margin-right: 10px;
}

.leaderboard-modal-body {
        overflow-x: hidden;
        height: calc(100vh - 265px);
}

.leaderboard-modal-body .rankings-table-data {
        margin-top: unset !important;
        padding: 0px !important;
        border: unset !important;
        background-color: unset !important;
        overflow: visible !important;
}

.leaderboard-modal-body .rankings-table-data .table tbody {
        height: auto !important;
}

/* Leaderboard Modal Css End */

/***************************
            Course Preview Ends 
            ************************/

.courseListCr .card-header {
        padding: 5px 10px;
        background-clip: border-box;
        border: 1px solid #dfe2e6;
        border-radius: 0.5rem !important;
        margin-bottom: 5px !important;
        box-shadow:
                0 3px 3px -2px rgb(39 44 51 / 10%),
                0 3px 4px 0 rgb(39 44 51 / 4%),
                0 1px 8px 0 rgb(39 44 51 / 2%);
}

.courseListCr .card-header h2 {
        line-height: 0;
}

.courseListCr .card-body {
        padding-top: 5px;
}

.courseListCr .btn-link {
        font-size: 14px;
        color: #0e2954;
        width: 100%;
        text-align: left;
}

.menuDrop {
        display: flex;
        align-items: center;
}
.menuDrop span {
        margin-right: 8px;
}

.sbheading {
        color: #fff;
        padding-left: 22px;
        line-height: 15px;
        width: 100%;
        display: block;
        font-size: 10px;
        margin-top: 10px;
        text-transform: uppercase;
        font-weight: 600;
        margin-bottom: 8px;
}

.bannerCards {
        width: 23%;
        height: 180px;
        padding: 20px;
        border-radius: 15px;
        margin: 0px 5px;
        display: flex;
        align-items: center;
}

.bannerCards .bannerTitle {
        font-size: 15px;
        color: #fff;
        margin-top: 10px;
        font-weight: 500;
        font-family: 'Source Sans Pro', sans-serif;
}

.bannerCards a {
        color: #fff;
        font-size: 13px;
}

.bannerCards .tIcons {
        font-size: 40px;
        color: #fff;
}

.bannerCards.b1 {
        background: #ff9f1c;
}

.bannerCards.b2 {
        background: #ad343e;
}

.bannerCards.b3 {
        background: #16697a;
}

.progress_disabled,
.failed_disabled {
        position: absolute;
        height: 100%;
        width: 100%;
        background: #000000b0;
        z-index: 10;
        text-align: center;
        padding: 10px;
}

.progress_disabled p,
.failed_disabled p {
        color: #fff;
        margin-top: 50%;
        text-align: center;
}
.bannerCards.b4 {
        background: #119da4;
}

.rCamCard .table-responsive {
        border-radius: 0;
}

.pdf-canvas-navigation {
        display: flex;
        list-style: none;
        gap: 10px;
        width: 100%;
        padding-top: 15px;
        padding-bottom: 15px;
        border-top: 1px solid rgba(72, 94, 144, 0.16);
        border-bottom: 1px solid rgba(72, 94, 144, 0.16);
}

.btn-z-index {
        z-index: 2;
}

.element-loader-container {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 2;
        display: flex;
        justify-content: center;
        align-items: center;
}
.element-loader-container-v2 {
        position: absolute;
        width: 100%;
        height: 100%;
        z-index: 2;
        display: flex;
        justify-content: center;
        align-items: center;
        background-color: black;
        opacity: 0.5;
}

.max-width-fix-content {
        max-width: fit-content;
}

.element-loader-colorize {
        background-color: rgba(0, 0, 0, 0.15);
        color: rgb(33, 37, 41);
}

.position-relative {
        position: relative;
}

.course-analytics-count-container {
        position: relative;
        padding-right: 10px;
        padding-top: 10px;
        padding-bottom: 10px;
}
.progressText {
        font-size: 13px;
        margin-bottom: 0px;
        padding: 15px 0px;
        color: #081c3d;
        font-weight: 500;
}
.userList {
        font-weight: 600;
        padding-left: 0;
        line-height: 26px;
        list-style-type: none;
        font-size: 13px;
}
.departmentList th {
        padding: 7px 10px;
}
.departmentList td {
        padding: 7px 10px;
}
/* .uploadFile input[type="file"] {
                cursor: pointer !important;
                display: block;
                font-size: 999px;
                min-height: 100%;
                min-width: 100%;
                opacity: 1;
                position: absolute;
                right: 0px;
                text-align: right;
                top: 0px;
                z-index: 1;
            } */

/* ***************** CO Branding ***************** */

.topleft.logoRect {
        position: absolute;
        display: block;
        height: 40px;
        left: 25px;
        top: 25px;
}

.topmiddle.logoRect {
        position: absolute;
        display: block;
        height: 40px;
        left: 0px;
        right: 0px;
        top: 15px;
        margin-left: auto;
        margin-right: auto;
}

.topright.logoRect {
        position: absolute;
        display: block;
        height: 40px;
        right: 25px;
        top: 25px;
}

.topleft.logoSqr {
        position: absolute;
        display: block;
        height: 60px;
        left: 25px;
        top: 25px;
}

.topmiddle.logoSqr {
        position: absolute;
        display: block;
        height: 60px;
        left: 0px;
        right: 0px;
        top: 15px;
        margin-left: auto;
        margin-right: auto;
}

.topright.logoSqr {
        position: absolute;
        display: block;
        height: 60px;
        right: 25px;
        top: 25px;
}

@media screen and (min-width: 400px) and (max-width: 1500px) {
        .logoRect.topleft-big {
                position: absolute;
                display: block;
                height: 3.2rem;
                left: 30px;
                top: 60px;
        }

        .logoRect.topmiddle-big {
                position: absolute;
                display: block;
                height: 3.2rem;
                left: 0px;
                right: 0px;
                top: 60px;
                margin-left: auto;
                margin-right: auto;
        }

        .logoRect.topright-big {
                position: absolute;
                display: block;
                height: 3.2rem;
                right: 30px;
                top: 60px;
        }

        .logoSqr.topleft-big {
                position: absolute;
                display: block;
                height: 5rem;
                left: 30px;
                top: 60px;
        }

        .logoSqr.topmiddle-big {
                position: absolute;
                display: block;
                height: 5rem;
                left: 0px;
                right: 0px;
                top: 60px;
                margin-left: auto;
                margin-right: auto;
        }

        .logoSqr.topright-big {
                position: absolute;
                display: block;
                height: 5rem;
                right: 30px;
                top: 60px;
        }
}

@media screen and (min-width: 1501px) {
        .logoRect.topleft-big,
        .logoSqr.topleft-big {
                position: absolute;
                display: block;
                height: 3.2rem;
                left: 30px;
                top: 30px;
        }

        .logoRect.topmiddle-big {
                position: absolute;
                display: block;
                height: 3.2rem;
                left: 0px;
                right: 0px;
                top: 30px;
                margin-left: auto;
                margin-right: auto;
        }

        .logoSqr.topmiddle-big {
                position: absolute;
                display: block;
                height: 5rem;
                left: 0px;
                right: 0px;
                top: 60px;
                margin-left: auto;
                margin-right: auto;
        }

        .logoRect.topright-big,
        .logoSqr.topright-big {
                position: absolute;
                display: block;
                height: 3.2rem;
                right: 30px;
                top: 30px;
        }
}

.video-upload-wrapper .custom-file-label::after {
        content: '';
        background: transparent;
}

#videoFile:disabled {
        background: transparent;
        text-decoration: none;
        opacity: 0;
}

.input-video-file {
        border-bottom: 1.5px solid #ced4da;
}

.preview-video-modal {
        background: rgba(0, 0, 0, 0.8);
        position: fixed;
        bottom: 0;
        top: 0;
        right: 0;
        left: 0;
        opacity: 0;
        pointer-events: none;
        -webkit-transition: opacity 400ms ease-in;
        -moz-transition: opacity 400ms ease-in;
        transition: opacity 400ms ease-in;
        z-index: -1;
        display: none;
}

.preview-video-modal:target {
        display: block;
        opacity: 1;
        pointer-events: auto;
        z-index: 99999;
}

.preview-video-modal .preview-video-modal-content {
        position: relative;
        width: 80%;
        background-color: white;
        height: auto;
        position: relative;
        margin: 0 auto;
        /** padding: 3em; **/
        /** overflow-y: scroll; **/
        -webkit-overflow-scrolling: touch;
        border-radius: 5px;
}

@media (min-width: 60em) {
        .preview-video-modal .preview-video-modal-content {
                position: relative;
                /** width: 80%; **/
                width: 80%;
                height: auto;
                margin: 3% auto;
                max-height: 57em;
                max-width: 66em;
                border-radius: 5px;
        }
}

.preview-video-modal-content #preview-video {
        border-radius: 5px;
}

.preview-video-modal .close {
        background-color: white;
        color: black;
        font-size: 24px;
        padding: 6px 9px;
        position: absolute;
        right: 0;
        text-align: center;
        text-decoration: none;
        top: 0;
        z-index: 1;
        border-radius: 0px 6px;
        backdrop-filter: blur(18px);
        box-shadow: rgb(0 0 0 / 25%) 0px 25px 50px;
        box-shadow: rgb(0 0 0 / 35%) 0px 5px 15px;
}

.vid_duration {
        position: absolute;
        right: 6px;
        bottom: 38px;
        font-size: 11px;
        background: #0000007a;
        color: #ffffff;
        border-radius: 5px;
        padding: 2px 8px;
        font-weight: 600;
}

.language_type {
        position: absolute;
        left: 6px;
        bottom: 38px;
        font-size: 11px;
        background: #13338eb3;
        color: #ffffff;
        border-radius: 5px;
        padding: 2px 8px;
        font-weight: 600;
}

.wallpaper-upload-wrapper .custom-file-label::after {
        content: '';
        background: transparent;
}

#wallpaperFile:disabled {
        background: transparent;
        text-decoration: none;
        opacity: 0;
}

.input-wallpaper-file {
        border-bottom: 1.5px solid #ced4da;
}

.preview-wallpaper-modal {
        background: rgba(0, 0, 0, 0.8);
        position: fixed;
        bottom: 0;
        top: 0;
        right: 0;
        left: 0;
        opacity: 0;
        pointer-events: none;
        -webkit-transition: opacity 400ms ease-in;
        -moz-transition: opacity 400ms ease-in;
        transition: opacity 400ms ease-in;
        z-index: -1;
        display: none;
}

.preview-wallpaper-modal:target {
        display: block;
        opacity: 1;
        pointer-events: auto;
        z-index: 99999;
}

.preview-wallpaper-modal .preview-wallpaper-modal-content {
        background-color: white;
        height: auto;
        position: relative;
        margin: 0 auto;
        /** padding: 3em; **/
        /** overflow-y: scroll; **/
        -webkit-overflow-scrolling: touch;
        border-radius: 5px;
}

@media (min-width: 60em) {
        .preview-wallpaper-modal .preview-wallpaper-modal-content {
                width: 80%;
                height: auto;
                margin: 3% auto;
                max-height: 57em;
                max-width: 66em;
                border-radius: 5px;
        }
}

.preview-wallpaper-modal .close {
        background-color: turquoise;
        color: white;
        font-size: 24px;
        padding: 8px 12px;
        position: absolute;
        right: 0;
        text-align: center;
        text-decoration: none;
        top: 0;
        z-index: 1;
}

.btn-trans-success {
        color: #0a3622;
}

.btn-trans-success:hover {
        background: #d1e7dd;
        color: #0a3622;
}

.btn-trans {
        color: #0049b0;
        text-transform: uppercase;
        font-size: 11.5px;
        font-weight: 600;
}

.btn-trans:hover {
        color: #0049b0;
        background: #0049b129;
}

.btnSuccessLight {
        background: #d1e7dd;
        color: #0a3622;
        text-transform: uppercase;
        font-size: 11.5px;
        font-weight: 600;
}

.btnConfigure {
        background-color: #f6cfcf;
        color: #d30d0d;
        font-size: 11.5px;
        font-weight: 600;
}

.btnConfigure:hover {
        background-color: #f6cfcf;
        color: #d30d0d;
}

.btn-transDrop {
        font-size: 13px;
        display: flex;
        align-items: center;
}

.txtInfo {
        font-size: 12px;
        margin-left: 5px;
        color: #7f8080;
}

.cloneBtn {
        font-size: 12px;
        cursor: not-allowed;
}

.cloneBtn .spinner-border {
        margin-right: 10px;
        width: 1rem;
        height: 1rem;
}

.courseCards .wpCard {
        flex: 0 0 25% !important;
        max-width: 25% !important;
}

/* Creative css page */
/* Creative css page */

.custom-slider {
        overflow-y: hidden;
}

.custom-slider .swiper-slide {
        margin: 0 !important;
        padding-left: 0 !important;
        flex-shrink: 0;
        margin-right: 5px !important;
        /* width: 228px !important;  */
}

.creativeBlock {
        margin-bottom: 1rem;
}

.creativeBlock .creativeHeader {
        margin-bottom: 10px;
}
.creativeBlock .crLink {
        font-size: 12px;
        margin-left: 10px;
        font-weight: 600;
        text-decoration: underline;
}
.creativeBlock .creativeHeader .prev-btZn,
.creativeBlock .creativeHeader .next-btn {
        font-size: 20px;
        padding: 0px 6px;
        cursor: pointer;
        color: #000000;
}

.creativeBlock .creativeHeader .btn:disabled {
        opacity: 0.25;
}
.creativeBlock .creativeHeader .heading {
        font-size: 16px;
        color: #343435;
        display: inline;
        border-radius: 10px;
        font-weight: 700;
}

.swiper-wrapper {
        position: relative;
        width: 100%;
        height: 100%;
        z-index: 1;
        display: flex;
        transition-property: transform;
        transition-timing-function: var(
                --swiper-wrapper-transition-timing-function,
                initial
        );
        box-sizing: content-box;
}

.swiper-wrapper .img-overlay img,
.infographic-list .img-overlay img {
        border: 0.5px solid #d0d0d0;
        border-radius: 5px;
}

.common-nex-prev-btn {
        font-size: 20px;
        padding: 0px 6px;
        cursor: pointer;
        color: #000000;
}

/* tooltip */
.grid_view_card .img-overlay .tooltip {
        background: #3a4557b0;
        border-radius: 5px;
        height: 304px !important;
        color: #fff;
        display: block;
        opacity: 0;
        padding: 15px;
        position: absolute;
        visibility: hidden;
        width: 100%;
        height: 100%;
        z-index: 9999;
        -webkit-transition: all 0.25s ease-out;
        -moz-transition: all 0.25s ease-out;
        -ms-transition: all 0.25s ease-out;
        -o-transition: all 0.25s ease-out;
        transition: all 0.25s ease-out;
        -webkit-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
        -moz-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
        -ms-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
        -o-box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
        box-shadow: 2px 2px 6px rgba(0, 0, 0, 0.28);
}

.grid_view_card .img-overlay:hover .tooltip {
        opacity: 1;
        visibility: visible;
        -webkit-transform: translateX(0px) translateY(0px) !important;
        -moz-transform: translateX(0px) translateY(0px) !important;
        -ms-transform: translateX(0px) translateY(0px) !important;
        -o-transform: translateX(0px) translateY(0px) !important;
        transform: translateX(0px) translateY(0px) !important;
        height: 304px;
}

.overlayTooltip .heading {
        font-weight: 500;
        font-size: 14px;
        color: #fff;
        line-height: 20px;
        padding-bottom: 5px;
        border-bottom: 0.5px solid #ffffff8f;
        text-transform: uppercase;
}

.swiper-wrapper::-webkit-scrollbar,
.custom-slider::-webkit-scrollbar {
        display: none;
}

.swiper-wrapper .tooltip {
        pointer-events: all !important;
}

.swiper-wrapper .overlayTooltip .description {
        color: #fff;
        font-size: 11px;
        font-weight: 300;
        line-height: 15px;
}

.videoCards .course_img_store {
        height: 160px;
        border-radius: 10px;
        margin-bottom: 8px;
        border: 0.5px solid #d0d0d0;
}

.videoCards .col-sm-3 {
        flex: 0 0 25%;
        max-width: 25%;
        margin-bottom: 20px;
}

.videoCards a {
        width: 100%;
        position: relative;
        color: unset;
}

.videoCards .imgWrap {
        position: relative;
        display: flex;
        align-items: center;
        justify-content: center;
}

.videoCards .ti-video {
        position: absolute;
        left: 10px;
        top: 10px;
}

.videoCards .ti-video i {
        background-color: rgba(25, 27, 38, 0.5);
        color: #fff;
        border-radius: 5px;
        font-size: 10px;
        padding: 5px;
}

.videoCards .content {
        padding: 0px 10px;
        position: relative;
}
.videoCards .content h5 {
        font-size: 14px;
        display: -webkit-box !important;
        line-clamp: 1;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        line-height: 22px;
        width: 75%;
}

.animatedBtn {
        display: flex;
        justify-content: center;
        align-items: center;
        overflow: hidden;
        padding: 8px 10px;
        background-size: 300% 300%;
        cursor: pointer;
        backdrop-filter: blur(1rem);
        border-radius: 3rem !important;
        transition: 0.5s;
        animation: gradient_301 5s ease infinite;
        border: double 2px transparent;
        background-image:
                linear-gradient(#212121, #212121),
                linear-gradient(
                        137.48deg,
                        #ffdb3b 10%,
                        #fe53bb 45%,
                        #8f51ea 67%,
                        #0044ff 87%
                );
        background-origin: border-box;
        background-clip: content-box, border-box;
}

.animatedBtn #container-stars {
        position: absolute;
        z-index: -1;
        width: 100%;
        height: 100%;
        overflow: hidden;
        transition: 0.5s;
        backdrop-filter: blur(1rem);
        border-radius: 5rem;
}

.animatedBtn text {
        z-index: 2;
        font-size: 10px;
        color: #ffffff;
        text-shadow: 0 0 4px white;
        font-weight: 600 !important;
        display: flex;
        align-items: center;
}

.animatedBtn text .tiIcon {
        font-size: 15px;
}
.animatedBtn text sup {
        font-size: 8px;
        color: #fff;
        margin-left: 3px;
}

.animatedBtn #glow {
        position: absolute;
        display: flex;
        width: 12rem;
}

.animatedBtn .circle {
        width: 100%;
        height: 30px;
        filter: blur(2rem);
        animation: pulse_3011 4s infinite;
        z-index: -1;
}

.animatedBtn .circle:nth-of-type(1) {
        background: rgba(254, 83, 186, 0.636);
}

.animatedBtn .circle:nth-of-type(2) {
        background: rgba(142, 81, 234, 0.704);
}

.animatedBtn:active {
        border: double 4px #fe53bb;
        background-origin: border-box;
        background-clip: content-box, border-box;
        animation: none;
}

.animatedBtn:active .circle {
        background: #fe53bb;
}

.animatedBtn #stars {
        position: relative;
        background: transparent;
        width: 200rem;
        height: 200rem;
}

.animatedBtn #stars::after {
        content: '';
        position: absolute;
        top: -10rem;
        left: -100rem;
        width: 100%;
        height: 100%;
        animation: animStarRotate 90s linear infinite;
}

.animatedBtn #stars::after {
        background-image: radial-gradient(#ffffff 1px, transparent 1%);
        background-size: 50px 50px;
}

.animatedBtn #stars::before {
        content: '';
        position: absolute;
        top: 0;
        left: -50%;
        width: 170%;
        height: 500%;
        animation: animStar 60s linear infinite;
}

.animatedBtn #stars::before {
        background-image: radial-gradient(#ffffff 1px, transparent 1%);
        background-size: 50px 50px;
        opacity: 0.5;
}

@keyframes animStar {
        from {
                transform: translateY(0);
        }

        to {
                transform: translateY(-135rem);
        }
}

@keyframes animStarRotate {
        from {
                transform: rotate(360deg);
        }

        to {
                transform: rotate(0);
        }
}

@keyframes gradient_301 {
        0% {
                background-position: 0% 50%;
        }

        50% {
                background-position: 100% 50%;
        }

        100% {
                background-position: 0% 50%;
        }
}

@keyframes pulse_3011 {
        0% {
                transform: scale(0.75);
                box-shadow: 0 0 0 0 rgba(0, 0, 0, 0.7);
        }

        70% {
                transform: scale(1);
                box-shadow: 0 0 0 10px rgba(0, 0, 0, 0);
        }

        100% {
                transform: scale(0.75);
                box-shadow: 0 0 0 0 rgba(0, 0, 0, 0);
        }
}

.campaignsTable table .date {
        display: block;
        margin-top: 7px;
        color: #9a9a9a;
        font-size: 10px;
}

.campaignsTable .campTitle,
.genericTable .campTitle {
        font-size: 13px;
        color: #434343;
        margin-bottom: 3px;
        font-weight: 600;
}

.campaignsTable .th1 {
        width: 0%;
}

.campaignsTable .th2 {
        width: 40%;
}

.campaignsTable .th3 {
        width: 30%;
        text-align: center;
}

.campaignsTable .th4 {
        width: 10%;
}

.campaignsTable .th5 {
        width: 8%;
}

.campaignsTable .th6 {
        width: 8%;
}

.preview-video-modal-content {
        box-shadow: 0px 8px 20px #939393;
}

.contentHashtag {
        padding: 5px 10px;
        border-radius: 20px;
        font-size: 10px;
        margin: 0px 5px 10px;
        color: #676767;
        background: #e4e4e4;
        display: inline-block;
}

.tdCenter {
        text-align: center;
}

.genericTable .blockWrapper {
        display: flex;
        flex-wrap: wrap;
        gap: 5px;
        margin-top: 15px;
}

.genericTable .dataBlock {
        color: #949494;
        box-sizing: border-box;
        padding: 2px 8px;
        border: 1px solid #ccc;
        border-radius: 4px;
        background-color: #f3f3f3;
}

.campaignsTable .dataBlock {
        font-size: 10px;
        color: #949494;
}

.campaignsTable .blockWrapper {
        display: inline-flex;
        align-items: center;
}

.campaignsTable .dataBlock,
.genericTable .dataBlock p {
        font-size: 11px;
        color: #000;
}

.campaignsTable .dataBlock {
        font-size: 10px;
        color: #949494;
}
.genericTable .dataBlock p span {
        font-size: 10px;
        color: #575757;
}

.campaignsTable .circle,
.genericTable .circle {
        background: #bebebe;
        width: 5px;
        height: 5px;
        border-radius: 100px;
        margin: 0px 10px;
}

.blockWrapper .midBlock {
        margin: 0px 18px;
}

.blockWrapper .midBlock p {
        color: #464646;
        text-align: left;
        font-size: 12px;
        color: #434343;
        font-weight: 600;
        margin-bottom: -2px;
}

.blockWrapper .midBlock span {
        font-size: 10px;
        color: #949494;
}

.customApex {
        display: flex;
        justify-content: center;
        max-height: 134px;
        min-height: 0 !important;
}

.errWrap {
        background: #fff;
        color: #dc3545;
        padding: 1px 5px;
        border-radius: 15px;
        font-weight: 600;
        margin-left: 5px;
}

.campaignsTable .custom-control {
        padding-left: 0px !important;
        margin-left: 5px;
}

.campaignsTable .select-all {
        display: flex;
        margin-left: 4px;
}

.bg-color {
        background: #fbfbfb;
}
/* Campaign Results CSS Starts */

.campResults .col-sm {
        flex: 0 0 35%;
        max-width: 35%;
}

.campResults .col-lg {
        flex: 0 0 65%;
        max-width: 65%;
        padding-left: 0;
}
.campResults .blockHead .head {
        font-size: 14px;
        color: #1a3b95;
        display: flex;
        align-items: center;
        text-transform: uppercase;
        letter-spacing: 1px;
        font-weight: 600;
        margin-bottom: 0;
}

.campResults .campSec {
        margin-bottom: 25px;
        background: #fff;
        border-radius: 15px;
        box-shadow: 0 2px 2px rgba(220, 230, 248, 0.5);
        border-radius: 4px;
        padding: 10px;
        box-sizing: border-box;
        border: 1px solid #e7e7e7;
}

.campResults .blockData {
        background: #fff;
        box-shadow: 0 2px 2px rgba(220, 230, 248, 0.5);
        border-radius: 4px;
        padding: 10px;
        box-sizing: border-box;
        border: 1px solid #e7e7e7;
        height: 272px;
        overflow: auto;
}

.campResults .blockData .table td {
        border: none;
}

.campResults .blockData .campTblSummary p {
        margin-bottom: 0;
        font-size: 11px;
}

#group {
        display: flex;
        align-items: center;
}

.campResults .blockHead .subHead {
        font-size: 12px;
        color: #959595;
        margin-bottom: 10px;
}

.campResults .blockContent {
        display: flex;
        justify-content: space-between;
        padding: 10px;
        border-radius: 10px;
}
.campResults .blockContent .miniBlockContent {
        padding: 0px 40px 0px 0px;
        border-right: 1px solid #e7e7e7;
        position: relative;
}

.campResults .blockContent .miniBlockContent:nth-last-child(1) {
        border-right: none;
}

.campResults .courseInfoTable {
        display: flex;
        align-items: center;
}

.campResults .courseInfoTable img {
        width: 50px;
        margin-right: 15px;
}

.campResults .creativeInfoTable img {
        height: 70px !important;
        object-fit: cover !important;
        object-position: top !important;
}

.campResults .courseInfoTable h6 {
        font-size: 13px;
        margin-bottom: 4px;
        color: #000;
}

.campResults .blockContent .miniBlockContent h6 {
        text-transform: uppercase;
        font-size: 12px;
        color: #959595;
        margin-bottom: 8px;
}

.campResults .blockContent .miniBlockContent p {
        color: #000;
        font-size: 14px;
        margin-bottom: 0;
        font-weight: 600;
}

.campResults .blockAnalysis {
        background-color: #fff !important;
        box-shadow: rgb(99 99 99 / 10%) 2px 2px 5px 1px;
        margin-bottom: 20px;
        position: relative;
        border: 0.5px solid #cfd0d3;
        padding: 25px 20px;
        border-radius: 10px;
}

/* Campaign Results CSS Ends */
.fix_scroll_v3 {
        height: calc(100vh - 248px);
}

.fix_scroll_v2 {
        height: calc(100vh - 214px);
        overflow: auto;
}
.fix_scroll {
        height: calc(100vh - 244px);
        overflow: auto;
}

.crtCourseSec {
        height: 70vh;
        overflow: auto;
}

.crtCourseSec .row {
        margin: 0;
}

.typeSection .creative {
        color: red;
}

.typeBadges {
        padding: 4px 8px;
        border: 1px solid #00000012;
        border-radius: 5px;
        font-size: 10px;
        white-space: nowrap;
        display: inline-block;
}

.typeBadges span {
        margin-right: 6px;
}

.creativeBadge {
        background: #cfe2ff;
        color: #052c65;
}

.courseBadge {
        color: #0a3622;
        background: #d1e7dd;
}

.gameBadge {
        color: #965c11;
        background: #f0b66cc4;
}
.quizBadge {
        color: #906f10;
        background: #dcbd1580;
}

/* ***********************
            New Dashboard
            ************************** */
.customDashboard {
        padding: 72px 20px 10px 20px;
        background: #eff3fc;
}

.customDashboard .alert {
        margin-bottom: 9px;
        padding-right: 15px;
}

.customDashboard .pDash {
        padding: 0px 4px 0px 4px;
}

.customDashboard .dashCard {
        border: 1px solid rgba(72, 94, 144, 0.16);
        border-radius: 0.25rem;
        padding: 10px;
        margin-bottom: 8px;
        background: #fff;
}

.customDashboard .dashCard .card-header {
        border-bottom: 1px solid rgba(72, 94, 144, 0.16);
        padding: 0px 0px 10px 0px;
        height: 28px;
}

.customDashboard .dashCard .cardTitle {
        margin-bottom: 0;
        font-size: 12px;
        color: #000;
        font-weight: 600;
}

.customDashboard .dashCard .chartBody {
        height: 200px;
        padding: 15px 0px;
        overflow: hidden;
}
.customDashboard .dashCard .tableBody {
        height: 200px;
        overflow: auto;
}

.thtdCenter {
        text-align: center !important;
}

#donutChart .apexcharts-legend.center.position-right {
        top: 8% !important;
        right: 6px !important;
}

.donutWrapper {
        position: absolute;
        bottom: 2px;
}
.donutLabels {
        display: inline-flex;
        align-items: center;
}

.donutLabels .lablePoint {
        position: relative;
        padding: 2px 10px;
        display: flex !important;
        align-items: center !important;
}

.donutLabels .lablePoint p {
        margin-bottom: 0px;
        font-size: 12px;
        margin-left: 8px;
}

.lablePoint .colorOne {
        color: #dc67ce;
}

.lablePoint .colorTwo {
        color: #6794dc;
}

.lablePoint .colorThree {
        color: #6771dc;
}

.lablePoint .colorFour {
        color: #a367dc;
}

.lablePoint .colorFive {
        color: #56b898;
}

.lablePoint .colorSix {
        color: red;
}

.campSumColor .colorOne {
        color: #6794dc;
}

.campSumColor .colorTwo {
        color: #aad58e;
}

.campSumColor .colorThree {
        color: #e9c46a;
}

#pieChart,
#rateChart {
        width: 100%;
        height: 170px;
}

.dataChart {
        width: 104%;
        height: 200px;
        margin-left: -18px;
        margin-top: 42px;
}

/* #pieChart canvas:nth-child(2), #rateChart canvas:nth-child(2), #learnersDataChart canvas:nth-child(2){
/* #pieChart canvas:nth-child(2), #rateChart canvas:nth-child(2), #learnersDataChart canvas:nth-child(2){
                display:none !important;
            } */

.customDashboard .dashCard .dashCT .progress {
        height: 13px;
        font-size: 9px;
}

.customDashboard .dashCard .dashCT .campTitle {
        font-size: 12px;
        color: #515151;
        margin-bottom: 3px;
        font-weight: 600;
}

.customDashboard .dashCard .dashCT .dataBlock {
        font-size: 9px;
        text-transform: uppercase;
        letter-spacing: 0.2px;
}

.customDashboard .dashCard .dashCT .creativeBadge {
        font-size: 10px;
}

.customDashboard .dashCard .dashCT thead {
        background: #fff;
}

.customDashboard .dashCard .dashCT thead th {
        border: 0;
        padding: 10px 10px 5px 10px;
        font-size: 10px;
        font-weight: 600;
}

.customDashboard .dashCard .courseInfoTable {
        display: flex;
        align-items: center;
}

.customDashboard .dashCard img {
        width: 42px;
        margin-right: 10px;
}

.customDashboard .addEllipsis .blank_wrap h6 {
        display: -webkit-box !important;
        line-clamp: 1;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 100%;
}

.customDashboard .dashCard h6 {
        font-size: 12px;
        margin-bottom: 0;
        color: #000;
}

.w-250 {
        width: 250px;
}

.ofVisible {
        overflow: visible !important;
}

.campaignsTable .circle,
.genericTable .circle {
        margin: 0px 6px;
}

.customDashboard .campNavs .nav-item .nav-link {
        font-size: 10px;
        padding: 0px 10px;
        border: 0;
}

.customDashboard .topPerform .nameBox {
        display: flex;
        align-items: center;
}

.customDashboard .topPerform .circleName span {
        background: #d0e2fc;
        color: #052c65;
        padding: 10px;
        border-radius: 50px;
        font-size: 13px;
        margin-right: 15px;
        text-transform: uppercase;
}

.topPerform .topRank {
        font-size: 16px;
        color: #6771dc;
}

.topPerform .topNumber h5 {
        font-size: 14px;
        margin-bottom: 0;
}
.topPerform .topNumber h5 span {
        font-size: 10px;
}

.quickBarDash .countNum {
        font-size: 16px;
        color: #052c65;
        margin-bottom: 5px;
        font-weight: 100;
}

.quickBarDash .countTitle {
        color: #bbb;
        font-size: 13px;
        margin-bottom: 0;
        font-weight: 200;
}

.quickBarDash .blockContent {
        display: flex;
        justify-content: space-between;
        margin-top: 11px;
        padding: 15px 10px;
}
.quickBarDash .blockContent .miniBlockContent {
        padding-right: 50px;
        border-right: 1px solid #e1e5ed;
        position: relative;
}
.quickBarDash .blockContent .miniBlockContent h6 {
        font-size: 15px;
        color: #2b2b2b;
        margin-bottom: 5px;
}

.quickBarDash .blockContent .miniBlockContent h6 .tiIcon {
        margin-right: 2px;
}

.quickBarDash .blockContent .miniBlockContent p {
        color: #838383;
        font-size: 12.5px;
        margin-bottom: 0;
}

.ic-circle {
        width: 10px;
        height: 10px;
        display: inline-block;
        margin-right: 5px;
        border-radius: 50%;
}

.quickBarDash .blockContent .miniBlockContent:nth-last-child(1) {
        border-right: 0;
}

#settingDiv tr td {
        padding: 0.5rem 20px 5px !important;
}

/* Analytics */

.analyticsBlock img {
        width: 100px;
        margin-right: 10px;
        margin-left: 10px;
}

.analyticsBlock p {
        font-size: 12px;
        margin-bottom: 5px;
}

.analyticsBlock h6 {
        font-size: 15px;
        margin-bottom: 0;
}

.analyticsBlock .blockCard {
        background: #f6f6f6;
        padding: 5px 25px;
        border-radius: 15px;
        margin-right: 15px;
        border: 1px solid #e1e5ee;
}

.analyticsBlock .blockCard .foot {
        text-align: center;
        border-top: 1px solid #e0e0e0;
        padding-top: 5px;
        font-size: 12px;
}

.userLoader .spinner-border {
        width: 12px !important;
        height: 12px !important;
        margin-left: 5px;
}

.btnCreatTrans {
        color: #fff;
        background: #0b5ed7;
        padding: 6px 8px;
}

.btnDanger {
        color: #fff;
        background-color: #dc3545;
        border-color: #dc3545;
}

.btnDanger:hover {
        color: #fff;
        background-color: #dc3545;
        border-color: #dc3545;
}

.btnCreatTrans:hover {
        color: #ffffff;
        background: #0049b0;
}

.connectBtn {
        border: 1px solid #085ed7;
        color: #085ed7;
        border-radius: 10px !important;
        font-size: 11px;
}

.connectBtn:hover {
        border: 1px solid #007bff;
        color: #007bff;
}

.form-control.editable-input {
        font-size: 0.6875rem;
        width: auto;
        display: inline;
        height: 1.52rem;
}

.editable-action-icon-bg {
        background: beige;
        padding: 5px;
        /* background: #B9D8C2;
                background: #CAF0F8;
                background: #F4EDEA; */
        background: #f0f7f4;
        border-radius: 2px;
        box-shadow:
                rgba(0, 0, 0, 0.1) 0px 4px 6px -1px,
                rgba(0, 0, 0, 0.06) 0px 2px 4px -1px;
}

.tooltip_indexed {
        position: absolute !important;
        z-index: 2;
}

.coursesinfoIcon {
        margin: 0px 5px;
        font-weight: 600;
}
.deleteUser {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
}
.deleteUser .selectedCount {
        padding-right: 10px;
        border-right: 1px solid #212529;
        margin-right: 10px;
}
.deleteUser .selectedCount p {
        margin-bottom: 0;
}

.coursesinfoIcon i {
        font-size: 13px;
        color: #b6b6b6;
}

.dashinfoIcon {
        position: absolute;
        top: -2px;
        right: 12px;
        color: #b6b6b6;
}

.dashinfoIcon .fa-info-circle {
        font-size: 13px;
}

.featureTable tbody tr td:first-child {
        font-weight: 700;
        font-size: 13px;
}
.featureTable tbody tr td:nth-last-child(1),
.featureTable thead tr th:nth-last-child(1) {
        text-align: center;
}

.featureTable tbody tr td {
        line-height: 24px;
        font-size: 13px;
        padding: 15px 10px;
}

#NotificationModal .modal-body {
        border-right: unset;
        border-left: unset;
        margin-bottom: 1.5rem;
}

#NotificationModal .notifBox {
        display: flex;
        align-items: center;
        padding: 10px 0px 10px 10px;
        border-radius: 8px;
}

#NotificationModal .modal-title .mark-as-read {
        display: inline;
        cursor: pointer;
        width: 100%;
        margin-top: 5px;
        font-size: 11px;
        font-weight: 600;
        padding-left: 5px;
        color: cornflowerblue;
}

#NotificationModal .notifBox.unRead {
        background-color: aliceblue;
}

#NotificationModal .notifBox .notifCircle {
        background: #d7e7ff;
        color: #000;
        padding: 8px 9px 4px 9px;
        border-radius: 50%;
        border: 1px solid #1967d2;
        margin-right: 5px;
        font-size: 12px;
        margin-right: 12px;
}

#NotificationModal .ti-settings {
        color: #1967d2;
}

#NotificationModal .notifContent h6 {
        font-size: 12px;
        color: #808080;
        margin-bottom: 0px;
        font-weight: 400;
}

#NotificationModal .notifContent .blockWrapper {
        display: inline-flex;
        align-items: center;
}

#NotificationModal .notifContent .dataBlock {
        font-size: 10px;
        color: #949494;
        border-right: 1px solid #949494;
        padding-right: 5px;
}

#NotificationModal .notifContent .time {
        font-size: 10px;
        color: #949494;
        padding-left: 5px;
}

#NotificationModal .notifContent .time-ago {
        font-size: 10px;
        color: #949494;
        padding-top: 5px;
}

/***************************
            Automated Campaign
            ***************************/
#automationmodal {
        width: 30% !important;
}

#automationmodal .blockData {
        background: #fff;
        box-shadow: 0 2px 2px rgba(220, 230, 248, 0.5);
        border-radius: 5px;
        padding: 10px;
        box-sizing: border-box;
        border: 1px solid #e7e7e7;
        overflow: auto;
        margin-bottom: 10px;
}

#automationmodal .blockWrapper {
        display: inline-flex;
        align-items: center;
}
.genericTable .dataBlock {
        font-size: 10px;
        color: #949494;
}

#automationmodal .circle,
.genericTable .circle {
        background: #bebebe;
        width: 5px;
        height: 5px;
        border-radius: 100px;
        margin: 0px 10px;
}

#automationmodal .table td {
        border: unset;
}

.boxWrapper {
        margin-top: 25px;
}
.cardSectin {
        border-top: 1px solid #e7e7e7;
        padding: 16px 0px;
}

.sectionDflex {
        display: flex;
        align-items: center;
}

.leftIcon {
        background: #f8f9fc;
        color: #000;
        padding: 8px;
        border-radius: 51%;
        border: 1px solid #1967d2;
        margin-right: 5px;
        font-size: 11px;
        display: inline-flex;
        align-items: center;
        justify-content: center;
}

.leftIcon .icon {
        color: #1967d2;
        font-size: 14px;
}

.rightContent {
        margin-left: 15px;
}

.rightContent h3 {
        font-size: 13px !important;
        color: #434343 !important;
        margin-bottom: 2px;
        font-weight: 400;
}

.circle,
.genericTable .circle {
        margin: 0px 6px;
}

.dataBlock,
.genericTable .dataBlock {
        font-size: 10px;
        color: #949494;
}

/* end */

/***************************
/***************************
            Gsuite Activity Logs
            ***************************/
.activityModalBody .modal-title {
        font-size: 12px;
        color: #838383;
        font-weight: 600;
        margin-bottom: 10px;
}

.activityModalBody .blockData {
        background-color: #e2ebf6;
}

.activityModalBody .gsuiteActivity .blockData {
        padding: 10px 15px !important;
}

.activityModalBody .boxWrapper {
        margin-top: 20px;
}

.gsuiteActivity .card-header {
        border: unset;
        padding: 0px;
        background-color: #fbfbfb !important;
}

.gsuiteActivity .card-header h2 {
        font-size: 12px;
}

.gsuiteActivity .card .card-header .btn-link.collapsed:after {
        content: '\f106';
}

.gsuiteActivity .card-header .btn-link::after {
        content: '\f107';
        font-family: 'FontAwesome';
        font-weight: 900;
        float: right;
        position: absolute;
        top: 0;
        right: 0;
}

.gsuiteActivity .card .card-header .btn-link {
        display: block;
        text-align: left;
        color: #222;
        width: 100%;
        padding: 0px;
        font-size: 13px;
        margin-left: 15px;
}

.gsuiteActivity .card .card-header .btn-link span {
        font-size: 10px;
        color: #949494;
}

.dropLeftimg img {
        width: 12px;
}

.gsuiteActivity .accordion {
        margin-bottom: 0px;
}
.gsuiteActivity .circle {
        background: #bebebe;
        width: 5px;
        height: 5px;
        border-radius: 100px;
        margin: 0px 10px;
}

.gsuiteActivity .form-group {
        margin-bottom: 0px;
}
.gsuiteActivity .table thead th {
        text-align: center;
        border-top: unset !important;
        border-right: 1px solid #dee2e6;
}

.gsuiteActivity .table td {
        text-align: center;
        border: 1px solid rgba(0, 0, 0, 0.03) !important;
}

.gsuiteActivity .blockData {
        background-color: #fbfbfb !important;
}

.gsuiteActivity .card-body {
        padding: 20px 0px 0px;
}

.gsuiteActivity .table-responsive {
        box-shadow: unset;
}

/* G-Suite Right Modal */
/* G-Suite Right Modal */

.gSuiteRightModal .modal-dialog {
        width: 900px !important;
}

.tabVerticalWrap {
        width: 25px !important;
        height: 25px !important;
        border-radius: 50%;
        position: relative;
        background: #ccc;
        margin-right: 15px;
}

.steps {
        font-size: 15px !important;
        color: #000 !important;
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
}

.leftContent h5 {
        font-size: 14px;
        color: #000;
        margin-bottom: 0px;
}

.leftContent p {
        font-size: 12px !important;
        color: #32383f !important;
        margin-bottom: 4px;
}

.rightBorder {
        border-right: 1px solid rgba(0, 0, 0, 0.12);
        padding-right: 0;
}

.labelBlock {
        border-bottom: 1px solid #f1f1f1;
        padding-bottom: 15px;
        margin-bottom: 10px;
        margin-top: 5px;
}

.labelBlock h6 {
        font-size: 14px !important;
        margin-bottom: 5px;
        font-weight: 600 !important;
}

.labelBlock p {
        font-size: 12px !important;
        color: #8e8e8e !important;
        margin-bottom: 0px;
}

.inlineForm {
        display: flex;
        align-items: center;
        margin-bottom: 20px;
}

.gSuiteRightModal .modal-header {
        border-bottom: 1px solid #e2e2e2;
        padding-bottom: 10px;
}

.gSuiteRightModal .modal-body {
        padding: 0px;
}

.gSuiteRightModal .custom-file {
        border: 1px solid #e2e5ed;
        border-radius: 5px;
}

.gSuiteRightModal .custom-file-input {
        position: relative;
        z-index: 2;
        width: 100%;
        height: calc(1.5em + 0.75rem + 2px);
        margin: 0;
        opacity: 0;
}

.gSuiteRightModal .custom-file-label {
        padding-left: 110px;
        line-height: unset;
}

.gSuiteRightModal .custom-file-input:lang(en) ~ .custom-file-label::after {
        content: 'Choose File';
}

.gSuiteRightModal .custom-file-label::after {
        left: 0 !important;
        right: unset !important;
        height: 33px;
        line-height: 24px;
        border-right: 1px solid #e2e5ed;
        background: #f4f6f9;
        color: #838383;
        border-radius: 0px;
}

.gSuiteRightModal .syncUserBox {
        border: 1px solid #e7e6e9;
        border-radius: 15px;
        margin-bottom: 30px;
}

.gSuiteRightModal .dflexBox {
        display: flex;
        padding: 15px;
        border-bottom: 1px solid #e7e6e9;
}
.gSuiteRightModal .reloadleftIcon {
        margin-right: 10px;
        margin-top: 10px;
}

.gSuiteRightModal .reloadIcon {
        font-size: 15px;
        border: 1px solid #e8e6e9;
        padding: 10px;
        border-radius: 10px;
        background: #ececec;
        color: #0e2954;
}

.gSuiteRightModal .rightContent h6 {
        font-size: 15px !important;
        color: #0e2954;
        margin-right: 10px;
        margin-bottom: 8px;
}

.gSuiteRightModal .rightContent p {
        font-size: 13px;
        color: #767676;
}

.gSuiteRightModal .syncBt {
        text-align: right !important;
        padding: 10px 16px;
}

.gSuiteRightModal .inlineForm .form-label {
        color: #696969;
        font-size: 13px;
        font-weight: 400;
        margin-bottom: 0;
        width: 35%;
}

.gSuiteRightModal .addDomaincopy {
        background: #e5e5e5;
        padding: 3px 6px;
        color: #8a8a8a;
        border-radius: 3px;
        cursor: pointer;
        margin-left: 10px;
}

.gSuiteRightModal .addDomainalertPara {
        background-color: #fff4e5;
        padding: 6px 16px;
        border-radius: 4px;
        font-size: 14px;
        margin-bottom: 20px;
}

.syncUserBox {
        border: 1px solid #e7e6e9;
        border-radius: 15px;
        margin-bottom: 30px;
}

.wrap-feature41-box .f41-tab {
        display: block;
}

.wrap-feature41-box .f41-tab li a {
        display: flex;
        align-items: center;
        padding: 15px 10px;
}

.wrap-feature41-box .f41-tab li a .t-icon {
        margin-right: 25px;
        color: #8d97ad;
}

.wrap-feature41-box .f41-tab li a h6 {
        font-size: 14px;
        margin-bottom: 0px;
}

.wrap-feature41-box .f41-tab li a.active {
        border-right: 3px solid #1967d2;
}

.wrap-feature41-box .f41-tab li a.active,
.wrap-feature41-box .f41-tab li a:hover {
        background: #f3f3f3;

        box-shadow: 0px 0px 30px rgba(115, 128, 157, 0.1);
}

.wrap-feature41-box .f41-tab li a.active .t-icon,
.wrap-feature41-box .f41-tab li a:hover .t-icon {
        background: #00b4ff;
        background: -webkit-linear-gradient(
                legacy-direction(to right),
                #00b4ff 0%,
                #00b4ff 100%
        );
        background: linear-gradient(to right, #00b4ff 0%, #00b4ff 100%);
        -webkit-background-clip: text;
        background-clip: text;
        -webkit-text-fill-color: transparent;
}

/* end */

/* Responsive css */
@media only screen and (min-width: 300px) and (max-width: 480px) {
        /* common */

        .setcolWidth {
                max-width: 50%;
        }

        .setcolWidth_30 {
                max-width: 30%;
        }

        .setcolWidth_70 {
                max-width: 70%;
        }

        .width_100 {
                max-width: 100% !important;
                flex: unset !important;
        }

        .setcolWidth_45 {
                max-width: 45%;
        }

        .setcolWidth_55 {
                max-width: 55%;
        }

        .setcolWidth .setFlot {
                float: right !important;
        }

        .flot_left .setFlot {
                float: left !important;
        }

        .setcolWidth_30 {
                max-width: 30%;
        }

        .setcolWidth_70 {
                max-width: 70%;
        }

        /* Dashboard */

        .contentbar {
                margin-top: unset !important;
        }

        .authenticate-bg .auth-form-slot {
                width: 100%;
        }
        .auth-form-footer {
                margin-top: 12px;
        }
        .customDashboard {
                margin-top: 73px !important;
        }
        .quickBarDash .blockContent {
                display: block;
        }
        .customDashboard .dashCard {
                overflow-y: hidden;
        }
        .quickBarDash .blockContent .miniBlockContent {
                border-right: unset;
                margin-bottom: 12px;
        }

        .quickBarDash .blockContent .miniBlockContent h6 {
                font-size: 14px;
        }
        .customDashboard .btn {
                margin-top: 10px;
                margin-left: 0px !important;
        }
        .customDashboard .dashCard .chartBody {
                display: flex;
                align-items: center;
                justify-content: center;
        }
        .customDashboard .dashCard .dashCT .dataBlock {
                font-size: 8px;
        }
        .customDashboard .dashCard .chartBody {
                justify-content: center;
                display: grid;
                text-align: center !important;
        }

        .vertical-layout.toggle-menu .vertical-menu > li {
                text-align: left !important;
        }

        /* Dashboard End */

        /* Video */

        .breadcrumbbar {
                position: unset !important;
                padding: 15px 0px 10px 10px !important;
                height: unset !important;
                margin: 75px 0px 0px 0px !important;
        }

        .breadcrumbbar .row {
                height: unset !important;
                margin: 0 !important;
        }

        .filter-wrapper {
                height: auto;
                padding: 15px 15px 0px 15px;
        }

        .filter-wrapper .float-right {
                float: left !important;
        }

        .videoCards .colWset {
                max-width: 100% !important;
                flex: unset !important;
                margin-bottom: 10px;
        }

        .videoCards .course_img_store {
                height: unset;
        }

        .vModal .modal-body {
                width: 100% !important;
        }

        .modal-body video {
                width: 100% !important;
        }
        .announcModal .modal-content {
                width: 360px !important;
                height: auto !important;
        }
        .announcModal .close {
                z-index: 1;
        }

        .vModal .creativeModal .modal-header .dataBlock {
                font-size: 12px;
        }

        .fixRow {
                margin-right: 0px;
                margin-left: 0px;
        }

        /* courses */
        .courses-tab .setMgn {
                margin-right: 10px !important;
        }

        /* end */

        /* Campaigns  */
        .searchbar .form-inline {
                flex-flow: unset !important;
        }

        .MetricsResponsive {
                padding: 10px 0px;
        }

        .MetricsResponsive .float-right {
                float: left !important;
        }

        .MetricsResponsive .blockHead .head {
                font-size: 12px;
        }
        .MetricsResponsive .blockHead .subHead {
                font-size: 10px;
        }

        .campResults .campSec {
                overflow: auto;
        }

        #apex-pie-chart .apexcharts-canvas {
                left: unset !important;
                text-align: center;
        }

        #apex-pie-chart svg {
                margin-left: unset !important;
        }

        .campResults .blockContent .miniBlockContent {
                padding: 12px;
                border-right: unset !important;
        }

        .campResults .blockContent {
                display: block;
        }

        .responsiveCard .blockCard {
                margin-bottom: 20px;
        }
        /* end */
        .campResults .course_container {
                display: flex;
                text-align: center;
        }

        .campResults .course_container .box {
                margin-bottom: 20px;
        }

        .vModal {
                padding-top: 70px;
        }

        /* learner */
        .setcolmdWidth {
                max-width: 100% !important;
                flex: auto !important;
        }

        .learner_course .setflex {
                display: flex;
                align-items: center;
                justify-content: start;
                margin-top: 20px;
                margin-bottom: 20px;
        }

        .learner_course .orderby-btn {
                margin-top: unset !important;
        }
        .setcolWidth .btn-secondary {
                margin-right: 6px;
        }

        .setFlotleft {
                text-align: left !important;
                margin-top: 10px;
        }
        .breadcrumbbar .page-title {
                font-size: 14px;
        }

        .mr_left {
                padding: 6px 0px !important;
        }

        .setflex .orderby-btn {
                margin-left: 0px !important;
        }

        .coursePreview {
                height: unset !important;
        }

        .setHeight #quiz {
                height: unset !important;
        }
        .topbar-mobile .mobile-togglebar .menu-hamburger {
                padding: unset !important;
        }
        .game-banner {
          min-height: calc(100vh - 200px);
        }
}

.btn .tiIcon {
        margin-right: 5px !important;
}

.leaderblockCard {
        background: #f6f6f6;
        border-radius: 15px;
        margin-right: 15px;
        border: 1px solid #e1e5ee;
}

.leaderBoard .boxFlex {
        display: flex;
        align-items: center;
        padding: 10px 0px;
}

.boxFlex img {
        width: 80px;
}

.leaderBoard .blockCard {
        background: #f6f6f6;

        border-radius: 15px;
        margin-right: 15px;
        border: 1px solid #e1e5ee;
}

.leaderBoard .cardFooter {
        background: #eaeaea;
        display: flex;
        align-items: center;
        padding: 8px 20px;
        justify-content: space-between;
        border-radius: 0px 0px 15px 15px;
}
.leaderBoard .cardFooter .learnCard {
        border-right: 1px solid #b1b1b1;
        width: 33.33%;
        text-align: center;
}

.leaderBoard .cardFooter .learnCard:nth-last-child(1) {
        border-right: none;
}

.leaderBoard .cardFooter .learnCard p {
        margin-bottom: 0;
}

.leaderTable .textCenter {
        text-align: center;
}
.leaderTable .nameBold {
        font-weight: bold;
}

/** Notification Dropdown **/
/** Notification Dropdown **/

.dropdown {
        display: inline-block;
        /* margin-left: 20px; */
}

.notification-badge {
        position: absolute;
        background-color: #f5424e;
        font-size: 11px;
        width: 10px;
        height: 10px;
        border-radius: 50%;
        top: 0;
        right: 0;
}

.notification-badge.with-wave {
        animation-name: wave;
        animation-duration: 1s;
        animation-timing-function: linear;
        animation-iteration-count: infinite;
}

.notification-num-badge {
        position: absolute;
        top: -12px;
        right: -5px;
        font-size: 9px;
        width: 20px;
        height: 20px;
        background: #167af6;
        color: #ffffff;
        display: flex;
        justify-content: center;
        align-items: center;
        border-radius: 50%;
}

@keyframes wave {
        0% {
                box-shadow: 0 0 0px 0px rgba(245, 66, 78, 0.5);
        }
        100% {
                box-shadow: 0 0 0px 10px rgba(245, 66, 78, 0);
        }
}

.bar_Icons:hover .badge {
        background-color: #000;
        transform: scale(1.08);
}

.glyphicon-bell {
        font-size: 1rem;
}

.notifications {
        min-width: 420px;
}

.notifications-wrapper {
        overflow: auto;
        max-height: 250px;
}

.menu-title {
        color: #303840;
        font-size: 1rem;
        display: inline-block;
}

.menu-view-all {
        font-size: 0.8rem;
}

.glyphicon-circle-arrow-right {
        margin-left: 10px;
}

.notification-heading,
.notification-footer {
        padding: 5px 12px 0px 12px;
}

.dropdown-menu.divider {
        margin: 5px 0;
}

.notification-item .item-title {
        font-size: 13px;
        color: #666;
}

.notification-item .item-info {
        font-size: 12px;
        margin-bottom: 0.8rem;
}

.notifications a.content {
        text-decoration: none;
        background: #eeecec;
}

.notification-item {
        padding: 10px;
        margin: 5px;
        background: #eeecec;
        border-radius: 4px;
}

.quiz-option-prefix {
        color: #6c757d;
        background: #eaeaea;
        width: 16px;
        height: 16px;
        border-radius: 51%;
        display: inline-block;
        border: 1px solid #6c757d;
        margin-right: 5px;
        font-size: 9px;
        text-align: center;
}

.quizHeight {
        height: calc(100vh - 225px);
}

.question_combine h5 {
        font-size: 14px;
        line-height: 5px;
        margin-top: 4px;
        color: #1f51b3;
}

.question_combine .custom-control-label {
        font-size: 13px;
        padding-top: 2px;
        font-weight: 500;
        display: flex;
        align-items: center;
        cursor: pointer;
}

.question_title h6 {
        font-size: 14px;
        margin-bottom: 15px;
}

.question_nameLer {
        border: 1px solid #dee2e6;
        padding: 16px;
        border-radius: 10px;
        margin-bottom: 15px;
}

.media-wrapper #quiz {
        /* height: 82vh; */
        overflow: auto;
}

.company_info_logo {
        height: auto;
        width: 200px;
        object-fit: cover;
        margin-bottom: 20px;
}
.info_logo_wrap {
        position: relative;
        display: inline-block;
}
.info_logo_wrap .close_icon {
        position: absolute;
        right: -7px;
        top: -7px;
        color: black;
        border-radius: 50%;
        border: 1px solid black;
        background-color: var(--color-dark-gray);
        font-size: 14px;
        padding: 1px 2px;
}

.domain_service_list {
        display: flex;
}
#domainServiceProvider {
        padding: 0;
}
#domainServiceProvider li {
        list-style: none;
}

.idP_list_container {
        display: grid;
        grid-row-gap: 3px;
}

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

#jumpcloud-groups-table {
        height: calc(100vh - 218px);
        overflow: auto;
}
/* div.WACFrame.cui-exth {
                top:0px !important;
            } */

#upload_vid {
        margin-right: 7px;
}

.scrolTable {
        max-height: 250px;
        overflow: scroll;
}
.creative_wrap iframe {
        border-bottom: 1px solid #e3e3e3 !important;
}

.creative_wrap .scrollWrap {
        text-align: center;
        text-align: center;
        position: relative;
        width: 200px;
        left: 50%;
        transform: translate(-50%, 0px);
}

.creative_wrap .scrollWrap h1 {
        padding: 6px 0px;
        font-size: 14px;
        margin-bottom: 5px;
        background: #bbbbbb52;
        border-radius: 10px;
}

.creative_wrap .scrollWrap span {
        animation: MoveUpDown 1s linear infinite;
        position: relative;
        font-size: 16px;
}
@keyframes MoveUpDown {
        0%,
        100% {
                bottom: 0;
        }
        50% {
                bottom: 8px;
        }
}

.csvreportModal .modal-content {
        width: 500px !important;
}

/* div.WACFrame.cui-exth {
/* div.WACFrame.cui-exth {
                top:0px !important;
            } */

#upload_vid {
        margin-right: 7px;
}

.scorm-badge {
        padding: 5px 10px;
        background-color: #00000061;
        color: white;
        border-radius: 5px;
        font-size: 13px;
        z-index: 1;
}
.creative-badge {
        padding: 4px 5px;
        background: #000000ad;
        color: #fff;
        font-size: 10px;
        color: white;
        border-radius: 4px;
        z-index: 1;
}
.badge-new {
        padding: 5px 10px;
        background-color: #00000061;
        color: white;
        border-radius: 5px;
        font-size: 13px;
        z-index: 1;
}
.card {
        position: relative; /* Ensure the card has a relative position to position the badge inside it */
}

.disbled-success:disabled {
        background: #28a745 !important;
        color: #fff !important;
        opacity: 1;
        border-radius: 4px !important;
}
.disbled-success:disabled:hover {
        background: #28a745 !important;
        color: #fff !important;
        opacity: 1;
}

.badge-container {
        display: flex;
        align-items: center;
        gap: 8px;
        margin-bottom: 0px;
        padding: 8px;
        position: absolute;
        text-transform: capitalize;
}

.imgpreviewModal {
        padding-top: 30px;
}

.imgpreviewModal .modal-body {
        width: 800px !important;
        margin: 0 auto;
        border-right: 1px solid rgba(0, 0, 0, 0.03);
        border-left: 1px solid rgba(0, 0, 0, 0.03);
        padding: 20px;
}

.imgpreviewModal .modalClose {
        color: #fff !important;
        margin: 6px 5px 0px 0px !important;
        font-size: 15px !important;
        background: #0e2954 !important;
        opacity: 1;
        padding: 4px 9px 6px 9px !important;
        border-radius: 22px;
        position: absolute !important;
        right: 0px !important;
        top: 0px !important;
        border-radius: 50px !important;
        box-shadow: unset !important;
}

.imgpreviewModal .setHeight {
        border-radius: 15px 15px 0px 0px;
        height: calc(100vh - 30px);
        overflow: auto;
        position: relative;
        background: white;
        width: 800px;
        margin: 0 auto;
}

.imgpreviewModal .preview-lecture-creative-modal-content {
        margin: 0% auto !important;
}

.plusIconhide thead th:first-child {
        display: none;
}

.plusIconhide tbody td:first-child {
        display: none;
}
.btn-success {
        color: #fff !important;
        opacity: unset !important;
        background-color: #198754 !important;
        border-color: #198754 !important;
}
.tempalatePreviewModal {
        width: 800px;
}

.text-underline {
        text-decoration: underline !important;
        color: #085ed7 !important;
}

.customTemplateModal {
        z-index: 2000 !important;
}

#video-modal-description {
        margin-top: 10px;
}

.learner_course .filter-wrapper {
        border-bottom: 2px dotted #e1e5ee !important;
        display: flex;
        align-items: center;
        margin: 0px -15px;
        margin-bottom: 15px;
        padding-bottom: 5px;
        border-radius: 0;
        height: 50px;
}

.learner_course .filter-wrapper .searchBar {
        width: 210px;
        border: 1px solid #e1e5ee;
        padding-left: 10px;
        border-radius: 5px;
}

.note_panel {
        border-radius: 5px;
        border: 2px solid;
        border-color: #f7c23f;
        background: #fef9ec;
        padding: 6px 10px;
        color: black;
}

.note_panel p {
        font-size: 12px;
        margin-bottom: 0px;
}

.creatgroupModal {
        width: 600px !important;
        overflow: auto;
}

.creatgroupModal .addUserbtn sup {
        color: red;
}

.addUserbtn p {
        font-size: 13px;
}

.addUserbtn .tiIcon {
        margin-right: 5px !important;
}

.addUserbtn .addBtn {
        padding: 3px 8px;
        border-radius: 3px;
        font-size: 10px;
        cursor: pointer;
}

.creatgroupModal .setscrollHeight {
        height: calc(100vh - 155px);
        overflow: auto;
}

.creatgroupModal .setscrollHeightModal-2 {
        height: calc(100vh - 206px);
        overflow: auto;
}

.rightmodalFooter {
        border-top: 1px solid #e2e5ed;
        padding: 10px 15px;
        display: flex;
        justify-content: space-between;
        /* position: absolute; */
        width: 100%;
        bottom: 0;
        align-items: center;
        background: #fff;
}

.onlyForPinter .flexTableData {
        display: flex;
        align-items: center;
        cursor: pointer;
}
.onlyForPinter .circle {
        display: inline-block !important;
        background-color: #e2e5ed !important;
        border-radius: 50% !important;
        margin-right: 10px;
}

.noShadow {
        box-shadow: none !important;
        border: 1px solid #e0e3eb !important;
}

.onlyForPinter .circle .circle-inner {
        color: #1967d2;
        vertical-align: middle;
        text-align: center;
        text-decoration: none;
        height: 30px;
        width: 30px;
        font-size: 12px;
        display: flex;
        align-items: center;
        text-transform: uppercase;
        justify-content: center;
}

.onlyForPinter h6 {
        margin-bottom: 0px;
        font-size: 13px;
}

.onlyForPinter span {
        color: #b1aeae;
}

.infoBoxCenter {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
}

.infoBoxCenter .circle-inner {
        color: #1967d2;
        font-size: 24px;
        text-transform: uppercase;
}

.dltUser {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
}

.selectedUserCount {
        padding-right: 10px;
        border-right: 1px solid #212529;
        margin-right: 10px;
}

p {
        margin-bottom: 0;
}
.createUpdatepage .custom-file-input {
        position: relative;
        z-index: 2;
        width: 100%;
        height: calc(1.5em + 0.75rem + 2px);
        margin: 0;
        opacity: 0;
}

.createUpdatepage .custom-file-label {
        padding-left: 110px;
        line-height: unset;
}

.createUpdatepage .custom-file-input:lang(en) ~ .custom-file-label::after {
        content: 'Choose File';
}
.createUpdatepage .custom-file-label::after {
        left: 0 !important;
        right: unset !important;
        height: 33px;
        line-height: 24px;
        border-right: 1px solid #e2e5ed;
        background: #f4f6f9;
        color: #838383;
        border-radius: 0px;
}

.createUpdatepage .custom-file-label {
        color: #8a98ac;
        background-color: #ffffff !important;
        border: 1px solid rgba(0, 0, 0, 0.03);
        font-weight: 400;
        overflow: hidden;
}

.createUpdatepage .custom-file {
        border: 1px solid #e2e5ed;
        border-radius: 5px;
}

.createUpdatepage .input_radio {
        margin-bottom: 10px;
}

.imgView {
        max-height: 100px;
        width: 200px;
        object-fit: contain;
        padding: 10px;
}

.tableResponsive .table-responsive {
        overflow-x: scroll !important;
}

/*Start Feedback Css */

.modalMd {
        width: 70% !important;
}

.setcardHeight {
        height: calc(100vh - 152px);
        overflow: auto;
        overflow-x: hidden;
}

.infoHeading {
        margin-bottom: 15px;
}

.infoHeading h6 {
        color: #1d67d2;
        font-size: 14px;
        margin-bottom: 0px;
}

sup {
        color: red;
}
.questionContainerWrapper {
        border: 1px solid #f1f1f1;
        margin-bottom: 10px;
}

.box2 .questionInput {
        padding: 15px;
        border-bottom: 1px solid #f1f1f1;
}

.box2 .cardWrapper .form-group {
        margin-bottom: 0px !important;
        width: 100%;
}

.box2 .cardWrapper {
        padding: 15px;
        background: #fafafa;
}

.option_answer {
        margin-top: 15px;
}

.cardWrapper .addOptioncss {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
}

.cardWrapper .btnCreatTrans {
        padding: 2px 10px !important;
        font-size: 10px !important;
        margin-bottom: 0px;
}

.inputFlex {
        display: flex;
        align-items: center;
        margin-bottom: 15px;
}

.inputFlex:nth-last-child(1) {
        margin-bottom: unset;
}

.inputCheck {
        margin-bottom: 20px;
}

.inputDelete {
        margin-left: 10px;
}

.inputDelete .fa-trash {
        color: #e46a69;
        font-size: 15px;
}

.inputNumber {
        margin-right: 10px;
}

.selectFormControl {
        width: 10%;
        padding: 2px 5px;
        height: 25px;
}

.ratingWrapper {
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
}

.questionContainerWrapper .ratingStar {
        margin: 15px;
        padding: 5px;
}

.questionViewWrapper .ratingStar {
        margin: 15px;
        padding: 15px 0px;
}

.analyticOptionDisplay {
        display: flex;
        align-items: center;
}

.feedbackSubmissionWrapper .ratingStar {
        margin: 15px;
        padding: 15px 0px;
}

.ratingWrapper .number {
        padding-bottom: 4px;
}

.ratingWrapper .star .ti-star {
        font-size: 25px;
        color: #7a7a7a;
        transition: color 0.3s ease;
}

.ratingWrapper .star i.active {
        color: #dfc63f;
}

.ratingWrapper .ratingStar:hover .ti-star {
        color: gold;
}

.ratingWrapper .ratingStar {
        cursor: pointer;
}

.rating_analyticWrapper {
        text-align: center;
        display: flex;
        justify-content: center;
        align-items: center;
}

.rating_analyticWrapper .star i.active {
        color: #dfc63f;
}

.rating_analyticWrapper .number {
        padding-bottom: 4px;
}

.rating_analyticWrapper .star .ti-star {
        font-size: 25px;
        color: #7a7a7a;
        transition: color 0.3s ease;
}

.rating_analyticWrapper .star i.active {
        color: #dfc63f;
}

.cardWrapper .custom-switch .custom-control-label::before {
        width: 40% !important;
        height: 14px !important;
}

.cardWrapper .custom-switch .custom-control-label::after {
        height: 10px;
}

.cardWrapper .custom-control-label {
        padding-left: 8px;
}

.mandatory-badge {
        color: #1967d2;
        background: #d7e7ff;
        padding: 5px 10px !important;
        border-radius: 3px !important;
        font-size: 11px !important;
        font-weight: 400;
}

.questionText {
        font-size: 12px;
        font-weight: 600;
}

/*************************
/*************************
            Course Feedback Modal Css 
            **************************/

.feedbackOption {
        z-index: 2000;
}

.feedbackThankYou {
        z-index: 2000;
}

.feedbackOption .modal-title {
        color: #959595;
        font-size: 12px;
}

.feedbackOption .modal-content {
        width: 700px !important;
}

.feedbackOption .heading h5 {
        font-size: 20px;
        margin-bottom: 12px;
}

.feedbackOption .heading p {
        font-size: 13px;
        color: #959595;
}

.feedbackOption .modal-header .close {
        padding: 10px 6px;
        color: #959595;
}

.viewUserFeedback {
        z-index: 2000;
}

.viewUserFeedback .modal-title {
        color: #959595;
        font-size: 12px;
}

.viewUserFeedback .heading h5 {
        font-size: 20px;
        margin-bottom: 12px;
}

.viewUserFeedback .heading p {
        font-size: 13px;
        color: #959595;
}

.viewUserFeedback .cardhead.row {
        margin-left: 0px !important;
        margin-right: 0px !important;
}

.viewUserFeedback .margin-fix {
        margin-bottom: 1rem;
}

.viewUserFeedback .mainCardWrapper {
        border: 1px solid #ececec;
        margin-bottom: 20px;
}

.viewUserFeedback .modal-header .close {
        padding: 10px 6px;
        color: #959595;
}

.questionViewWrapper {
        border: 1px solid #ececec;
        margin-bottom: 20px;
}

.questionViewWrapper .mainCardWrapper {
        border: 1px solid #ececec;
        margin-bottom: 20px;
}

.questionViewWrapper .cardhead {
        padding: 14px 0px;
        background: #f8f8f8;
        border-bottom: 1px solid #ececec;
        display: flex;
        align-items: center;
}

.questionViewWrapper.is-invalid {
        border: 1px solid #ff3f3f;
}

.questionViewWrapper .cardBody {
        padding: 15px 15px 0px 15px;
}

.questionViewWrapper .editIcon {
        color: darkblue;
        margin-right: 15px;
}

.questionViewWrapper .deleteIcon {
        color: darkred;
        margin-right: 15px;
}

.questionViewWrapper .optionContainer {
        padding-right: 15px;
        display: flex;
}

.questionViewWrapper .optionContainer .optionContainerInput p {
        margin: 0;
        padding: 0;
}

.questionViewWrapper .optionContainer .optionContainerInput {
        padding-right: 15px;
}

.feedbackSubmissionWrapper .optionContainer {
        padding-right: 15px;
        display: flex;
}

.feedbackSubmissionWrapper .optionContainer .optionContainerInput p {
        margin: 0;
        padding: 0;
}

.feedbackSubmissionWrapper .optionContainer .optionContainerInput {
        padding-right: 15px;
}

.feedbackOption .cardhead.row {
        margin-left: 0px !important;
        margin-right: 0px !important;
}

.feedbackOption .margin-fix {
        margin-bottom: 1rem;
}

.feedbackSubmissionWrapper.is-invalid {
        border: 1px solid #ff3f3f;
}
.feedbackOption .mainCardWrapper {
        border: 1px solid #ececec;
        margin-bottom: 20px;
}

.feedbackSubmissionWrapper {
        border: 1px solid #ececec;
        margin-bottom: 20px;
}

.feedbackSubmissionWrapper .cardhead {
        padding: 14px 10px;
        background: #f8f8f8;
        border-bottom: 1px solid #ececec;
}

.feedbackSubmissionWrapper .cardBody {
        padding: 15px;
}

.feedbackSubmissionWrapper .cardhead h6 {
        font-size: 12px;
        margin-bottom: 0px;
}

.setscrollHeight {
        height: calc(100vh - 200px);
        overflow: auto;
}

#feedbackthankyouModal img {
        width: 50px;
        margin-bottom: 20px;
}

#feedbackthankyouModal .modal-body {
        text-align: center;
}

#feedbackthankyouModal h1 {
        font-size: 16px;
}

#feedbackthankyouModal p {
        font-size: 12px;
        margin-bottom: 0px;
}

#feedbackthankyouModal .modal-content {
        width: 400px;
}

.detail-display-name {
        width: 50%;
}

.detail-display-description {
        width: 80%;
}

.feedbackAnalytics .mainCardWrapper {
        max-height: 380px;
}

.feedbackAnalytics .cardBody {
        padding: 25px 20px 0px 20px;
}

.feedbackAnalytics .cardBody .form-check {
        margin-bottom: 15px;
}

.feedbackAnalytics input:disabled {
        background-color: #f0f0f0;
        color: #888;
        cursor: not-allowed;
}

.star i {
        font-size: 24px; /* Adjust star size */
        color: gray; /* Default color for unselected stars */
        transition: color 0.3s ease;
}

.star i.active {
        color: gold; /* Color for selected stars */
}

.hidden-menu-header {
        display: none !important;
}

#scorm-certificate-download-button-container a {
        margin-top: 55px;
        margin-bottom: -10px;
}

.sort-wrapper {
        padding: 0px 15px;
        margin-top: 10px;
}

.sort-wrapper .sortBtn p {
        margin-bottom: 0;
        margin-right: 0px;
        font-size: 12px;
}
.sort-wrapper .sortBtn {
        display: flex;
        align-items: center;
}

.sort-wrapper .primary-light {
        background: #f6f6f6;
        color: #1967d2;
        border: 1px solid #1967d2;
        border-radius: unset;
}

.sort-wrapper .primary-light.active {
        background: #1967d2;
        color: #ffffff;
        border: 1px solid #1967d2;
}

.taButton {
        width: 100%;
        position: absolute;
        bottom: 0;
        background-color: #223a62;
        transition: width 0.3s ease-in-out;
}

.taButton .btnCreatTrans {
        width: 100%;
        border-radius: 0 !important;
        background: #223a62;
        height: 50px !important;
        font-size: 13px !important;
        display: flex;
        align-items: center;
        justify-content: center;
        color: white;
        cursor: pointer !important;
}

.taConnectModal .modal-content {
        width: 800px;
}

.taConnectModal .modal-header {
        border-bottom: unset;
        padding: unset;
}

.taConnectModal .modal-body {
        padding: 10px !important;
        text-align: center;
}

.taConnectModal .modalBody .carousel-inner {
        width: 80%;
        margin: auto;
        height: 425px;
}

.taConnectModal .modalHeader h5 {
        font-size: 20px;
        font-weight: 600;
        margin-bottom: 12px;
}

.taConnectModal .modalHeader p {
        font-size: 13px;
        background: #eeeeee;
        display: inline-block;
        padding: 5px 15px;
        border-radius: 5px;
}

.taConnectModal .modalBody {
        margin: 25px 0;
}

.taConnectModal .modalFooter {
        padding-top: 15px;
        width: 35%;
        margin: 15px auto;
}

.taConnectModal .modalBody .card-img-top {
        height: auto;
}

.taConnectModal .modalBody .carousel-caption {
        bottom: -55px;
        padding-top: 15px;
        padding-bottom: 5px;
        width: 100%;
        right: 0;
        left: 0;
}

.taConnectModal .carousel-caption h5 {
        margin-bottom: 5px;
        font-size: 16px;
}

.taConnectModal .carousel-caption p {
        font-size: 13px;
}

.taConnectModal .carousel-indicators {
        bottom: -40px;
}

.taConnectModal .carousel-indicators .active {
        background-color: #085ed7;
}

.taConnectRightModal .modal-dialog {
        width: calc(100vw - 250px) !important;
        overflow: auto;
}

.taConnectRightModal .modalHeader {
        margin-bottom: 30px;
}

.taConnectRightModal .modal-header .close {
        text-align: left;
        width: 100%;
        padding: 0px;
        margin: 0px !important;
        font-size: 14px;
        font-weight: 600;
}

.taConnectRightModal .leftContent h5 {
        font-size: 32px;
        margin-bottom: 8px;
        font-weight: 600;
}

.taConnectRightModal .leftContent p {
        font-size: 15px !important;
        margin-bottom: 15px;
}

.taConnectRightModal .icon-arrow-left {
        border-right: 1px solid #d3d3d3;
        padding-right: 4px;
        font-size: 13px;
}

.taConnectRightModal .modal-body {
        padding: 30px;
}

.taConnectRightModal .rightLogo img {
        object-fit: cover;
        width: 380px;
}

.taConnectRightModal .btn-primary {
        font-size: 14px;
        padding: 8px 20px;
        font-weight: 500;
        border-radius: 8px !important;
}

/* Carousel container */
.taConnectRightModal .carousel {
        width: auto;
        height: auto;
        overflow: hidden;
        position: relative;
        margin: auto;
}

/* Carousel images wrapper */
.taConnectRightModal .carousel-images {
        display: flex;
        transition: transform 0.5s ease-in-out;
}

.taConnectRightModal .carousel-images {
        margin: 0px;
}

/* Individual images */
.taConnectRightModal .carousel-images img {
        width: 450px;
        height: 270px;
        object-fit: cover;
}

.taConnectRightModal .slideImg {
        margin-right: 20px;
        border: 1px solid #e8e8e8;
        border-radius: 5px;
        cursor: pointer;
}

/* Navigation buttons */
.taConnectRightModal .carousel-button {
        position: absolute;
        top: 50%;
        transform: translateY(-50%);
        background-color: rgba(0, 0, 0, 0.5);
        color: white;
        border: none;
        padding: 10px;
        cursor: pointer;
        z-index: 10;
}

.taConnectRightModal .carousel-button.prev {
        left: 5px;
        background-color: white;
        color: black;
        border-radius: 100px;
        height: 40px;
        width: 40px;
        font-size: 18px;
        padding: 0px;
        box-shadow:
                rgba(0, 0, 0, 0.25) 0px 54px 55px,
                rgba(0, 0, 0, 0.12) 0px -12px 30px,
                rgba(0, 0, 0, 0.12) 0px 4px 6px,
                rgba(0, 0, 0, 0.17) 0px 12px 13px,
                rgba(0, 0, 0, 0.09) 0px -3px 5px;
}

.taConnectRightModal .carousel-button.next {
        right: 5px;
        background-color: white;
        color: black;
        border-radius: 100px;
        height: 40px;
        width: 40px;
        font-size: 18px;
        padding: 0px;
        box-shadow:
                rgba(0, 0, 0, 0.25) 0px 54px 55px,
                rgba(0, 0, 0, 0.12) 0px -12px 30px,
                rgba(0, 0, 0, 0.12) 0px 4px 6px,
                rgba(0, 0, 0, 0.17) 0px 12px 13px,
                rgba(0, 0, 0, 0.09) 0px -3px 5px;
}

.taConnectRightModal .contentWrap {
        margin-top: 30px;
}
.taConnectRightModal .contentWrap .contentInfo {
        margin-bottom: 30px;
}

.taConnectRightModal .contentWrap .contentInfo h4 {
        font-size: 20px;
}

.taConnectRightModal .contentWrap .contentInfo p {
        font-size: 14px;
        line-height: 24px;
}

.taConnectRightModal .contentInfo ul {
        list-style-type: none;
        padding-left: 0px;
}

.taConnectRightModal .contentInfo ul li {
        font-size: 14px;
        line-height: 25px;
}

.taConnectRightModal .contentInfo .integration-impact li {
        margin-bottom: 12px;
}

.taConnectRightModal .contentInfo .integration-impact .warning {
        margin-right: 3px;
}

.taConnectRightModal .check,
.warning {
        font-weight: bold;
        margin-right: 8px;
}
.taConnectRightModal .check::before {
        content: '✅';
        margin-right: 0px;
}
.taConnectRightModal .warning::before {
        content: '⚠️';
        margin-right: 0px;
}

.taConnectRightModal .key-benefits li,
.integration-impact li {
        margin-bottom: 8px;
}

.taConnectRightModal .integration-impact li b {
        font-size: 15px;
}

.taConnectIntegModal .modal-content {
        width: 800px;
        box-shadow: 0px 0px 20px grey;
}

.taConnectIntegModal .modal-body {
        padding: 25px 20px;
}

.taConnectIntegModal .modal-header {
        text-align: center;
        display: block;
        border: unset;
        padding: 20px 0px 20px 0px;
        margin-bottom: 0px;
}

.taConnectIntegModal .modal-header .close {
        color: #b7b3b3;
        margin-right: -10px;
        opacity: 1;
        position: absolute;
        top: 16px;
        right: 15px;
        font-weight: 100;
}

.taConnectIntegModal .modal-header h5 {
        font-size: 18px;
}

.taConnectIntegModal .modalBody li {
        font-size: 14px;
        line-height: 22px;
        margin-bottom: 20px;
}

.taConnectIntegModal .modalBody .form-check {
        padding-left: 40px;
        text-align: center;
        font-size: 13px;
}

.imagePreviewModal .modal-content {
        width: 900px !important;
}

.imagePreviewModal .modal-header {
        border-bottom: 1px solid #e7e7e7;
}

/* End */

/* Connect Threatcop Admin css */

.connectTaAdminBtn .alert {
        padding: 15px 15px 0px !important;
        background: #213f61;
        position: relative;
}

.connectTaAdminBtn .content {
        color: white;
}

.connectTaAdminBtn .content h4 {
        font-size: 18px;
        margin-bottom: 3px;
        font-weight: 600;
        margin-top: 10px;
        color: white;
}
.connectTaAdminBtn sup {
        font-size: 11px;
        background: #f9ac30;
        padding: 2px 5px 2px 5px;
        border-radius: 5px;
        margin-left: 10px;
        color: white;
}

.connectTaAdminBtn .content span {
        font-size: 14px;
        font-style: italic;
        font-weight: 200;
        color: white;
}

.connectTaAdminBtn .content p {
        font-size: 14px;
        margin: 15px 0px 20px;
        font-weight: 200;
        color: white;
}

.connectTaAdminBtn .alert-dismissible .close {
        position: absolute;
        top: -10px;
        color: white;
        z-index: 999999;
}

.statusBanner p {
        font-size: 13px;
        margin-bottom: 4px;
        color: #0f5132;
}

.statusBanner span {
        font-size: 12px;
        font-weight: 700;
}

.backArrow {
        padding: 10px;
        display: flex;
        align-items: center;
        background: hsla(0, 0%, 100%, 0.08);
        border: 1px solid hsla(0, 0%, 100%, 0.149);
        border-radius: 5px;
        margin: 0px 16px;
}

.backIcon {
        background: #fff;
        padding: 10px 10px;
        width: 33px;
        height: 33px;
        border-radius: 30px;
        color: #000;
        cursor: pointer;
}

.go-to-threatcop-admin-text {
        color: #fff;
        margin-left: 10px;
        font-size: 14px;
}

.custom-disable {
        opacity: 0.65;
        pointer-events: none;
}

.content-type-container-row {
        display: flex;
        align-items: space-between !important;
}
/* .content-type-container {
                margin: 8px 0.8rem !important;
            } */

/* All Cards Wrapper */

.allCardsWrapper {
        padding: 0px 10px;
        margin-top: -5px;
        margin-right: -15px;
}

.allCardsWrapper .text-truncate {
        font-size: 13px;
        margin-bottom: 10px !important;
}

.allCardsWrapper .card-container {
        position: relative;
        padding: 5px;
}

.allCardsWrapper .card-container .wrapMain {
        border: 1px solid #dadde6;
        border-radius: 5px;
}

.allCardsWrapper .card-container .img-wrapper {
        width: 100%;
        object-fit: cover;
        border-radius: 5px 5px 0px 0px;
        border-bottom: 1px solid #dadde6;
}

.allCardsWrapper .card-container .cardBody {
        padding: 10px;
}

/*  */
.tooltip-info-icon {
        cursor: pointer;
}

.tooltip-info-icon .tiinfoIcon {
        font-size: 12px;
}

.tooltip-info-icon {
        position: relative;
}
.tooltip-info-icon .hover-box {
   position: absolute; /* when appended to body */
     z-index: 2;
     pointer-events: auto;
    min-width: 100%;
     max-width: 100%;
    top: 0px;
    right: 0;
    border: 1px solid #e1e5ee;
    background: #d8dadcdb;
    backdrop-filter: blur(5px);
    padding: 15px;
    border-radius: 5px;
    box-shadow: 0px 15px 22px #6f6f6f;
    overflow: auto;
    opacity: 0;
    pointer-events: none;
    transform: translateY(30px);
    transition: opacity 0.3s cubic-bezier(0.4, 0, 0.2, 1), transform 0.3s cubic-bezier(0.4, 0, 0.2, 1);
}
.tooltip-info-icon:hover .hover-box {
        opacity: 1;
        pointer-events: auto;
        transform: translateY(0);
}

.tooltip-previewBtn {
        margin-top: 12px !important;
}

.tooltip-info-icon:hover .hover-box {
        display: block;
}

.tooltip-info-icon .hover-box h3 {
      font-size: 14px;
    margin-bottom: 10px;
    line-height: 20px;
    font-weight: 600;
}

.tooltip-info-icon .hover-box p:nth-last-child(1) {
        margin-bottom: 0;
}

.tooltip-info-icon .hover-box p {
        margin-bottom: 2px;
        font-size: 12px;
        color: #272727;
        display: flex;
}
.tooltip-info-icon p span {
        margin-right: 5px;
        color: #898989;
        font-size: 10px;
        display: block;
        width: 10px;
}

.tooltip-info-icon strong {
        font-size: 12px;
        font-weight: 600;
        display: contents;
}

.tooltip-info-icon .videoPlayer {
       margin-bottom: 5px !important;
}

.tooltip-info-icon .videoTimer {
        margin-bottom: 5px;
        display: flex;
        align-items: center;
        flex-wrap: wrap;
}

.tooltip-info-icon .videoTimer h6 {
        color: #085ed7;
        font-size: 12px;
        font-weight: 600;
        margin-bottom: 0px;
        white-space: nowrap !important;
}

.courseActionButtons {
        margin-top: 12px;
}

.courseActionButtons .btn{
       margin-bottom: 10px;
}


/* end */

.allCardsWrapper .card-container .cardFooter {
        margin-top: 5px;
        display: flex;
        align-items: center;
        justify-content: space-between;
}
.allCardsWrapper .card-container .cardFooter .cardBadge {
        background: #f6f6f6;
        padding: 5px;
        font-size: 10px;
        border-radius: 5px;
        margin-right: 5px;
        border: 1px solid #e6e6e6;
}

.allCardsWrapper .card-container .cardFooter .cardMins {
        font-size: 11px;
        color: #4d5054;
}

.allCardsWrapper .card-container .creativeIMGwrapper {
        width: 100%;
        object-fit: cover;
        border-radius: 5px 5px 0px 0px;
        height: 230px;
        object-position: top;
        border-bottom: 1px solid #dadde6;
}

.right-Section .pills-wrapperbtns {
        display: flex;
        justify-content: space-between;
        padding: 0;
        margin: 0px -5px;
        margin-bottom: 15px;
}
.right-Section .pills-wrapperbtns .btn-outline-primary {
        background: #f6f6f6;
        border: 1px solid #e0e2e6;
        width: 100%;
        margin: 0px 5px;
        padding: 10px 5px;
        color: #636567;
        cursor: pointer;
}

.right-Section
        .pills-wrapperbtns
        .btn-outline-primary:not(:disabled):not(.disabled).active {
        background-color: #0b5ed7;
        border: none;
}

.right-Section .pills-wrapperbtns input[type='radio'] {
        display: none;
}

.creativesInfo {
        margin-top: 20px;
        margin-left: 5px;
        display: flex;
        align-items: center;
        cursor: unset;
}

.creativesInfo .txtInfo {
        color: #aa8f16;
        font-size: 13px;
}

.creativesInfo .tiIcon {
        color: #aa8f16;
}

.disabled-row-tr {
        opacity: 0.5;
        pointer-events: none;
}

.toggle-container {
        display: flex;
        align-items: center;
        gap: 10px;
        font-family: sans-serif;
}

.header-logo-switch {
        position: relative;
        display: inline-block;
        width: 40px;
        height: 20px;
}

.header-logo-switch input {
        opacity: 0;
        width: 0;
        height: 0;
}

.header-logo-slider {
        position: absolute;
        cursor: pointer;
        top: 0;
        left: 0;
        right: 0;
        bottom: 0;
        background-color: #ccc;
        transition: 0.4s;
        border-radius: 20px;
}

.header-logo-slider:before {
        position: absolute;
        content: '';
        height: 16px;
        width: 16px;
        left: 2px;
        bottom: 2px;
        background-color: white;
        transition: 0.4s;
        border-radius: 50%;
}

input:checked + .header-logo-slider {
        background-color: #4caf50; /* Green */
}

input:checked + .header-logo-slider:before {
        transform: translateX(20px);
}

/* checkBox Card */

:root {
        --card-line-height: 1.2em;
        --card-padding: 1em;
        --card-radius: 0.5em;
        --color-green: #558309;
        --color-gray: #e2ebf6;
        --color-dark-gray: #c4d1e1;
        --radio-border-width: 2px;
        --radio-size: 1.5em;
}

.emailSeding .campaignCard {
        background-color: #fff;
        border-radius: var(--card-radius);
        position: relative;
}

.emailSeding .radio {
        font-size: inherit;
        margin: 0;
        position: absolute;
        right: calc(var(--card-padding) + var(--radio-border-width));
        top: calc(var(--card-padding) + var(--radio-border-width));
}

@supports (-webkit-appearance: none) or (-moz-appearance: none) {
        .emailSeding .radio {
                appearance: none;
                -webkit-appearance: none;
                -moz-appearance: none;
                background: #fff;
                border: 2px solid #e2ebf6;
                border-radius: 50%;
                cursor: pointer;
                height: var(--radio-size);
                outline: none;
                transition:
                        background 0.2s ease-out,
                        border-color 0.2s ease-out;
                width: var(--radio-size);
        }
        .emailSeding .radio::after {
                border: var(--radio-border-width) solid #fff;
                border-top: 0;
                border-left: 0;
                content: '';
                display: block;
                height: 11px;
                left: 24%;
                position: absolute;
                top: 50%;
                transform: rotate(45deg) translate(-50%, -50%);
                width: 0.375rem;
        }
        .emailSeding .radio:checked {
                background: #558309;
                border-color: #558309;
        }

        .emailSeding .card:hover .radio {
                border-color: var(--color-dark-gray);
        }
        .emailSeding .card:hover .radio:checked {
                border-color: var(--color-green);
        }
}
.emailSeding .plan-details {
        min-height: 181px;
        border: 2px solid #e1e5ed;
        border-radius: 0.5em;
        cursor: pointer;
        display: flex;
        flex-direction: column;
        padding: 1em;
        transition: border-color 0.2s ease-out;
}

.emailSeding .card:hover .plan-details {
        border-color: var(--color-dark-gray);
}

.emailSeding .radio:checked ~ .plan-details {
        border-color: #558320;
}

.emailSeding .radio:focus ~ .plan-details {
        box-shadow: 0 0 0 2px var(--color-dark-gray);
}

.emailSeding .radio:disabled ~ .plan-details {
        color: var(--color-dark-gray);
        cursor: default;
}

.emailSeding .radio:disabled ~ .plan-details .plan-type {
        color: var(--color-dark-gray);
}

.emailSeding .card:hover .radio:disabled ~ .plan-details {
        border-color: var(--color-gray);
        box-shadow: none;
}

.emailSeding .card:hover .radio:disabled {
        border-color: var(--color-gray);
}

.emailSeding .suHeading {
        margin-bottom: 10px !important;
}

.emailSeding .spanColor {
        color: black;
}

/*  Modal for Version History Css */

.versionHistory .modalBody {
        padding: 1rem !important;
}

.versionHistory .tab input {
        position: absolute;
        opacity: 0;
        z-index: -1;
}

.versionHistory .version-date {
        font-size: 10px;
        color: #7f7f7f;
        margin-bottom: 0;
        margin-top: 5px;
}

.versionHistory .tab__content {
        max-height: 0;
        overflow: hidden;
        transition: all 0.35s;
}

.versionHistory .tab input:checked ~ .tab__content {
        max-height: 40rem;
}

.versionHistory .tab__content ul {
        margin-bottom: 0px !important;
        padding-left: 20px !important;
        font-size: 13px !important;
        padding-bottom: 5px !important;
}

.versionHistory .tab__content ul li {
        font-size: 12px !important;
        margin-bottom: 5px !important;
}

/* Visual styles */

.versionHistory .tab__label span {
        padding-right: 25px !important;
}

.versionHistory .tab__label,
.tab__close {
        display: flex;
        color: white;
        background: var(--theme);
        cursor: pointer;
}

.versionHistory .tab {
        position: relative;
        margin-bottom: 5px;
        border-bottom: 1px solid #e2e5ed !important;
}

.versionHistory .tab__label::after {
        content: '\276F';
        width: 1em;
        height: 1em;
        text-align: center;
        transform: rotate(90deg);
        transition: all 0.35s;
        position: absolute;
        right: 0;
        top: 15px;
}

.versionHistory .tab input:checked + .tab__label::after {
        transform: rotate(270deg);
}

.versionHistory .tab__content p {
        margin: 0;
        padding: 1rem;
}

.versionHistory .tab__close {
        justify-content: flex-end;
        padding: 0.5rem 1rem;
        font-size: 0.75rem;
}

.versionHistory .accordion--radio {
        --theme: var(--secondary);
}

/* Arrow animation */
.versionHistory .tab input:not(:checked) + .tab__label:hover::after {
        animation: bounce 0.5s infinite;
}

@keyframes bounce {
        25% {
                transform: rotate(90deg) translate(0.25rem);
        }
        75% {
                transform: rotate(90deg) translate(-0.25rem);
        }
}

.versionHistory .tab__label {
        font-size: 13px !important;
        border: unset;
        background: #fff !important;
        padding: 0px !important;
        padding-bottom: 10px !important;
        display: block !important;
        background-color: rgba(0, 0, 0, 0.03);
        color: #000000 !important;
        justify-content: space-between;
        margin-bottom: 10px !important;
        padding-bottom: 0px !important;
}

.versionHistory .tab__label span {
        margin-left: auto; /* Pushes the span to the right */
}

/*  Modal for Version History End */
/*  Modal for Version History End */

.analyticsTable .dFlex {
        display: flex;
        align-items: center;
}

.analyticsTable .dFlex .courseName {
        margin-left: 15px;
}

.analyticsTable .dFlex .courseName .campTitle {
        font-size: 0.8125rem;
        color: #434343;
        margin-bottom: 0px;
        font-weight: 600;
}

.analyticsTable .dFlex .courseName .blockWrapper {
        font-size: 12px;
        color: #949494;
}

.analyticsTable .dFlex .courseImg {
        width: 40px;
        height: 40px;
}

.analyticsTable .metricsSummary span {
        margin-right: 10px;
}

.analyticsTable .badgeSecondary {
        background: #e1e1e1;
        color: #000;
}

.analyticsTable .badgePrimary {
        color: #fff;
        background-color: #007bff;
}

.analyticsTable .badgeSuccess {
        color: #fff;
        background-color: #28a745;
}

.analyticsTable .btn-md {
        padding: 0.3125rem 0.4375rem 0.3125rem 0.3125rem;
        font-size: 0.625rem;
        white-space: nowrap;
}

.analyticsTable .w-35 {
        width: 28%;
}

.analyticsWrapper .table-responsive {
        overflow-x: auto !important;
}

.analyticsTable .w-30 {
        width: 30%;
}

.analyticsTable .bgnotStarted {
        background-color: unset !important;
}

/* view Analytics Modal  */
.viewanalyticsRightModal .analyticsModal {
        width: 900px !important;
        overflow: auto;
}

.viewanalyticsRightModal .modal-title span {
        font-size: 12px;
}

.viewanalyticsRightModal .productLogoImage {
        width: 71px;
        height: 65px;
        background: #f6f6f6;
        border-radius: 5px;
        position: relative;
        border: 1px solid #e2e5ed;
}

.viewanalyticsRightModal .productLogoImage img {
        position: absolute;
        top: 50%;
        left: 50%;
        transform: translate(-50%, -50%);
        width: 50px;
}

.productName {
        border-bottom: 1px solid #e1e5ee;
        padding-bottom: 10px;
}

.viewanalyticsRightModal .d-flex {
        align-items: center;
}

.viewanalyticsRightModal .rightInformation {
        padding-left: 15px;
}

.viewanalyticsRightModal .rightInformation h5 {
        font-size: 15px;
}

.viewanalyticsRightModal .productName .d-flex {
        align-items: center;
}

.viewanalyticsRightModal .dataCard {
        padding-right: 10px;
        margin-right: 5px;
        border-right: 1px solid #e0e0e0;
}

.viewanalyticsRightModal .dataCard span {
        font-weight: bold;
        color: black;
}

.viewanalyticsRightModal .dataCard:last-child {
        border-right: unset;
}

.dataCard p {
        margin-bottom: 0;
        font-size: 12px;
}

.progressColor p {
        color: #1967d2 !important;
}

.viewanalyticsRightModal .tiIcon {
        margin-right: 5px !important;
}

.viewanalyticsRightModal .cardWrapper {
        padding-top: 15px;
}

.viewanalyticsRightModal .cardWrapper .switchTab {
        margin-bottom: 20px;
}

.viewanalyticsRightModal .switchTab {
        background: #f6f6f6;
        padding: 4px;
        display: inline-block;
        border-radius: 5px;
        border: 0.5px solid #e2e5ed;
}

.viewanalyticsRightModal .nav-pills .nav-link.active {
        background: #1967d2 !important;
        color: #fff;
        border-radius: 4px !important;
}

.viewanalyticsRightModal .nav-pills .nav-link {
        padding: 7px 16px !important;
        font-size: 12px !important;
}

.overviewAnalyticsWrapper .analyticsWrapper {
        margin-bottom: 10px;
        padding: 5px;
}

.overviewAnalyticsWrapper .head {
        font-size: 14px;
}

.overviewAnalyticsWrapper .overviewBlockWrapper {
        border: 1px solid #ddd;
        height: 345px;
        padding: 15px;
        border-radius: 10px;
}

.overviewAnalyticsWrapper .overviewBlockWrapper .labelWrapper {
        text-align: center;
        margin: -20px;
}

.analyticsTableWrapper .tableBody {
        height: 300px;
        overflow: auto;
}

.analyticsTableWrapper .dashCard .dashCT thead th {
        border: 0;
        padding: 10px 10px 5px 10px;
        font-size: 12px !important;
        font-weight: 600;
}

.courseInfoTable {
        display: flex;
        align-items: center;
}

.popuparContentWrap .blank_wrap h6 {
        font-size: 12px;
        margin-bottom: 0;
        display: -webkit-box !important;
        line-clamp: 1;
        -webkit-line-clamp: 2;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 100%;
}
.popuparContentWrap .typeBadges {
        font-size: 10px !important;
}

.analyticsTableWrapperr .addEllipsis .blank_wrap h6 {
        display: -webkit-box !important;
        line-clamp: 1;
        -webkit-line-clamp: 1;
        -webkit-box-orient: vertical;
        overflow: hidden;
        text-overflow: ellipsis;
        width: 100%;
}

.overviewAnalyticsWrapper .tableBody img {
        width: 42px;
        margin-right: 10px;
}

.trainingBlockWrapper {
        /* padding: 20px; */
        border: 1px solid #ddd;
        border-radius: 10px;
}

.trainingBlockWrapper .trainingContentWrapper {
        padding: 15px;
}

.trainingBlockWrapper .boxWrap .imgBox {
        text-align: center;
        background: #f6f6f6;
        padding: 15px;
}

.trainingBlockWrapper .boxWrap .imgBox img {
        width: 100px;
        margin: 0 auto;
}

.trainingBlockWrapper .trainingContent {
        display: flex;
        align-items: center;
        margin-bottom: 8px;
        justify-content: space-between;
}

.trainingBlockWrapper .trainingContent > :last-child {
        margin-bottom: 0;
}

.trainingBlockWrapper .trainingContent .tiIcon {
        margin-right: 10px;
        font-size: 12px;
}

.trainingBlockWrapper .boxWrap .trainingContent h5 {
        font-size: 12px;
        line-height: 20px;
        margin-bottom: 0px;
}

.trainingBlockWrapper .boxWrap .imgBox h6 {
        margin-bottom: 0px;
        font-size: 14px;
}

.trainingBlockWrapper.courseBadge .trainingContent h5,
.trainingBlockWrapper.courseBadge .trainingContent h6 {
        color: #0a3622;
}

.trainingBlockWrapper.creativeBadge .trainingContent h5,
.trainingBlockWrapper.creativeBadge .trainingContent h6 {
        color: #052c65;
}

.trainingBlockWrapper.quizBadge .trainingContent h5,
.trainingBlockWrapper.quizBadge .trainingContent h6 {
        color: #664d03;
}

.trainingBlockWrapper.gameBadge .trainingContent h5,
.trainingBlockWrapper.gameBadge .trainingContent h6 {
        color: #965c11;
}

.trainingBlockWrapper .boxWrap .trainingContent h6 {
        font-size: 14px;
        margin-bottom: 0px;
}

/* .trainingContent{
/* .trainingContent{
                margin-left: 10px;
                text-align: center;
            } */

.boxWrap .dFlex {
        width: 100%;
        display: flex;
        align-items: center;
        justify-content: space-between;
}

.overviewAnalyticsWrapper .overviewCard {
        border: 1px solid #ddd;
        border-radius: 0px;
        width: 235px;
        height: 130px;
        margin: 0px 3px;
        margin-bottom: 6px;
        padding: 14px;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
}

.overviewAnalyticsWrapper .overviewCard h5 {
        color: #434343;
        font-size: 12px;
        margin-bottom: 10px;
        line-height: 16px;
}

.infocardWrap .setRow,
.overviewAnalyticsWrapper .setRow {
        display: flex;
        align-items: center;
        margin: 0px -7px;
}

.infocardWrap .overviewCard {
        border: 1px solid #ddd;
        border-radius: 0px;
        width: 32%;
        height: 130px;
        margin: 0px 3px;
        margin-bottom: 5px;
        padding: 14px;
        text-align: center;
        display: flex;
        align-items: center;
        justify-content: center;
        box-shadow: 0 4px 8px rgba(0, 0, 0, 0.05);
}

.infocardWrap .overviewCard h5 {
        color: #434343;
        font-size: 14px;
        margin-bottom: 10px;
        line-height: 16px;
}

.infocardWrap .overviewCard .percent {
        color: #949494;
        font-size: 14px;
        margin-left: 8px;
}

.infocardWrap .overviewCard h6 {
        font-size: 20px;
}

#chartdiv {
        width: 100%;
        height: 275px;
}

#TrainingpieChart {
        width: 100%;
        height: 250px;
        display: flex;
        align-items: center;
        justify-self: unset;
}

/* Override ApexCharts axis label styling if any opacity is applied */
#completionchart .apexcharts-xaxis text,
#completionchart .apexcharts-yaxis text {
        fill: #000 !important;
        opacity: 1 !important;
}

.overviewBlockWrapper .overviewWrap {
        border: 1px solid #ddd;
        padding: 15px;
        height: 350px;
        overflow: auto;
}

.overviewAnalyticTable {
        border: 1px solid #ddd;
}

.overviewAnalyticTable .switchTab .nav-link {
        background: #f6f6f6 !important;
}

.year-dropdown {
        display: flex;
        align-items: center;
}

.year-dropdown .dropdown-toggle {
        background-color: #f7f7f7 !important;
        font-size: 11px !important;
        padding: 2px 8px;
}

.year-dropdown .year-label {
        font-size: 13px;
        margin-right: 10px;
        margin-bottom: 0px;
        font-weight: 400;
}

.viewanalyticsTable .table td:first-child {
        font-weight: bold;
}

.viewanalyticsRightModal .viewanalyticsTable .badgePrimary {
        color: #007bff !important;
        background-color: unset !important;
}

.viewanalyticsRightModal .viewanalyticsTable .badgeSuccess {
        color: #28a745;
        background-color: unset !important;
}

.viewanalyticsRightModal .viewanalyticsTable .badgeWarning {
        color: #d6302e !important;
}

.learnerTable .blockWrapper {
        display: inline-flex;
        align-items: center;
}

.learnerTable .blockWrapper .midBlock {
        margin: 0px 18px;
}
.learnerTable .blockWrapper .midBlock p {
        color: #464646;
        text-align: center !important;
        font-size: 12px;
}

.learnerTable .blockWrapper .midBlock span {
        font-size: 10px;
}

.setscrollHeight {
        height: calc(100vh - 194px);
}

.searchMt {
        padding: 72px 15px 10px 15px;
        background: white;
}

.searchMt .heading h4 {
        font-size: 18px;
        color: #303840;
        margin-bottom: 10px;
        margin-top: 0;
        word-break: break-word;
        text-align: left;
        font-weight: 600;
        display: flex;
        align-items: center;
}

.searchMt .heading {
        margin-bottom: 20px;
}

.searchMt .heading p {
        font-size: 13px;
        font-weight: 600;
        color: rgba(39, 44, 51, 0.7);
}

.selectBtn .button-group {
        display: flex;
        gap: 10px;
        flex-wrap: wrap !important;
}

.selectBtn .toggle-btn {
        padding: 5px 10px;
        border: 1px solid #e1e5ee !important;
        border-radius: 5px;
        background-color: #f6f6f6;
        color: black;
        cursor: pointer;
        display: flex;
        align-items: center;
        gap: 5px;
        border: none;
        font-size: 12px;
}

.selectBtn .toggle-btn.active {
        background-color: #1666d1;
        color: white;
}

.searchHeader {
        align-items: center;
}

.searchHeader h4 {
        margin-bottom: 0;
        font-size: 17px;
}

.searchHeader p {
        margin-left: 10px;
        text-decoration: underline;
        font-size: 13px;
}

.videoThumbnail {
        height: 170px;
}

.courseSearchCard {
        flex: 0 0 20%;
        max-width: 20%;
}

.note_help {
        font-size: 13px;
        line-height: 18px;
        font-style: italic;
}

.headerSearchBtn {
        position: relative;
}

.headerSearchBtn .search-container {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-flow: row wrap;
        flex-flow: row wrap;
        -ms-flex-align: center;
        align-items: center;
}

.headerSearchBtn .new_sup {
        height: 18px;
        padding: 8px;
        margin-left: 0px;
        margin-top: 0px;
        position: absolute;
        right: -48px;
        top: -6px;
}

.headerSearchBtn .search-container .searchIcon {
        color: #000000;
        height: 35px;
        display: flex;
        font-size: 12px;
        padding: 0px 7px 0px 8px;
        background: #f6f6f6;
        align-items: center;
        justify-content: center;
        border: 1px solid rgba(72, 94, 144, 0.16);
        border-radius: 0px 5px 5px 0px;
        margin-left: -12px;
}

.headerSearchBtn .search-container .searchBar {
        width: 230px;
        border-radius: 5px;
        padding: 5px 10px;
        border-right: unset !important;
        border: 1px solid rgba(72, 94, 144, 0.16);
        background-color: #fff;
}

.setLanguageIcon .langSelect {
        background-color: #ffffff;
        color: #676767;
        font-size: 11px;
        border: unset;
        padding: unset;
        height: 15px;
}

.setLanguageIcon .language-selector {
        display: flex;
        align-items: center;
        gap: 0px;
        padding: 0px 3px 0px 5px;
}

.setLanguageIcon .language-selector i {
        font-size: 14px;
        color: #333;
}

.analytics-logo-box {
        width: 60px;
        height: 60px;
        display: flex;
        align-items: center;
        justify-content: center;
        overflow: hidden;
        border-radius: 8px;
}
.analytics-logo-img {
        max-width: 100%;
        max-height: 100%;
        object-fit: contain;
}

.footer-ctn-section {
        position: fixed;
        right: 0;
        width: 100%;
        z-index: 8;
        bottom: 0;
}

/* Sticky column logic: if first sticky column is removed, second sticky column shifts to left:0 */
.fixstickyinTable th.sticky-col-2:first-child,
.fixstickyinTable td.sticky-col-2:first-child {
        left: 0 !important;
}

.fixstickyinTable .sticky-col-1 {
        position: sticky;
        top: 0;
        background: #f8f9fa;
        z-index: 2;
}

.fixstickyinTable tbody tr:nth-child(1) > td {
        border-top: none;
}

.fixstickyinTable th,
.fixstickyinTable td:not(:nth-child(2)) {
        white-space: nowrap !important;
}
.fixstickyinTable th.sticky-col-1,
.fixstickyinTable th.sticky-col-2 {
        position: sticky;
        z-index: 3;
        left: 0;
}
.fixstickyinTable th.sticky-col-2 {
        left: 0;
        border: none;
}
.fixstickyinTable td.sticky-col-1 {
        position: sticky;
        left: 0;
        background: #fff;
        z-index: 1;
}
.fixstickyinTable td.sticky-col-2 {
        position: sticky;
        left: 0px;
        background: #fff;
        z-index: 1;
}
.fixstickyinTable th.sticky-col-1,
.fixstickyinTable th.sticky-col-2 {
        z-index: 3;
}
.fixstickyinTable .table-responsive {
    overflow-x: auto;
    position: relative;
    max-height: calc(100vh - 235px) !important;
}

.customSmtpLogsDisplay {
        font-family: monospace;
        font-size: 13px;
        color: #e0e0e0;
        background-color: #1e1e1e;
        padding: 15px;
        border-radius: 6px;
        border: 1px solid #444;
        overflow-y: auto;
        white-space: pre-wrap;
        word-break: break-word;
}

.coursePreview .rightSection .wrapTop .check-bg-none-circle {
        border: 1px solid #e1e3eb;
        background: white;
}

/* UnleashedBanner Styles*/
/* UnleashedBanner Styles*/

.unleashedBanner .alert-success {
        background-image: linear-gradient(
                to right,
                rgba(0, 73, 176, 100),
                rgba(11, 37, 86, 100)
        ) !important;
        padding: 20px !important;
        border-radius: 0.25rem !important;
}

.unleashedBanner .content h4 {
        color: white;
        font-size: 28px;
        font-weight: 600;
        margin-bottom: 5px;
}

.unleashedBanner .content h5 {
        color: white;
        font-size: 16px;
        font-weight: 400;
        margin-bottom: 20px;
}

.unleashedBanner .imgSection {
        display: inline-block;
        border-radius: 5px;
}

.unleashedBanner .rightImg {
        display: flex;
        align-items: center;
        justify-content: center;
}

.unleashedBanner .rightDflex {
        display: flex;
        align-items: center;
}

.unleashedBanner .rightDflex .leaderImg {
        width: 135px !important;
}

.unleashedBanner .rightImg img {
        width: 110px;
        height: auto;
}

.unleashedBanner .close {
        opacity: 9 !important;
        position: absolute !important;
        top: 0px !important;
        right: 10px !important;
        color: white !important;
        padding: 8px !important;
        z-index: 9999;
}

/* #remainderListModal {
        z-index: 1090 !important;
} */

#add-reminder-modal {
        z-index: 1100 !important;
}

#edit-reminder-modal{
        z-index: 1100 !important;    
}

/* ************************
            New Common Tab CSS Start
            ****************************/

.mainTabMenu {
        width: 100% !important;
        border-radius: 0px;
        padding: 0px 0px 15px;
        background: #fff !important;
}

.learnerTab {
        background: #f6f6f6;
        padding: 4px;
        display: inline-block;
        border-radius: 5px;
        border: 1px solid #e0e3eb;
}

.learnerTab .nav-pills .nav-link.active {
        color: #fff;
        background: #1967d2 !important;
        border-radius: 4px !important;
}

.learnerTab .nav-pills .nav-link {
        padding: 7px 12px !important;
        font-size: 12px !important;
}

.learnerTab .nav-pills .nav-link {
        color: #838383;
}

.mainTabMenu .dropdown-color-white {
        color: #000 !important;
        background-color: #fff;
        border-color: #e0e3eb;
}

/* ************************
/* ************************
            New Common Tab CSS End
            ****************************/

/* ******************************
                Create New Enrollment Css Start
            ***************************/

.main-box-wrapper {
        margin-bottom: 20px !important;
}

.add-enrollment-button-box {
        padding: 25px 0px;
        background: #fafafa;
        border: 2px dotted #d6d6d6;
}

.add-enrollment-button-box .middle-flex-box {
        display: flex;
        text-align: center;
        align-items: center;
        justify-content: center;
}

.add-enrollment-button-box .middle-flex-box img {
        width: 50px;
}

.add-enrollment-button-box .middle-flex-box .btn-container {
        margin-top: 20px;
        margin-bottom: 25px;
}

.add-enrollment-button-box .middle-flex-box h6 {
        color: #495057;
        font-size: 13px;
        margin-bottom: 0px;
}

.enrollment-banner {
}

.main-create-enrollment .card-section {
        border: 1px solid #e0e3eb;
}

.main-create-enrollment .rotate {
        transform: rotate(180deg);
        transition: transform 0.3s ease;
}

.more-details .fa-chevron-down {
        transition: transform 0.2s;
        color: #0c5ed7;
}
.more-details .fa-chevron-down.rotate {
        transform: rotate(180deg);
}

.accordion-arrow .btnConfigure {
        background-color: #f6cfcf;
        color: #d30d0d !important;
        font-size: 11.5px;
        font-weight: 600;
        margin-right: 10px !important;
}

.card-section .card-header .accordion-btn {
        padding: 10px !important;
        cursor: auto !important;
}

.card-header .more-details-span {
        color: #1967d2;
        font-size: 12px;
        font-weight: 600;
        margin-right: 2px;
}

.main-create-enrollment .card-header .accordion-arrow {
        display: flex;
        align-items: center;
}

/* .select-course-btn .card-image{
/* .select-course-btn .card-image{
                width: 55px;
                flex-shrink: 0;
                margin-right: 12px;
            }

            .select-course-btn .card-image img{
                width: 55px !important;
                    height: 55px !important;
                    object-fit: contain !important;
                    border-radius: 5px !important;
            } */



            .checkBox-selector{
                margin-top: 1px;
            }
        

   .checkBox-selector .dropdown-menu .dropdown-item{
        display: flex;
        align-items: center;
   }


      .checkBox-selector .dropdown-toggle-checkbox{
                margin-right: 5px;
                width: 12px;
                height: 12px;
   }

     #selectedItems{
        margin-bottom: 10px;
     }

   #selectedItems .selected-badge-pill{
    gap: 5px;
    font-size: 10px;
    padding: 5px 10px;
    border-radius: 4px;
    display: inline-flex;
    align-items: center;
    margin-right: 10px;
    background: #f6f6f6;
    border: 1px solid #e0e3eb;
   }

 #selectedItems .selected-badge-pill .remove-item{
    color: white;
    padding: 0px 5px;
    font-size: 11px;
    background: #a9a9a9;

   }

.main-create-enrollment .setWidth {
        width: 55px;
        flex-shrink: 0;
        margin-right: 12px;
}

.main-create-enrollment .setWidth img {
        width: 55px !important;
        height: 55px !important;
        object-fit: contain !important;
        border-radius: 5px !important;
}

.accordianHeadWrapper {
        display: flex;
        align-items: center;
        padding: 8px 15px;
        background: #f8f8f8;
}

.select-course-btn .dFlex {
        display: flex;
        align-items: center;
}

.select-course-btn .card-meta .grey-badge {
        font-size: 10px !important;
        color: #212529;
}

.select-course-btn .course-content .card-meta {
        gap: 10px !important;
}

.card-section .section-One {
        display: flex;
        align-items: center;
}

.card-section .section-One .course-content .course-title {
        margin-bottom: 0px;
        color: #085ed7;
        text-decoration: underline;
        cursor: pointer;
}

.no-course-selected {
        color: #212529;
        font-size: 10px !important;
}

.select-course-btn .leacture-badge {
        color: #212529;
        font-size: 10px !important;
}
.select-course-btn section-two .number {
        font-weight: 600;
}

/* collapse body section */

.collapse-body-section {
        padding: 15px 15px 0px;
}

.collapse-body-section .info-box-section {
        margin-bottom: 30px !important;
}

.collapse-body-section .info-box-section .enrollment-title {
        font-size: 12px;
        color: #838383;
        font-weight: 600;
        margin-bottom: 10px;
}

.info-box-section .eye-icon {
        border-radius: 4px;
        background: #d8e7ff;
        border: 1px solid #b3d0ff;
        padding: 5px 10px;
        text-align: center;
}
.info-box-section .fa-eye {
        color: #1967d2;
}

.auto-sync-section {
        padding: 18px 0px 17px 0px;
        border-top: 1px solid #e7e7e7;
}

/* ******************************
/* ******************************
                Create New Enrollment Css End
            *********************************/

.leaderboardTabMenu .learnerTab {
        box-shadow: 0px 10px 15px grey;
}

.leaderboardTabMenu {
        margin-top: 15px;
        background: none !important;
}

.leaderboard_wrapper {
        position: absolute;
        width: 100%;
        bottom: 0;
}

.leaderboardRow {
        align-items: flex-end;
        gap: 20px;
        justify-content: center;
}

.leaderboard_banner {
        padding-top: 100px;
        background-position: bottom;
        background-repeat: no-repeat;
        background-size: cover;
        margin-top: -88px;
        margin-left: -15px;
        margin-right: -15px;
        margin-bottom: 20px;
        height: 370px;
        position: relative;
        z-index: -10;
}

.leaderboard_banner_1 {
        background-image: url('../assets/images/img/Overallbackground.png');
}

.leaderboard_banner_2 {
        background-image: url('../assets/images/img/department.jpg');
}

.leaderboard_banner_3 {
        background-image: url('../assets/images/img/bgimg3.png');
}

.leaderboard_content {
        margin-bottom: 20px;
}

.leaderboard_content .lcIcon {
        margin-bottom: 8px;
}

.leaderboard_content .lcIcon img {
        width: 20px;
}

.leaderboard_banner .leaderboard_card {
        text-align: center;
        width: 250px !important;
}

.leaderboard_content .lcName {
        font-size: 15px;
        font-weight: 700;
        margin-bottom: 5px;
}

.leaderboard_content .lcDesignation {
        color: #09090b99;
        font-size: 12px;
}

.leaderboard_content .lcPonts {
        padding: 4px 8px;
        border-radius: 20px;
        margin-left: 1px;
        font-size: 11px;
        font-weight: 600;
        background: #fff6ce;
        border: 1px solid #ffe15a;
        border: 1px solid #ffe15a;
}

.leaderboard_banner .leaderboard_block {
        border-radius: 50px 50px 0px 0px;
}

.leaderboard_content .lcPonts .star-point {
        margin-right: 5px;
}

.leaderboard_content .lcPonts .star-point .fa-star {
        padding: 2px;
        font-size: 8px;
        color: #ffc107;
        border-radius: 50%;
        border: 0.5px solid #ffc107;
}

.leaderboard_block .rankNo {
        font-weight: 900;
        font-size: 70px;
        margin-bottom: 0px;
        display: flex;
        align-items: center;
        justify-content: center;
}

.leaderboard_block .rankNo.rank_1 {
        height: 150px;
}

.leaderboard_block .rankNo.rank_2 {
        height: 130px;
}

.leaderboard_block .rankNo.rank_3 {
        height: 130px;
}

.leftItem .leaderboard_block {
        background: linear-gradient(270.03deg, #9591ce 25.76%, #dbd8f0 99.97%);
}

.centerItem .leaderboard_block {
        background: linear-gradient(270deg, #efc62f 0%, #ffe693 100%);
}

.RightItem .leaderboard_block {
        background: linear-gradient(270deg, #61ae76 0%, #a1ce7b 100%);
}

.back-img {
        background: url('../assets/images/olympic-2025/campaign-background.png');
        /* background: url(../assets/images/img/arrow-img.png); */
        width: 100%;
        height: 100%;
        background-size: cover;
}

.campaign-features-wrapper {
        position: relative;
}
.abs-img {
        width: 100%;
}
.cam-close {
        position: absolute;
        top: 10px;
        right: 10px;
        background: #204275 !important;
        width: 30px;
        height: 30px;
        border-radius: 100%;
        opacity: 1;
        border: 2px solid #085ed7 !important;
        font-size: 16px;
}
.cam-close {
        text-shadow: none;
        color: #fff;
}
.cyberBannerFooter {
        margin-top: 40px;
}
.cyberBannerFooter .btn {
        padding: 10px 15px !important;
}

.campaign-features {
        height: 100%;
        margin-bottom: 25px;
        display: flex;
        align-items: center;
}

.feature-icon {
        margin-right: 20px;
}
.feature-icon img {
        width: 40px;
}
.feature-title {
        color: #fff;
        font-size: 25px;
        margin-bottom: 20px;
}
.feature-content p {
        color: #fbc142;
        font-size: 15px;
        line-height: 20px;
        font-weight: 600;
}
.feature-content span {
        color: #fff;
        font-size: 12px;
        line-height: 18px;
        display: block;
        margin-top: 5px;
}
.cyber-olympic-header {
        margin-bottom: 35px;
}
.cyber-olympic-content h5 {
        font-size: 30px;
        font-weight: 700;
        margin-bottom: 8px;
        color: #fbc142;
}
.cyber-olympic-content p {
        font-size: 15px;
        line-height: 20px;
        color: #fff;
}
.modal-body-campaign {
        padding: 50px;
}
.btn-campaign-tutorial {
        background-color: #fbc142;
        border: 1px solid #fbc142;
        color: #000 !important;
}
.btn-campaign-tutorial:hover {
        background-color: #fbc142 !important;
        border: 1px solid #fbc142 !important;
        color: #000 !important;
        opacity: 0.8;
}
.flex-merge {
        display: flex;
        align-items: center;
        justify-content: space-between;
}
.mergeBtn {
        margin-right: 20px;
}
.close-icon {
        position: absolute;
        right: 10px;
        top: 5px;
        background: #085ed7 !important;
        border-radius: 100%;
        width: 16px;
        height: 16px;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        opacity: 1;
        color: #fff;
        text-shadow: unset !important;
}
.merge-enrollment-wrapper {
        border: 1px solid #e0e3eb;
        padding: 10px;
        border-radius: 5px;
}
.merge-enrollment-wrapper .preview-merge-enrollments:last-child {
        margin-bottom: 0px;
        border-bottom: none;
        padding-bottom: 0;
}
.preview-merge-enrollments {
        display: flex;
        align-items: center;
        gap: 5px;
        border-bottom: 1px solid #e7e7e7;
        margin-bottom: 10px;
        padding: 0px 10px 6px;
}
.preview-merge-enrollments .count {
        width: 5%;
        font-size: 12px;
}
.preview-merge-enrollments .enrollment-title {
        width: 75%;
        font-size: 12px;
}
.preview-merge-enrollments .btnSection {
        width: 20%;
        text-align: right;
}
.preview-merge-enrollments .btnSection .btn-sm {
        padding: 3px 8px;
        font-size: 10px;
}

.listing-checkbox[disabled],
.show-hide-checkboxes input[disabled] {
        cursor: not-allowed;
        opacity: 0.75;
        pointer-events: auto;
}

/* show not-allowed cursor for disabled checkbox wrapper, keep pointer events so tooltip works */
.tooltip-target[title] {
        cursor: not-allowed;
        display: inline-block;
}
.chart-flex {
        display: flex;
        align-items: center;
        margin-left: -40px;
}
.btnMarginright{
        margin-right: 10px;
}
.badgeFilter {
     border: 1px solid #ddd;
    padding: 4px 12px 6px 10px;
    border-radius: 20px;
    font-weight: 500;
}
.badgeFilter.active{
        background-color: #1967d2 !important;
        color: white !important;
}


.tempHeight{
 height: calc(100vh - 192px);
 overflow: hidden;
}


#leaderboardModalModal{
z-index: 10000 !important;
}