@font-face {
    font-family: Merriweather-Regular;
    src: url(../font/Merriweather-Regular.ttf);
}

.no-list-style {
    margin: 0;
    padding: 0;
    list-style: none;
}

.pad-left-1 {
    padding-left: 1.25rem !important;
}

.pad-left-2 {
    padding-left: 2rem !important;
}

.btn-no-style {
    background: none;
    color: inherit;
    border: none;
    padding: 0;
    font: inherit;
    cursor: pointer;
}

.flex-center {
    display: flex;
    justify-content: center;
    align-items: center;
}

.manage-courses {
    padding-top: 10px !important;
    padding-bottom: 5px !important;
}

.module-navigation img {
    width: 100px;
    cursor: pointer;
}

#parentLessonDiv {
    min-height: 79.7vh;
}

.module-navigation {
    align-self: first baseline;
}

    .module-navigation button:disabled {
        opacity: 0.5;
    }

.sticky-module-navigation {
    position: sticky;
    top: 115px;
    background-color: #f1f4f6;
    z-index: 999;
    width: 100%;
    margin-left: 0px !important;
    margin-right: 0px !important;
}

.edit-quiz-sec {
    min-height: 66vh;
}

.add-more-btn button {
    background-color: #0ea5e9 !important;
}

.side_menu {
    overflow-y: scroll;
    left: 0px !important;
}

.falshcard-description {
    border-radius: 5px;
    border-color: #b5b5b5;
}

/* Start - PAGE TITLE BAR */
.pageControlBar,
.pageTitleBar {
    z-index: 99 !important;
}

/* End - PAGE TITLE BAR */

.trial-user-date {
    margin-top: 10px !important;
}

.pagecontainer {
    padding: unset;
}

.toggle-label {
    font-family: "Montserrat-medium" !important;
}

/* Start - USER COURSE ACCESS */

.course-access-table {
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.course-access-clone {
    margin-left: 25px;
    text-align: center;
}

.course-access-table .bulk-update {
    display: flex;
    flex-direction: row;
}

.course-access-pagination {
    display: flex;
    flex-direction: row;
    flex-grow: 6;
    justify-content: end;
}

.course-access-btn {
    font-size: 16;
    color: #fff;
    background-color: #0ea5e9;
    border: none;
    border-radius: 5px;
    padding: 5px 15px;
}

.video-preview .modal-dialog {
    max-width: 40% !important;
}

/* End - USER COURSE ACCESS */

/* ----  Header --- */
#custom-Navbar {
    position: unset !important;
}

#menu-active {
    background: unset !important;
}

.fa-eye-slash {
    cursor: pointer;
    float: right;
    margin-top: -28px;
    margin-right: 33px;
    position: relative;
    top: 0px;
}

.user-Details-password {
    position: absolute;
    right: -20px;
}

    .user-Details-password .fa-eye-slash {
        cursor: pointer;
        margin-right: 33px !important;
    }

    .user-Details-password .fa-eye {
        cursor: pointer;
        margin-right: 33px !important;
    }

/* Dashboard */

.admin-dashboard .table tbody {
    cursor: pointer;
}

/* Start - MANAGE COURSES */

.icons-block {
    padding-top: 0px !important;
}

/* End - MANAGE COURSES */

.faq-section .user-tab .mt-4 {
    padding: 10px 22px 22px 22px;
    background-color: #f7f8fc;
}

.course-tab .toggle-col.align {
    align-self: auto;
    padding-left: 0;
}

.navbar-light .navbar-nav .nav-link {
    font-size: 16px !important;
}

.course-order-alignment {
    padding-top: 26px;
}

.course-order {
    width: 90px;
}

/* Style for Breadcrumb */
ul.breadcrumb {
    padding: 15px 0 !important;
}

    /* Display list items side by side */
    ul.breadcrumb li {
        cursor: pointer;
    }

        /* Add a color to all links inside the list */
        ul.breadcrumb li .select {
            cursor: context-menu;
        }

        ul.breadcrumb li span:hover {
            text-decoration: underline;
        }

.sidebar-box {
    height: auto !important;
    border: 1px solid #00000029;
}

    .sidebar-box .menu-main-title p {
        font-size: 18px !important;
    }

.sub-side-menu {
    left: 248px;
}

/* MENU CONTAINER ----- */

.sidebar-box .list_item {
    margin-left: 0px !important;
    opacity: 1 !important;
}

/* Sea Training Certificate */
.certificate-outline {
    padding: 10px;
}

.certificate-main {
    background-size: contain;
    padding: 9%;
    background-image: url("../images/certificate-bg.jpg");
    background-repeat: no-repeat;
    background-position-x: center;
    text-align: center;
}

    .certificate-main p,
    .certificate-main span {
        font-family: Merriweather-Regular;
        color: #4e4e4e;
        /* font-size: 16px; */
    }

    .certificate-main .para-sizing-imp {
        font-family: Merriweather-Regular;
        color: #4e4e4e;
        font-size: 12px !important;
    }

    .certificate-main .para-sizing {
        font-size: 12px !important;
    }

    .certificate-main .coc-banner {
        text-align: center;
    }

    .certificate-main .certificate-content {
        text-align: center;
    }

    .certificate-main .certification-width {
        width: 75%;
    }

    .certificate-main .content-pad {
        padding-top: 20px;
    }

    .certificate-main .para-margin {
        margin-bottom: auto;
    }

    .certificate-main .hr-styling {
        margin-top: 40px;
        color: #4e4e4e;
    }

    .certificate-main .ribbon-image-div {
        padding-top: 70%;
    }

    .certificate-main .date-sign-pad {
        padding-top: 10px;
    }

    .certificate-main .coc-banner img {
        width: 85%;
    }

    .certificate-main .certificate-name {
        color: #c97314;
        font-size: 40px;
        font-family: Yellowtail;
        border-bottom: 1px solid #4e4e4e;
        padding-bottom: 5px;
    }

    .certificate-main .sign-date {
        font-family: Merriweather-Regular;
        border-bottom: 1px solid #4e4e4e;
        margin: 0 auto;
        width: 80%;
        padding-bottom: 5px;
        margin-bottom: 0;
    }

        .certificate-main .sign-date img {
            width: 100px;
        }

    .certificate-main .date-alignment {
        text-align: left;
        padding-top: 19px;
    }

    .certificate-main .logo-ribbon {
        width: 85%;
    }

    .certificate-main .certification-logo {
        padding-bottom: 10px;
        width: 70%;
    }

/* End of Sea Training Certificate */

.td-capsule-pass {
    color: #000;
    font-size: 16px;
    font-family: Montserrat-Medium;
    padding-top: 2px;
    padding-bottom: 2px;
}

.td-capsule-fail {
    padding-left: 20px;
    padding-right: 20px;
    color: #000;
    font-size: 16px;
    font-family: Montserrat-Medium;
    padding-top: 2px;
    padding-bottom: 2px;
}

.course-tab .toggle-col {
    padding-top: 5px;
    padding-right: 5px;
}

.CalendarDay__disabled {
    opacity: 0.5;
    pointer-events: none;
}

/* Start - EDIT PROFILE IMAGE */

.Profileimage.block {
    background: transparent;
}

.Profileimage img {
    width: 100%;
    height: 100%;
}

.circle-block {
    width: 200px !important;
    height: 200px !important;
    background: transparent !important;
}

.circle {
    border-radius: 50%;
}

.filter {
    border-radius: 5px;
    background-color: white;
    padding: 5px;
    border: 1px solid lightgray;
    margin-right: 10px;
    width: fit-content;
}

/* End - EDIT PROFILE IMAGE */

/* Start - CUSTOME TIME PICKER */
.custom-time-picker::-webkit-datetime-edit-ampm-field {
    display: none;
}

input[type="time"]::-webkit-clear-button {
    -webkit-appearance: none;
    -moz-appearance: none;
    -o-appearance: none;
    -ms-appearance: none;
    appearance: none;
    margin: -10px;
}

/* End - CUSTOM TIME PICKER */

/* MEDIA QUERIES */

/* Start - USER COURSE ACCESS */

@media (max-width: 992px) {
    .course-access-clone {
        margin-left: auto;
    }
}

@media (max-width: 992px) {
    .course-access-pagination {
        justify-content: center;
    }
}

/* monthlyquiz */

.add-more-btn {
    padding-bottom: 20px;
}

.quizMonthTitleInput {
    border: none !important;
    border-bottom: 1px solid #939393 !important;
    border-radius: 0 !important;
    font-size: 2rem !important;
}

/* End - USER COURSE ACCESS */
/* StarRating.css */

.star-rating {
    display: inline-block;
}

.star-checked {
    width: 20px;
    height: 20px;
    font-size: 20px !important;
    color: rgb(251, 226, 0);
}

.star-unchecked {
    width: 20px;
    height: 20px;
    color: rgb(125, 121, 110);
    font-size: 20px !important;
}

.rating-Modal {
    margin-bottom: 20px !important;
}

.review-modal .modal-content {
    border-radius: 0px !important;
}

.review-course-searchbar {
    width: 35% !important;
    margin-left: 2px !important;
}

/* End Of Star Rating*/

.user-sidebar-registartionDate {
    padding-top: 5px;
}

.title-block {
    padding-left: 15px !important;
}

.author-title-sm {
    text-align: center;
    padding-left: 25px !important;
}

.pagination-top .pagination-block {
    margin-top: 1em !important;
    padding: 0px;
    display: flex;
    justify-content: end !important;
    padding-right: 0px !important;
}

.top-row {
    padding-right: 0px !important;
}

.page-item.active .page-link {
    z-index: 0 !important;
}

/* 
.deleteActionModal .modal-title {
  padding-left: 160px;
} */

.course-filters {
    position: sticky;
    top: 132px;
    background-color: #f1f4f6;
    z-index: 3;
}

.cke_bottom {
    display: none !important;
}

.landingImage {
    max-width: 350px !important;
    max-height: 200px !important;
}

.user-course-access .category-dropdown {
    max-width: 400px !important;
}

.disabled {
    opacity: 0.5;
    pointer-events: none;
    cursor: not-allowed;
}

.new-user {
    opacity: 0.5;
}

.media-type-dropdown .dropdown-toggle {
    background-color: var(--custom-primary) !important;
    border-color: var(--custom-primary) !important;
    font-family: Montserrat-Medium;
    font-size: 14px;
}

.media-type-dropdown .dropdown-menu .dropdown-item {
    font-family: Montserrat-Medium;
    font-size: 14px;
}

    .media-type-dropdown .dropdown-menu .dropdown-item:active {
        background-color: var(--custom-primary) !important;
        border-color: var(--custom-primary) !important;
    }

.autosave-timer {
    float: none !important;
    color: white !important;
    top: -96px !important;
    position: absolute;
}

hr {
    margin-top: 1rem;
    margin-bottom: 0.5rem;
}

/* START - Generate Quiz */
.multiple-response input {
    height: 35px;
    width: 75px !important;
    margin-top: 0;
}

/* END - Generate Quiz */

/* START - Manage Videos */

.video-custom-check {
    padding-left: 2.1rem !important;
}

    .video-custom-check input {
        height: 20px;
        width: 40px !important;
        margin-right: 5px;
    }

/* End - Manage Videos */

.pagination-block .pagination {
    justify-content: end !important;
}

.faq-pagination {
    display: flex;
    justify-content: end;
    position: sticky !important;
    z-index: 999;
    top: 130px;
    background-color: #f1f4f6;
}

.category-pagination {
    display: flex;
    justify-content: end;
    position: sticky;
    z-index: 99;
    top: 130px;
    background-color: #f1f4f6;
    padding-bottom: 10px;
}

.courseReview-pagination {
    display: flex;
    justify-content: space-between;
    position: sticky;
    top: 130px;
    background-color: #f1f4f6;
    z-index: 999;
}

.landingPage-Pagination {
    display: flex;
    justify-content: end;
    position: sticky;
    z-index: 99;
    top: 130px;
    background-color: #f1f4f6;
    padding-bottom: 10px;
}

.category-section ul {
    margin-bottom: 0px;
}

.user-filters {
    position: sticky;
    z-index: 9;
    background-color: #f1f4f6;
    top: 130px;
}

.video-filters {
    position: sticky !important;
    z-index: 999;
    top: 133px;
    background-color: #fff;
    padding-top: 5px;
}

.monthlyQuiz-year-filter {
    top: 130px;
    padding-bottom: 10px;
    z-index: 999;
    position: sticky;
    background-color: #f1f4f6;
}

.title-create-btn {
    display: flex;
    justify-content: space-between;
    align-items: center;
}

.create-user-header-btn .create-course {
    padding-inline: 20px !important;
}

.faq-section.course-review {
    padding-top: 0px !important;
}

.pagination-block-manage-course ul {
    padding-top: 15px;
    float: right;
    padding-inline: 0px;
}

.preview-access-block {
    padding-block: 10px;
}

.user-course-access .mt-4 {
    margin-top: 0.5rem !important;
    /* border: 5px solid rgb(107, 106, 106); */
    border-radius: 5px;
}

#root > main > section > div > div.user-tab.mt-4 > div.text-center.mt-4 {
    border: none !important;
}

.user-course-access .userName {
    color: #000;
}

.course-access-filters {
    position: sticky;
    z-index: 1;
    top: 100px;
    background-color: #f1f4f6;
}

.user-course-access .course-access-table {
    padding-top: 7px;
}

.user-course-access .input-group {
    width: 170px !important;
}

.faq-create-btn,
.category-create-btn,
.landing-create-btn,
.course-create-btn {
    background-color: white !important;
    color: #000 !important;
    border: none;
    font-size: inherit !important;
    border-radius: 5px;
}

    .faq-create-btn:focus,
    .category-create-btn:focus,
    .landing-create-btn:focus,
    .course-create-btn {
        box-shadow: none !important;
    }

.react-datepicker-wrapper {
    width: 100%;
}

#wartsila-profile .error-message {
    color: red;
}

.error-message {
    color: red;
}

/* Start - KLSM Ranks */
.klsm-section {
    padding-top: 30px;
    padding-bottom: 30px;
}

    .klsm-section .user-tab {
        padding: 10px 22px 22px 22px;
        background-color: #f7f8fc;
    }

        .klsm-section .user-tab th {
            background-color: transparent;
            text-align: left;
            padding: 8px;
        }

        .klsm-section .user-tab td {
            background-color: #ffffff;
            text-align: left;
            padding: 8px;
            border-bottom: 5px solid #f7f8fc;
        }

.klsm-container {
    width: 100%;
    max-width: 800px;
    padding: 0 10px;
    margin: 0 auto;
}

.klsm-table {
    font-family: Montserrat-Medium;
    border-collapse: collapse;
    width: 100%;
    background-color: #f7f8fc;
}

    .klsm-table tbody {
        display: block;
        max-height: 400px;
        overflow: auto;
    }

        /* width */
        .klsm-table tbody::-webkit-scrollbar {
            width: 3px;
        }

        /* Track */
        .klsm-table tbody::-webkit-scrollbar-track {
            background: #f1f1f1;
            border-radius: 5px;
        }

        /* Handle */
        .klsm-table tbody::-webkit-scrollbar-thumb {
            background: #888;
            border-radius: 5px;
        }

            /* Handle on hover */
            .klsm-table tbody::-webkit-scrollbar-thumb:hover {
                background: #555;
            }

        .klsm-table thead,
        .klsm-table tbody tr {
            display: table;
            width: 100%;

            /* even columns width , fix width of table too*/
            table-layout: fixed;
        }

    .klsm-table input {
        font-size: 16px;
        background-color: transparent;
        border: none;
        width: 100%;
        padding: 12px 12px;
    }

        .klsm-table input:hover {
            background-color: #f7f8fc;
        }

        .klsm-table input:focus {
            outline: 1px solid #f7f8fc;
            border: 1px solid #f7f8fc;
        }

/* End - KLSM Ranks */

/* Start - MANAGE EMAILS */

.admin-dashboard.manage-email {
    padding-top: 0px;
}

.email-attachments-table {
    font-family: Montserrat-Medium;
    border-collapse: collapse;
    width: 100%;
    background-color: #f7f8fc;
}

    .email-attachments-table thead th {
        background-color: transparent;
        text-align: left;
        padding: 8px;
    }

    .email-attachments-table tbody td {
        background-color: #ffffff;
        text-align: left;
        padding: 15px 8px;
        border-bottom: 5px solid #f7f8fc;
    }

    .email-attachments-table thead,
    .email-attachments-table tbody tr {
        display: table;
        width: 100%;

        /* even columns width , fix width of table too*/
        table-layout: fixed;
    }

    .email-attachments-table td {
        font-size: 16px;
        background-color: transparent;
        border: none;
        width: 100%;
        padding: 12px 12px;
    }

        .email-attachments-table td:focus {
            outline: 1px solid #f7f8fc;
            border: 1px solid #f7f8fc;
        }

/* End - MANAGE EMAILS */

.manage-users.KLSM-Trainee {
    padding: 0px !important;
}

    .manage-users.KLSM-Trainee .user-filters {
        padding-bottom: 20px;
    }

/* make add company name option bold */
.bold-option {
    font-weight: bold;
}

#reviewDate {
    margin: 0px !important;
    padding-bottom: 20px;
}

/* Start - REACT CROP */

.ReactCrop {
    padding: 0 !important;
}

/* End - React Crop */

.downloadIcon {
    font-size: 24px;
}

.downloadIcon--disabled {
    opacity: 0.5;
    font-size: 24px;
    cursor: not-allowed;
}

.icons-container {
    display: flex;
    align-items: center;
}

.align-center {
    margin-right: 10px;
}

.training-student-sec .accordion-button {
    width: 20% !important;
}

.training-details-sec .accordion-button {
    width: 20% !important;
}

.disabled-icon {
    opacity: 0.5; /* Adjust the opacity as desired */
    cursor: not-allowed;
}

/* Start - SORTING GAME */

.category-container {
    display: flex;
    /* flex-direction: column; */
    flex-wrap: wrap;
    justify-content: center;
    margin-left: 30%;
    margin-right: 20%;
    width: 608px;

    box-sizing: content-box;
    margin-left: auto;
    margin-right: auto;
    max-width: 92rem;
    padding-left: 1.9999998rem;
    padding-right: 1.9999998rem;
}

.category-card {
    position: relative;
    margin: 10px;
    padding: 10px;
    border: 1px solid #ccc;
    border-radius: 5px;
    margin-top: 5%;
    width: 200px; /* Adjust the width as needed */
    display: flex;
    flex-direction: column;
    align-items: center;
    transition: background-color 0.3s;
    background: #ededed;
}

.new-category-card {
    cursor: pointer;
}

.delete-category-btn {
    position: absolute;
    top: -13px;
    right: -11px;
    background-color: rgba(255, 255, 255, 0); /* Initially transparent white */
    border: none;
    cursor: pointer;
    transition: background-color 0.3s; /* Transition for background color */
}

.delete-item-btn {
    margin-left: 10px;
    color: black;
}

@media (min-width: 768px) {
    .category-card {
        flex-basis: calc(50% - 20px);
    }
}

.category-card:hover #trash {
    color: black;
}

.category-card:hover .delete-category-btn {
  background-color: rgba(
    211,
    211,
    211,
    1
  ); /* Light grey with transparency on hover */
    border-radius: 45px;
}

.category-card #trash {
    color: transparent;
    position: relative;
    opacity: 0.5;
}

#Category-input {
    background: transparent;
    border: none;
    border-bottom: 0.1rem solid #d6d7d7;
    font-family: lato, sans-serif;
    font-size: 1rem;
    font-weight: 700;
    line-height: 2;
    outline: none;
    resize: none;
    width: 100%;
}
#RemoveItem-trash {
    color: transparent; /* Initially transparent */
    position: relative;
}

.delete-item-btn #RemoveItem-trash {
    color: rgba(133, 121, 121, 0.701);
}

.delete-item-btn:hover #RemoveItem-trash {
    color: black;
}

.AddItem-button {
    background: #ededed;
    border: 0.1rem solid rgba(0, 0, 0, 0.4);
    cursor: pointer;
    text-align: center;
    text-transform: uppercase;
    font-size: small;
    padding: 7px;
    width: 64%;
    margin-bottom: 25px;
}

.add-category-icon {
    background: #e3e3e3;
    border-radius: 50%;
    color: #fff;
    font-size: 4rem;
    height: 3.9rem;
    line-height: 3.3rem;
    margin-bottom: -1rem;
    text-align: center;
    width: 3.9rem;
    margin-top: 15px;
}

.add-category-text {
    color: #c8c8c8;
    cursor: inherit;
    font-family: lato, sans-serif;
    font-size: 1.5rem;
    font-weight: 700;
    line-height: 2;
}

.category-card-new-category-card:hover {
    color: #969393;
}

#category-icon:hover {
    color: #969393;
}

#Add-cat-hover:hover {
    color: #969393;
}

/* End - SORTING GAME */

.period-check-modal .modal-backdrop.show {
    opacity: 0.5;
    z-index: 999999999;
}

.period-check-modal {
    box-shadow: #000;
}

.fade .modal-backdrop .custom-modal-backdrop .show {
    z-index: 9999999;
    opacity: 0.5;
}

.period-check-modal .modal-content {
    box-shadow: 0 3px 6px #00000080;
}

/* Link Expired */
.link-expired-bg {
    height: 100vh;
    padding: 18vh;
    background-color: #1764e8;
}

    .link-expired-bg .link-expired-sec-bg {
        background-image: url("../images/link-expired-bg.jpg");
        background-repeat: no-repeat;
        background-position: center;
        text-align: center;
        height: 100%;
        width: 100%;
        display: flex;
        justify-content: center;
        align-items: center;
    }

.link-expired-sec .link-expired-text {
    font-family: Montserrat-Bold;
    color: #224084;
    font-size: 28px;
}

.link-expired-sec .contact-us-text {
    font-family: Montserrat-Medium;
    color: #224084;
    font-size: 22px;
    margin-bottom: 0 !important;
}

.link-expired-sec .contact-medium {
    font-family: Montserrat-Medium;
    color: #224084;
    font-size: 16px;
    text-decoration: underline;
    cursor: pointer;
}

    .link-expired-sec .contact-medium:hover {
        color: var(--custom-secondary);
    }

/* Link Expired End*/

/* Certificate Download */
.certificate-download-body {
    overflow-y: auto;
    position: relative;
    background-image: url("../images/certificate-download-bg.png");
    min-height: 100vh;
    background-size: cover;
    background-repeat: no-repeat;
    /* margin-bottom: 50px; */
}

.certificate-download-header {
    background-color: #fff;
    box-shadow: 0px 3px 6px #00000029;
}

.certificate-download-sec {
    margin-bottom: 70px;
    padding: 5px;
}

    .certificate-download-sec .acknowledgement-header-sec {
        text-align: -webkit-center;
    }

    .certificate-download-sec .acknowledgement-header {
        width: 58%;
        text-wrap: wrap;
        text-align: center;
    }

.acknowledgement-header-sec .acknowledgement-text {
    color: var(--custom-primary);
    font-family: Montserrat-Bold;
    font-size: 22px;
}

.sec-header {
    border-bottom: 2px solid #707070;
    margin-block: 35px;
}

.sec-heading-text {
    color: #313537;
    font-family: Montserrat-Bold;
    font-size: 18px;
}

/* .certificate-download-main{
	margin-top: 16px;
 } */

.certificate-sec .certificate-img {
    width: 350px;
    height: 240px;
    position: relative;
}

.certificate-sec .download-fbox {
    display: flex;
    position: absolute;
    padding: 5px 14px;
    bottom: 0;
    width: 100%;
    background-color: #323232;
    justify-content: space-between;
    align-items: center;
}

    .certificate-sec .download-fbox .certificate-name {
        color: #fff;
        font-family: Montserrat-Medium;
        font-size: 17px;
    }

.certificate-sec .certificate-img-main {
    height: 100%;
    width: 100%;
}

.certificate-sec .dowloadable-content .download-url {
    color: #004cff !important;
    text-decoration: underline !important;
    cursor: pointer !important;
    background-color: transparent;
    border: none;
    padding: 0;
}

.certificate-sec .dowloadable-content .dowloadable-content-text {
    color: #313537;
    font-family: Montserrat-Medium;
    font-size: 16px;
}

.certificate-sec .note-text {
    margin-top: 4px;
}

/* Feedback Page Css */
/* Feedback Form */
.feedback-form-sec {
    background-image: url("../images/feedback_bg.jpg");
    background-size: cover;
    background-repeat: no-repeat;
    background-position: right;
    padding: 20px 15%;
}

    .feedback-form-sec label,
    .feedback-form-sec span,
    .feedback-form-sec th,
    .feedback-form-sec td {
        font-size: 16px;
    }

    .feedback-form-sec .feedback-question-block {
        border-radius: 8px;
        box-shadow: 0px 3px 6px #00000029;
        background-color: #fff;
    }

        .feedback-form-sec .feedback-question-block .block-header {
            background-color: var(--custom-primary);
            min-height: 10px;
            border-top-right-radius: 8px;
            border-top-left-radius: 8px;
            padding: 5px 20px;
        }

            .feedback-form-sec .feedback-question-block .block-header .block-header-text {
                color: #fff;
                font-family: Montserrat-Medium;
            }

        .feedback-form-sec .feedback-question-block .block-content {
            padding: 12px 20px;
        }

        .feedback-form-sec .feedback-question-block .training-details {
            padding-top: 0 !important;
        }

        .feedback-form-sec .feedback-question-block .block-content h3 {
            font-family: Montserrat-Bold;
            font-weight: 700;
            text-align: center;
            color: #2e2e2e;
            font-size: calc(1.2rem + 0.6vw);
        }

    .feedback-form-sec .submit-sec {
        text-align: center;
    }

    .feedback-form-sec .container {
        padding-bottom: 250px !important;
    }

    .feedback-form-sec .submit-sec .submit-btn {
        border: none;
        padding: 6px 20px;
        border-radius: 7px;
        background-color: var(--custom-primary);
        color: #fff;
        font-family: Montserrat-Regular;
        font-size: 16px !important;
    }

.feedback-question .asterisk {
    color: var(--custom-secondary);
}

.feedback-question .question-text {
    font-family: Montserrat-Medium !important;
    font-size: 16px !important;
}

.feedback-question .question-text-spacing {
    padding-right: 13px;
}

.feedback-question .data-text {
    font-family: Montserrat-Medium;
}

.feedback-question .question-note {
    font-family: Montserrat-Bold !important;
    font-size: 15px !important;
}

.feedback-answer .feedback-text-input {
    font-family: Montserrat-Regular !important;
    font-size: 16px !important;
    border-top: none;
    border-right: none;
    border-left: none;
    width: 100%;
}

    .feedback-answer .feedback-text-input:focus {
        border-top: none;
        border-right: none;
        border-left: none;
    }

.feedback-answer .radio-f-box {
    display: flex;
    flex-wrap: wrap;
}

    .feedback-answer .radio-f-box span {
        font-family: Montserrat-Medium;
    }

.feedback-answer .right-spacing {
    padding-right: 40px;
}

.feedback-answer .radio-f-box .text-spacing {
    padding-left: 10px;
}

.feedback-answer .range-f-box {
    display: flex;
    width: 100%;
}

    .feedback-answer .range-f-box label {
        font-family: Montserrat-Regular;
    }

    .feedback-answer .range-f-box .vertical-f-box {
        display: flex;
        flex-direction: column;
        padding-right: 60px;
    }

        /* .feedback-answer .range-f-box .vertical-f-box .empty-box-mod{
	min-height: 50px;
} */

        .feedback-answer .range-f-box .vertical-f-box .unit-f-box {
            min-height: 50px;
            display: flex;
            justify-content: center;
            align-items: center;
        }

.feedback-answer input.larger-radio {
    width: 15px;
    height: 15px;
}

/* Table */
.feedback-tab {
    /* box-shadow: 0px 3px 6px #00000029; */
    border-radius: 4px;
}

    .feedback-tab .feedback-table {
        border-collapse: collapse;
        width: 100%;
        background-color: #f7f8fc;
        /* white-space: nowrap; */
    }

    .feedback-tab th {
        background-color: #fff;
        /* color: #ffffff; */
        text-align: center;
        padding: 8px;
        font-family: Montserrat-Regular;
    }

    .feedback-tab td {
        background-color: #f8f9fa;
        padding: 8px;
        font-family: Montserrat-Regular;
        border-bottom: 5px solid #fff;
    }

        .feedback-tab td .value-font {
            font-family: Montserrat-Regular;
            text-wrap: nowrap;
        }

    .feedback-tab .align-center-td {
        text-align: center;
    }

    .feedback-tab .align-left-th {
        text-align: left;
    }

    .feedback-tab input.larger-checkbox {
        width: 17px;
        height: 17px;
    }

/* Table End */
.feedback-header {
    background-color: #ffffff;
    box-shadow: 0px 3px 6px #00000029;
}

    /* .feedback-header .logo-box img{
		width: 90%;
	} */

    .feedback-header .kmsm-branding-text {
        font-family: "Montserrat-Bold";
        font-size: 22px;
        /* font-weight: 600; */
        text-align: left;
        color: #db2927;
    }

    /* .feedback-header .col-padd-none{
		padding-right: 0;
	 } */

    .feedback-header .kmsm-branding-alignment {
        text-align: end;
    }

    .feedback-header .edot-branding-alignment {
        align-self: center;
    }

    .feedback-header .kmsm-branding-f-box {
        display: flex;
        justify-content: flex-end;
        align-items: center;
    }

        .feedback-header .kmsm-branding-f-box img {
            width: 9%;
        }
.userprofile-dob .react-datepicker-wrapper {
    width: 100% !important;
}

.userprofile-dob .react-datepicker {
    font-size: 16px;
    max-width: 225px;
}

.userprofile-dob
.react-datepicker__day.react-datepicker__day--007.react-datepicker__day--weekend {
    margin: 5px;
}

.userprofile-dob .react-datepicker__day-name {
    margin: 5px;
}

.userprofile-dob .react-datepicker__day {
    margin-right: 8px;
}

.userprofile-dob .react-datepicker__current-month {
    font-size: 12px;
}

.checkbox-label {
    display: flex;
    align-items: center;
}

    .checkbox-label input[type="checkbox"] {
        /* Adjust the size as needed */
        width: 15px;
        height: 15px;
    }

.consent-text {
    margin-left: 8px;
    font-family: Montserrat-Medium !important;
    font-size: 16px !important;
}
.italics-text {
    font-family: Montserrat-Medium !important;
    font-size: 12px !important;
}

/* Feedback Form End */

/* Feedback Media Query */

@media screen and (max-width: 576px) {
    .feedback-form-sec {
        padding: 20px 0;
    }

    .feedback-header .kmsm-branding-text {
        font-size: 14px;
    }
}

@media screen and (max-width: 323px) {
    .feedback-header .kmsm-branding-text {
        font-size: 13px;
    }
}

@media screen and (min-width: 1299px) {
    .feedback-form-sec {
        padding: 20px 20%;
    }
}

@media screen and (max-width: 991px) {
    .feedback-answer .range-f-box .vertical-f-box {
        padding-right: 0;
    }

    .feedback-answer .range-f-box {
        justify-content: space-between;
    }
}

@media screen and (max-width: 425px) {
    .feedback-answer .range-f-box .vertical-f-box {
        flex-direction: row;
        /* padding-right: 60px; */
    }

    .feedback-answer .range-f-box {
        flex-direction: column;
    }

        .feedback-answer .range-f-box .responsive-spacing {
            padding-left: 36px;
            padding-right: 20px;
        }
}

@media screen and (max-width: 767px) {
    .feedback-header .kmsm-branding-f-box img {
        width: 18%;
    }
}

.error-message {
    color: red;
    font-family: Montserrat-Regular !important;
    font-size: 12px !important;
}

.dob-user {
    width: 100% !important;
    font-size: larger;
}

.fr-view.intro-course p {
    margin-bottom: 2rem !important;
}

.ql-editor p {
    margin-bottom: 2rem !important;
}

.download-feeback-sec .download-feeback-btn {
    background-color: var(--custom-primary);
    color: var(--custom-white);
    padding: 6px 18px;
    font-family: Montserrat-Medium;
    font-size: 16px;
    border: none;
    border-radius: 5px;
}

    .download-feeback-sec .download-feeback-btn .download-feedback-icon {
        margin-right: 12px;
    }

.trainingResult_Text {
    font-family: Montserrat-Medium !important;
    font-size: 16px !important;
    text-wrap: wrap;
}
.special-label {
    display: none;
}

/* START - CKEditor */

.ck-editor__editable_inline:not(.ck-comment__input *) {
    height: 300px;
    overflow-y: auto;
}

.ck .ck-sticky-panel .ck-sticky-panel__content_sticky {
    position: static !important;
    display: none !important;
}

.ck
.ck-sticky-panel
.ck-sticky-panel__content
.ck-toolbar
  .ck-toolbar__items
  > * {
    z-index: 3;
}

/* END */

/* .ag-menu.ag-ltr.ag-popup-child {
  z-index: 1;
}

.react-datepicker-ag-grid .react-datepicker__input-container input {
  width: 100%;
  border: 1.5px solid #ccc !important;
  border-radius: 4px !important;
  padding: 4px;
}

.react-datepicker-ag-grid .datepicker-filter-popper {
  z-index: 80 !important;
}

.react-datepicker-popper {
  z-index: 80 !important;
} */

.react-datepicker-popper {
    z-index: 1000000 !important;
}

.disable-filter-icon .ag-floating-filter-button,
.disable-filter-icon .ag-filter-icon {
    display: none;
}

/* Start - DatePickerFilter styles */

.date-picker-filter-wrapper input {
    border: 1px solid #c1c1c1;
    border-radius: 3px;
    padding: 2px;
    width: 100%;
}

    .date-picker-filter-wrapper input:focus {
        outline: none;
        box-shadow: 0 0 7px rgb(60, 182, 248);
    }

/* End - DatePickerFilter styles */

/* Start - CustomDatePicker styles */

.custom-date-filter span {
    position: absolute;
    right: 5px;
    color: #999;
    cursor: pointer;
    font-size: 16px;
}

.custom-date-filter .fa-calendar {
    position: absolute;
    display: block;
    font-weight: 400;
    right: 5px;
    pointer-events: none;
    color: #999;
}

.custom-date-filter .flatpickr-input {
    width: 100%;
    padding: 4px;
    border: 1.5px solid #ccc;
    border-radius: 4px;
}

    .custom-date-filter .flatpickr-input:focus {
        outline: none;
    }

    .custom-date-filter .flatpickr-input.active {
        background: transparent;
    }

/* End - CustomDatePicker styles */

/* Start - TanStack Table */

.custom-tanstack-table {
    width: 100%;
    max-width: 1500px;
    position: relative;
}

    .custom-tanstack-table table {
        border: 1px solid rgb(233, 233, 233);
        width: fit-content;

        /* box-shadow and borders will not work with positon: sticky otherwise */
        border-collapse: separate !important;
        border-spacing: 0;
        margin: 0;
    }

    .custom-tanstack-table > div > table > thead > tr > th {
        background-color: rgb(247, 247, 247);
    }

    .custom-tanstack-table .tr {
        display: flex;
    }

    .custom-tanstack-table tbody .no-data {
        width: 100%;
        position: sticky;
        top: 0;
    }

    .custom-tanstack-table tbody .no-data__text {
        position: sticky;
        left: 45%;
        pointer-events: none; /* Used to fix the issue of color appearing on hover */
        background-color: transparent;
        font-size: 1.4rem;
        padding-block: 2rem;
    }

    .custom-tanstack-table tr,
    .custom-tanstack-table .tr {
        width: fit-content;
        height: 30px;
    }

    .custom-tanstack-table th,
    .custom-tanstack-table .th,
    .custom-tanstack-table td,
    .custom-tanstack-table .td {
        padding: 0.25rem;
        background-color: white;
        box-shadow: inset 0 0 0 1px lightgray;
    }

    .custom-tanstack-table th,
    .custom-tanstack-table .th {
        height: 30px;
        padding: 2px 4px;
        position: relative;
        font-weight: bold;
        text-align: left;
        background-color: white;
    }

    .custom-tanstack-table td,
    .custom-tanstack-table .td {
        padding: 2px 4px;
    }

    .custom-tanstack-table .resizer {
        position: absolute;
        top: 15%;
        height: 25%;
        width: 3px;
        cursor: col-resize !important;
        user-select: none;
        touch-action: none;

        background: rgba(0, 0, 0, 0.5);
        border: none;
        border-radius: 100vw;
        padding: 0;
        font: inherit;
    }

        .custom-tanstack-table .resizer.ltr {
            background: rgb(210, 210, 210);
            right: 0;
        }

        .custom-tanstack-table .resizer.rtl {
            left: 0;
        }

        .custom-tanstack-table .resizer.isResizing {
            opacity: 1;
        }

/* @media (hover: hover) {
  .custom-tanstack-table .resizer {
    opacity: 0;
  }

  *:hover > .resizer {
    opacity: 1;
  }
} */

/* End - TanStack Table */
.dropdown-container {
    position: relative;
}

    .dropdown-container select {
        appearance: none; /* Remove default arrow for select */
        -webkit-appearance: none; /* For Safari */
        -moz-appearance: none; /* For Firefox */
    }

.dropdown-icon {
    position: absolute;
    right: 10px;
    top: 50%;
    transform: translateY(-50%);
    pointer-events: none; /* Prevent the icon from blocking clicks */
    font-size: 14px; /* Adjust the size of the icon */
    color: #0a0a0a; /* Adjust the color of the icon */
}

.event-files td {
    font-family: 'Montserrat-Regular';
    background-color: #fff;
    border-bottom: 1px solid #dee2e6 !important;
}

.event-files th{
    background-color: rgb(247, 247, 247) !important;
    border-bottom: 1px solid #dee2e6 !important;
    border-top: 1px solid #dee2e6 !important;
}

.event-files tbody{
    border-top: none !important;
}
/* OTP start*/
.otp-input {
    width: 40px;
    height: 40px;
    margin: 0 5px;
    text-align: center;
    font-size: 18px;
    border: 1px solid #ccc;
    border-radius: 4px;
}
/* otp counter */
.countdown-text {
    display: flex;
    align-items: center;
    justify-content: space-between;
    /* margin: 24px 0px; */
}

    .countdown-text > p {
        font-size: 13px;
        font-weight: 400;
        color: #2D1D35;
    }

/* .countdown-text > button {
  background-color: #fff;
  border: none;
  color: #FE5B00;
  font-weight: 500;
  text-decoration: underline;
  cursor: pointer;
} */
/* OTP end */

.eye-icon-style {
    margin-left: 20px;
}

.action-items i {
    font-size: 20px;
}
.custom-spacing {
    margin-top: 2rem;
}

.view-recap-button {
    background-color: #234084;
    color: #fff;
    border: none;
    border-radius: 3px;
    padding: 1px 12px;
    font-size: 14px;
}

.action-fbox{
    display: flex;
    align-items: end;
    gap: 16px;
}

.no-content-message {
    text-align: center;
    min-height: calc(100vh - 270px);
    align-content: center;
}

.filter-fbox {
    display: flex;
    align-items: center;
    gap:8px;
}