body{
    font-family: 'Poppins', sans-serif;
}

/* header css start */

header .navbar{
    display: unset;
}

header{
    position: fixed;
    top: 0;
    width: 100%;
    background-color: white;
    z-index: 1050;
}

.header-logo{
    padding: 0 10px;
}

.header-logo{
    display: flex;
    width: 270px;
    padding: 6px 30px;
}

.header-logo .btn{
    margin-right: 10px;
}

.header-content .logo{
    width: 143px;
    height: 31px;
    margin: auto 0;
} 

.header-content{
    width: calc(100% - 270px);
    padding: 0 35px;
    display: flex;
    justify-content: space-between;
    transition: all 0.5s ease-in-out;
    background: url(../image/header-bg.png), url(../image/header-bg2.png), linear-gradient(90.01deg, #FFFFFF 26.91%, #E3F4FF 99.99%);
    filter: drop-shadow(12px 2px 16px rgba(0, 0, 0, 0.05));
    background-repeat: no-repeat, no-repeat;
    background-position: top right, top left;
    background-size: contain;
    align-items: center;
}

.header-content h4{
    font-weight: 500;
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 0;
    color: #212427;
}

header .navbar .container-fluid{
    justify-content: unset !important;
}

.full-header .header-content{
    width: 100%;
    padding: 0 97px;
}

.full-header .header-content .logo{
    margin: 10px 0;
}

/* header css end */

/* sidebar css start */

#sidebar {
    position: fixed;
    top: 50px;
    left: 0px;
    z-index: 999;
    overflow-y: auto;
    min-width: 270px;
    max-width: 270px;
    height: calc(100vh - 50px);
    background: #fff;
    color: #3e3e3e;
    transition: all 0.3s;
    box-shadow: 3px 4px 15px rgba(0, 0, 0, 0.04);
    text-align: center;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

#sidebar.active {
    left: -270px;
}

#sidebar.active ~ .main-section{
    margin-left: 0;
    transition: all 0.5s ease-in-out;
}

#sidebarCollapse{
    display: block;
}

#sidebar .components{
    padding: 13px 0px 0px;
    margin-top: 0px;
    overflow-y: auto;
}

#sidebar .components li svg{
    margin-right: 18px;
}

#sidebar .components li a::after{
    content: '';
    position: absolute;
    display: none;
    left: 0;
    top: 0;
    width: 6px;
    height: 100%;
    background: #00A3FF;
    box-shadow: 3px 4px 29px rgba(0, 163, 255, 0.8);
    border-radius: 0 5px 5px 0;
}

#sidebar .components li a.active::after{
    display: block;
}

#sidebar .components li a{
    color: #212427;
    text-decoration: none;
    font-weight: 400;
    font-size: 14px;
    line-height: 22px;
    display: flex;
    align-items: center;
    padding: 8px 16px;
    /* margin-bottom: 10px; */
    text-align: left;
    border-radius: 5px;
    position: relative;
}

#sidebar .secondary-cus-btn{
    margin: 28px 15px 28px 15px;
}

 #sidebar .secondary-cus-btn svg{
    margin-right: 16px;
}
 

/* sidebar css end */

/* footer css start */
footer{
    background-color: #DFEBF2;
    text-align: center;
    height: 64px;
    display: flex;
    align-items: center;
    justify-content: center;
}

footer img{
    width: 100%;
    max-width: 1440px;
}
/* footer css end */

/* common css start */

.secondary-cus-btn{
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    color: #00A3FF;
    padding: 13px 24px;
    background: #F7FCFF;
    box-shadow: 3px 4px 15px rgba(0, 0, 0, 0.04);
    border: 0;
}

.primary-cus-btn{
    background: #00A3FF !important;
    /* box-shadow: 4px 4px 14px rgba(0, 0, 0, 0.11); */
    border-radius: 3px !important;
    padding: 10px 15px !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    line-height: 22px !important;
    color: #FFFFFF !important;
    min-width: 206px;
}

.primary-cus-btn:active{
    background: #00A3FF !important;
    color: #FFFFFF !important;
}

.primary-cus-btn:hover{
    /* background: white !important;
    color: #00A3FF !important;
    border: 1px solid #00A3FF !important; */
    background: #00A3FF !important;
    color: #FFFFFF !important;
}

.primary-cus-btn svg{
    margin-right: 10px;
}


/* .primary-cus-btn:hover svg path{
    stroke: #00A3FF;
} */

.custom-tooltip{
    --bs-tooltip-bg: #0A0A0A;
    --bs-tooltip-padding-x: 15px;
    --bs-tooltip-padding-y: 8px;
    --bs-tooltip-border-radius: 3px;
    --bs-tooltip-arrow-width: 20px;
    --bs-tooltip-arrow-height: 10px;
}

.custom-tooltip2{
    --bs-tooltip-bg: #0A0A0A;
    --bs-tooltip-padding-x: 15px;
    --bs-tooltip-padding-y: 8px;
    --bs-tooltip-border-radius: 3px;
    --bs-tooltip-arrow-width: 20px;
    --bs-tooltip-arrow-height: 10px;
    --bs-tooltip-max-width: 400px;
}

.back-btn{
    max-width: 48px;
    min-width: 48px;
}

.green-btn{
    color: #06D1B9;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    white-space: nowrap;
}

.green-btn:hover{
    color: #06D1B9;
}

.blue-btn{
    color: #00A3FF;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    padding: 0;
    background: white;
    border: none;
}

.blue-btn:hover, .blue-btn:focus, .blue-btn:active{
    color: #00A3FF !important;
}

.blue-btn svg{
    margin-right: 8px;
    max-width: 11px;
}

.gray-btn{
    color: #A4AFB9;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    padding: 0;
    background: white;
    border: none;
}

.btn-outline{
    background: #FFFFFF;
    border: 1px solid #C2CCE2;
    border-radius: 3px;
    padding: 9px 14px;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
}

.btn-outline:hover, .btn-outline:focus, .btn-outline:active{
    border: 1px solid #C2CCE2;
    border-color: #C2CCE2 !important;
}

.light-icon{
    background: rgba(227, 244, 255, 0.2);
    border-radius: 2px;
    padding: 6px;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #fff;
}

.dark-icon{
    background: #E3F4FF;
    border-radius: 2px;
    padding: 6px;
    width: 42px;
    height: 42px;
    display: flex;
    align-items: center;
    justify-content: center;
    color: #00A3FF;
}

.solid-label{
    background: #E3F4FF;
    border-radius: 2px;
    padding: 6px;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #212427;
    margin-bottom: 0;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.outline-label{
    background: #FDFDFD;
border: 0.5px solid #00A3FF;
border-radius: 2px;
padding: 6px;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #212427;
    margin-bottom: 0;
    width: 30px;
    height: 30px;
    display: flex;
    justify-content: center;
    align-items: center;
}

.green-label{
    color: #FFFFFF;
    font-weight: 400;
    font-size: 11px;
    line-height: 16px;
    background: #06D1B9;
    border-radius: 3px;
    padding: 3px 8px;
    margin-bottom: 0;
}

.purple-label{
    background: #7767DA;
    border-radius: 3px;
    color: #FFFFFF;
    font-weight: 400;
    font-size: 11px;
    line-height: 16px;
    padding: 3px 8px;
    margin-bottom: 0;
}

.red-label{
    background: #F0652E26;
    border: 1px solid #F0652E;
    border-radius: 14px;
    color: #F0652E;
    font-weight: 400;
    font-size: 11px;
    line-height: 16px;
    padding: 3px 8px;
    margin-bottom: 0;
}

.grey-label{
    background: #DBE3EB;
    border: 1px solid #A4AFB9;
    border-radius: 14px;
    color: #A4AFB9;
    font-weight: 400;
    font-size: 11px;
    line-height: 16px;
    padding: 3px 8px;
    margin-bottom: 0;
}

.card{
    background: #FFFFFF;
    border: 1px solid #E9EEF8;
    box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    padding: 11px 16px;
}

.user-engagement{
    padding: 20px 30px;
    margin-bottom: 15px;
}

.user-engagement h4{
    font-weight: 500;
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 0;
    color: #212427;
}

.user-engagement h4 span{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-left: 8px;
}

.cus-dropdown .dropdown-menu{
    width: 100%;
    transform: translate(0px, 42px) !important;
    border-radius: 0 0 3px 3px;
    box-shadow: 0px 9px 20px rgba(0, 0, 0, 0.05);
    border: 1px solid #C2CCE2;
    min-width: unset;
}

.card .cus-dropdown{
    margin-top: 10px;
}

.cus-dropdown .btn{
    border: 1px solid #C2CCE2 !important;
    background: #fff;
    min-width: 220px;
    text-align: left;
    padding-right: 30px;
    border-radius: 3px;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #212427;
    padding: 11px 30px 11px 20px;
    width: 100%;
    position: relative;
}

.cus-dropdown-for-selectpicker .btn{
    border: 1px solid #C2CCE2 !important;
    background: #fff;
    min-width: 157px !important;
    text-align: left;
    padding-right: 30px;
    border-radius: 3px;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #212427;
    padding: 11px 30px 11px 20px;
    width: 100%;
    position: relative;
}

.dropdown-item.active, .dropdown-item:active{
    color: #00A3FF !important;
    background: white;
}

.dropdown-item.deactive{
    color: #868C93 !important;
    pointer-events: none;
}

.dropdown-item{
    cursor: pointer;
}

.dropdown-toggle.disabled{
    background: #F5F2FF !important;
    pointer-events: none;
}

.dropdown-toggle.gray-disabled{
    background: #F2F6FA !important;
    pointer-events: none;
}

.form-control.disabled{
    background-color: #F5F2FF !important;
    pointer-events: none;
    border: 1px solid #CACED8;
}

.cus-dropdown .dropdown-item{
    font-weight: 400;
    font-size: 13px;
    line-height: 30px;
    color: #212427;
    padding: 0px 20px;
}

.primary-dropdown .dropdown-item{
    font-weight: 400;
    font-size: 13px;
    line-height: 30px;
    color: #212427;
    padding: 0px 16px;
}

.cus-dropdown .dropdown-toggle::after{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
}

.primary-dropdown .primary-cus-btn.show{
    background-color: #00A3FF;
    color: #FFFFFF !important;
}

.primary-dropdown .primary-cus-btn.show svg path{
    stroke: #fff;
}

.primary-dropdown .dropdown-toggle::after{
    display: none;
}

.primary-dropdown .dropdown-menu{
    border-radius: 3px;
    box-shadow: 0px 9px 20px rgba(0, 0, 0, 0.05);
    border: 1px solid #C2CCE2;
    min-width: 206px;
}

.user-engagement label{
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    color: #868C93;
    margin-top: 5px;
    margin-bottom: 0;
}

.btn-link{
    color: #00A3FF;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    text-decoration: none;
    background: transparent;
    border: none;
}

.modal .btn-link{
    margin-top: 10px;
    display: block;
}

.blue-card{
    background: #D9F1FF;
    border-radius: 10px;
    display: flex;
    justify-content: center;
    align-items: center;
    height: 82px;
    min-width: 120px;
    width: 100%;
    flex-direction: column;
    margin-top: 13px;
    margin-right: 8px;
    padding: 10px;
}

.blue-card h5{
    color: #212427;
    font-weight: 600;
    font-size: 17px;
    line-height: 26px;
    margin-bottom: 5px;
}

.blue-card p{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 0;
    text-align: center;
}

.see-all-btn{
    color: #212427;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    background: transparent;
    border: none;
}

.view-all .dropdown-toggle.show svg path, .view-all .see-all-btn:hover svg path{
    fill: #212427 !important;
}


.dropdown-big{
    min-width: 328px !important;
}

.dropdown .see-all-btn::after{
    display: none;
}

.view-all .dropdown-menu{
    background: #FFFFFF;
    border-radius: 5px;
    border: none;
    filter: drop-shadow(0px 3px 24px rgba(0, 0, 0, 0.18));
    padding: 19px 25px 19px 16px;
    min-width: 120px;
}
/* 
.view-all .dropdown-menu.show{
    width: 120px;
} */

.view-all .dropdown-menu li{
    color: #9BA4B8;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    white-space: nowrap;
    padding: 4px 0;
}

.view-all .dropdown-menu li a{
    color: #212529;
    text-decoration: none;
    width: fit-content;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    padding: 0;
}

.view-all .dropdown-menu li a:hover{
    background-color: transparent;
    font-weight: 600;
}

.cus-progress .bg-info{
    background-color: #00A3FF !important;
}

.cus-progress .bg-success{
    background-color: #9EDEBC !important;
}

.card .cus-progress .progress{
    height: 8px;
    margin-top: 12px;
}

.cus-progress h6{
    margin-top: 18px;
    margin-bottom: 6px;
    color: #000000;
    font-weight: 600;
    font-size: 17px;
    line-height: 26px;
}

.cus-progress p{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 0;
}

.form-control{
    background: #FFFFFF;
    border: 1px solid #E9EEF8;
    border-radius: 3px;
    padding: 6px 16px;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    color: #212427;
}

.form-control::placeholder{
    color: #A4AFB9;
}

.form-control:focus{
    box-shadow: none;
    border-color: #E9EEF8;
}

.form-label{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 0;
}

.modal .form-label{
    margin-bottom: 10px;
}

.form-input{
    margin-bottom: 22px;
}

.search-input{
    position: relative;
}

.search-input .search-icon{
    position: absolute;
    top: 50%;
    right: 15px;
    transform: translateY(-50%);
}

.search-div .search-icon{
    top: 60%;
    right: 26px;
}

.theme-table{
    border-collapse: separate;
    border-spacing: 0px 6px;
    margin-top: -4px;
    text-align: center;
    vertical-align: middle;
    margin-bottom: 8px;
}

.theme-table thead{
    background-color: #fff;
}
.theme-table thead th{
    color: #868C93;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    vertical-align: middle;
    padding: 20px 34px;
}

.theme-table thead th h5{
    color: #868C93;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 0;
}

.theme-table tbody tr{
    background: #FFFFFF;
box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.06);
}

.theme-table tbody tr td{
    padding: 20px 34px;
    color: #212427;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    white-space: nowrap;
}

.theme-table thead tr th{
    white-space: nowrap;
}

.theme-table tbody tr td:first-child, .theme-table thead tr th:first-child{
    text-align: left;
}

.theme-table tbody tr td:first-child{
    border-left: 6px solid #F2F6FA;
}

.theme-table tbody tr td:last-child{
    border-right: 6px solid #F2F6FA;
}

.theme-table thead tr th, .theme-table tbody tr td, .theme-table tbody tr{
    border-left: 0;
    border-right: 0;
    border-top: 0;
    border-bottom: 0;
}

.theme-table tbody tr td h5{
    color: #212427;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 0;
}

.theme-table tbody tr td h4{
    color: #212427;
    font-weight: 600;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 0;
}

.theme-table tbody tr td a{
    text-decoration: none;
}

.theme-table tbody tr td label{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-top: 8px;
}

.theme-table tbody tr td h6{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 0;
}

.theme-table .solid-label, .theme-table .outline-label{
    margin-left: 15px;
}

.theme-table .green-label, .theme-table .purple-label{
    margin-left: 10px;
}

.theme-table thead .cus-dropdown{
    width: fit-content;
    margin: 0 auto;
}

.theme-table thead .cus-dropdown .btn{
    border: none !important;
    color: #868C93;
    min-width: 100px;
    max-width: 100px;
}

.theme-table tbody .cus-dropdown .btn{
    min-width: 123px;
    max-width: 123px;
}

.row{
    margin-right: -7px;
    margin-left: -7px;
}

.row>*{
    padding-left: 7px;
    padding-right: 7px;
}

.border-right{
    width: 1px;
    height: 31px;
    background-color: #C2CCE2;
    margin-right: 20px;
}

.white-btn{
    background: #FFFFFF;
    border-radius: 0;
    padding: 16px 118px;
    color: #212427;
    font-size: 16px;
    line-height: 24px;
    font-weight: 400;
    margin-bottom: 8px;
}

.white-btn:hover, .white-btn:active{
    background: #FFFFFF !important;
    color: #212427;
}

.btn-check:checked+.btn, .btn.active, .btn.show, .btn:first-child:active, :not(.btn-check)+.btn:active{
    border-color: transparent;
}

.modal .modal-title{
    color: #212427;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    margin: 0;
}

.modal .modal-title span{
    color: #868C93;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin-left: 14px;
}

.modal .modal-header{
    padding: 25px 35px 10px;
    border-bottom: 0;
}

.modal .modal-header .btn-close{
    background: transparent url(../image/close-icon.png);
    background-repeat: no-repeat;
    background-size: 13px;
    opacity: 1;
    width: 13px;
    height: 13px;
    border-radius: 0;
    padding: 0;
    margin-top: -20px;
    margin-right: -13px;
    display: block;
}

.modal .modal-body{
    padding: 10px 35px 40px;
    text-align: left;
}

.danger-label{
    background: #FFF2F2;
    border-radius: 3px;
    padding: 10px 24px;
    margin-bottom: 12px;
}

.danger-label p{
    color: #212427;
    font-weight: 300;
    font-size: 14px;
    line-height: 24px;
    margin-bottom: 0;
}

.black-outline-label{
    background: #FFFFFF;
    border: 1px solid #E9EEF8;
    border-radius: 3px;
    padding: 10px 16px 40px;
}

.black-outline-label p{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 0;
}

.custom-list li::marker{
    color: #66615B;
}

.custom-list li{
    margin-bottom: 12px;
}

.modal .modal-que{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 20px;
}

.modal .modal-checkmark{
    margin-bottom: 20px;
}

.modal-checkmark .form-check{
    margin-top: 23px;
}

.modal-checkmark .form-check-label{
    color: #66615B;
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    margin-left: 8px;
}

.modal-checkmark .form-check-input{
   width: 18px;
   height: 18px;
    box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.15);
    border-radius: 3px;
}

.modal-checkmark .form-check-input:checked{
    background-color: #2ECE47;
    border-color: #2ECE47;
}

.cancel-btn{
    color: #212427;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    padding: 10px 20px;
}

.custom-message{
    margin: 25px 0;
}

.custom-message h5{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 10px;
}

.custom-fileinput label{
    background: #EBF3F8;
    border-radius: 3px;
    color: #212427 !important;
    font-weight: 400 !important;
    font-size: 13px !important;
    line-height: 20px !important;
    padding: 11px 25px;
    min-height: 44px;
    cursor: pointer;
}

.custom-fileinput label svg{
    margin-right: 12px;
}

.custom-whitefileinput label{
    background: #FFFFFF;
    border: 1px solid #DBE3EB;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
    border-radius: 3px;
    padding: 5px 38px;
    color: #7A7B93;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
}


.cus-scroll {
    scrollbar-width: thin;
    scrollbar-color: #2497F3 #CFD0DA;
}

.cus-scroll:-webkit-scrollbar {
width: 2px;
}

.cus-scroll:-webkit-scrollbar-track {
background: #CFD0DA;
border-radius: 2px; 
}

.cus-scroll:-webkit-scrollbar-thumb {
background: #2497F3; 
border-radius: 2px; 
}

.cus-scroll::-webkit-scrollbar {
    width: 2px;
  }
  
  /* Track */
  .cus-scroll::-webkit-scrollbar-track {
    background: #CFD0DA;
    border-radius: 2px; 
  }
   
  /* Handle */
  .cus-scroll::-webkit-scrollbar-thumb {
    background: #2497F3; 
    border-radius: 2px; 
  }
  
  /* Handle on hover */
  .cus-scroll::-webkit-scrollbar-thumb:hover {
    background: #2497F3; 
  }

  .course-desc #html_ifr::-webkit-scrollbar {
    width: 2px;
  }

  .course-desc #html_ifr::-webkit-scrollbar-track {
    background: #CFD0DA;
    border-radius: 2px; 
  }
  .course-desc #html_ifr::-webkit-scrollbar-thumb {
    background: #2497F3; 
    border-radius: 2px; 
  }
  .course-desc #html_ifr::-webkit-scrollbar-thumb:hover {
    background: #2497F3; 
  }


.success-msg{
    color: #00992B !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 24px !important;
}

.error-msg{
    color: #CE2029 !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 24px !important;
}

.dn {
    display: none;
}

.note-msg{
    font-weight: 400;
    font-size: 14px;
    line-height: 24px;
    color: #212427;
}

.shadow-card{
    background: #FFFFFF;
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
}

.light-blue-label{
    background: rgba(33, 175, 255, 0.1);
    border: 1px solid #A0DDFF;
    border-radius: 20px;
    color: #00A3FF;
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    padding: 4px 10px;
    width: fit-content;
    margin-bottom: 0;
    margin-right: 8px;
}

.light-orange-label{
    background: rgba(255, 191, 28, 0.1);
    border: 1px solid #E3B130;
    border-radius: 20px;
    color: #C09117;
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    padding: 4px 10px;
    width: fit-content;
    margin-bottom: 0;
    margin-right: 8px;
}

.light-green-label{
    background: #D8FDCB;
    border: 1px solid #3BD106;
    border-radius: 20px;
    color: #3BD106;
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    padding: 4px 10px;
    width: fit-content;
    margin-bottom: 0;
    margin-right: 8px;
}

.light-gray-label{
    background: #DBE3EB;
    border: 1px solid #A4AFB9;
    border-radius: 20px;
    color: #A4AFB9;
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    padding: 4px 10px;
    width: fit-content;
    margin-bottom: 0;
}


.light-yellow-label{
    background: #FFF3D2;
    border: 1px solid #FFD464;
    border-radius: 20px;
    color: #EBB325;
    font-weight: 500;
    font-size: 12px;
    line-height: 18px;
    padding: 4px 10px;
    width: fit-content;
    margin-bottom: 0;
    margin-right: 8px;
}

.green-text{
    color: #0FC096;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 0;
}

.pink-text{
    color: #FF6678;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 0;
}

.attempt-label{
    background: #FDFDFD;
    border: 0.5px solid #00A3FF;
    border-radius: 2px;
    padding: 2px 10px;
    font-weight: 400;
    font-size: 13px;
    line-height: 30px;
    color: #868C93;
    margin-bottom: 0;
    margin-left: 10px;
}

.attempt-label span{
    color: #212427;
}

.result-status{
    color: #868C93 !important;
    font-weight: 400 !important;
    font-size: 15px !important;
    line-height: 22px !important;
    margin-bottom: 0 !important;
    min-width: 105px;
    text-align: left;
}

.result-status .pass{
    font-weight: 600;
    font-size: 14px;
    line-height: 30px;
    color: #18CA35;
    margin-left: 14px;
}

.result-status .fail{
    font-weight: 600;
    font-size: 14px;
    line-height: 30px;
    color: #EA472A;
    margin-left: 14px;
}

.result-data h6{
    color: #212427 !important;
    font-weight: 600 !important;
    font-size: 15px !important;
    line-height: 22px !important;
    margin-bottom: 7px;
    margin-top: 16px;
}

.result-data p{
    color: #868C93 !important;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 0;
    margin-right: 50px;
}

.result-tab{
    display: flex;
    flex-direction: column;
    min-height: 125px;
    justify-content: space-between;
}

.result-tab-small{
    display: flex;
    flex-direction: column;
    min-height: 100px;
    justify-content: space-between;
}

.result-tab label span{
    margin-left: 14px;
}

.round-dot{
    position: relative;
}

.round-dot::after{
    content: '';
    height: 10px;
    width: 10px;
    border-radius: 50%;
    background: #FFD464;
    position: absolute;
    top: 0px;
    right: -5px;
}

.modal .modal-title.round-dot::after{
    top: 4px;
}

.alert-success{
    background: #63BB80;
    box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: white;
    padding: 15px 50px;
    text-align: center;
    z-index: 99999;
    border: none;
}

.alert-danger{
    background: #F19090;
    box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    color: white;
    padding: 15px 50px;
    text-align: center;
    border: none;
    z-index: 99999;
}

.alert-reqapprove{
    background: #FFFFFF;
    box-shadow: 0px 3px 20px rgba(0, 0, 0, 0.2);
    border-radius: 3px;
    color: #212427;
    font-weight: 400;
    font-size: 13px;
    line-height: 22px;
    padding: 14px 25px;
    text-align: center;
    border: none;
    z-index: 99999;
}

.alert-reqapprove img{
    margin-right: 14px;
}

.myAlert-bottom{
    position: fixed;
    bottom: 5px;
    right:2%;
    width: fit-content;
    display: none;
}

.course-img {
    border: 1px solid #CACED8;
    border-radius: 10px;
    width: 135px;       /* fixed width */
    height: 76px;       /* fixed height */
    overflow: hidden;
    margin-right: 20px;
    flex-shrink: 0;     /* 🔥 prevents shrinking in flex */
}

.course-img img {
    width: 100%;
    height: 100%;
    object-fit: cover; /* 🔥 maintains aspect ratio */
    display: block;
}

.light-blue-btn{
    background: #EBF3F8;
    border-radius: 3px;
    padding: 7px 37px;
    color: #00A3FF;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
}

.light-blue-btn:hover, .light-blue-btn:active, .light-blue-btn:focus{
    background: #EBF3F8 !important;
    color: #00A3FF !important;
}

.disable-btn, .disable-btn:hover{
    background: #DDDEEB !important;
    color: #FFFFFF !important;
    border-color: transparent !important;
    /* pointer-events: none; */
}

.dark-btn{
    color: #212529;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    background-color: transparent;
    border: none;
}

.success-btn{
    color: #00A542;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    background-color: transparent;
    border: none;
}

.max-char-div .form-control{
    padding: 6px 16px 38px;
}

.max-char-div .max-char-text{
    position: absolute;
    bottom: 1px;
    right: 1px;
    color: #A4AFB9;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    background: white;
    width: 98%;
    padding: 0 20px 12px 0;
    text-align: right;
}

.max-char-input-div input{
    padding: 6px 180px 6px 16px;
}

.max-char-input-div .max-char-text{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 7px;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 30px !important;
    color: #A4AFB9 !important;
    margin: 0 !important;
}

.progress{
    background: #FFFFFF;
    border: 1px solid #DBE3EB;
    border-radius: 3px;
    height: 6px;
}

.progress-bar{
    background: #009418;
    border-radius: 3px;
}

.blue-outline-btn{
    border: 1px solid #00A3FF;
    border-radius: 3px;
    padding: 11px 67px;
    color: #001345;
    font-weight: 600;
    font-size: 15px;
    line-height: 22px;
}

.blue-outline-btn:hover, .blue-outline-btn:focus, .blue-outline-btn:active{
    border: 1px solid #00A3FF;
    border-color: #00A3FF !important;
}

.cus-pagination .page-item .page-link{
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    border: none;
    color: #4C555E;
    background: transparent;
}

.cus-pagination  .page-item:last-child .page-link{
    color: #212529;
}

.cus-pagination .disabled>.page-link, .cus-pagination .page-link.disabled{
    color: #92A1AF;
}

.cus-pagination .active>.page-link, .cus-pagination .page-link.active{
    font-weight: 700;
    background-color: transparent;
}

.cus-pagination .page-link:hover, .cus-pagination .page-link:focus{
    background-color: transparent;
    box-shadow: none;
}

.date-input{
    position: relative;
}

.date-input input {
    background-image: url(../image/bx-calendar.png);
    background-repeat: no-repeat;
    background-position: top 10px right 10px;
    cursor: pointer;
}

.red-text{
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    color: #CE2029;
    margin-bottom: 0;
}

.section-head{
    color: #212427;
    font-weight: 600;
    font-size: 22px;
    line-height: 33px;
    margin-bottom: 25px;
    margin-top: 15px;
}

.mce-panel{
    overflow: hidden;
    background-color: #ffffff !important;
    border-radius: 3px;
    border-color: #DBE3EB !important;
}

.mce-btn.mce-disabled button, .mce-btn.mce-disabled:hover button{
    background: white !important;
    background-color: white !important;
    opacity: 1 !important;
    border: 0 !important;
    box-shadow: none !important;
}

.mce-btn{
    border: 0 !important;
}

.mce-menubtn button, .mce-btn button{
    background-color: white !important;
}

.mce-btn.mce-active, .mce-btn.mce-active:hover{
    background: #FCFDFF;
border: 1px solid #E4E4E4 !important;
border-radius: 3px;
}

.table-checkbox{
    margin-right: 20px;
}

.check-tbody tr td:first-child{
    padding: 20px 34px 20px 28px !important;
}

.table-checkbox .form-check-input{
    width: 18px;
    height: 18px;
    border: 1px solid #A4AFB9;
}

.table-checkbox .form-check-input:disabled{
    background: #DFEBF2;
    border: 1px solid #CAD4DD;
    border-radius: 3px;
}

.table-checkbox .form-check-input:focus{
    box-shadow: none;
}

.table-checkbox .form-check-input:checked{
    background-color: #00A3FF;
    box-shadow: none;
}

.break-space{
    white-space: break-spaces;
}

.nowrap{
    white-space: nowrap !important;
}


/* datepicker css start */

.ui-datepicker .ui-datepicker-title .ui-datepicker-month{
    font-size: 14px;
    color: #000000E0;
}   

.ui-datepicker .ui-datepicker-title .ui-datepicker-year{
    font-size: 14px;
    color: #000000E0;
}

.ui-datepicker .ui-datepicker-title .ui-datepicker-month:hover, .ui-datepicker .ui-datepicker-title .ui-datepicker-year:hover{
    color: #1677ff;
}

.ui-datepicker .ui-datepicker-header{
    background: white;
    border: none;
    border-bottom: 1px solid rgba(5, 5, 5, 0.06);
}


.ui-widget.ui-widget-content{
    background: #ffffff;
    box-shadow: 0 6px 16px 0 rgba(0, 0, 0, 0.08), 0 3px 6px -4px rgba(0, 0, 0, 0.12), 0 9px 28px 8px rgba(0, 0, 0, 0.05);
    /* box-shadow: 0px 10px 11px rgba(0, 0, 0, 0.03); */
    border-radius: 10px;
    transition: margin 0.3s;
    border: none !important;
}

.ui-widget-header .ui-icon{
    background-image: url(../image/datepicker-arrow.png) !important;
    background-size: 5px;
}

.ui-datepicker th{
    color: #212427;
    font-weight: 400;
    font-size: 13px;
    line-height: 30px;
}

.ui-icon-circle-triangle-w{
    background-position: center !important;
}

.ui-icon-circle-triangle-e{
    background-position: center !important;
    transform: rotate(180deg);
}
.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus, .ui-button:hover, .ui-button:focus{
    border: none !important;
    background: white !important;
}
.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default, .ui-button, html .ui-button.ui-state-disabled:hover, html .ui-button.ui-state-disabled:active{
    border: none !important;
    background: white !important;
    color: #212427 !important;
    font-weight: 400 !important;
    font-size: 13px !important;
    line-height: 30px !important;
    text-align: center !important;
}
.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight{
    color: #1677ff !important;
    font-weight: 500 !important;
}
.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover{
    top: 2px !important;
}
.ui-datepicker .ui-datepicker-next-hover {
    right: 2px !important;
}
.ui-datepicker .ui-datepicker-prev-hover {
    left: 2px !important;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next{
    cursor: pointer;
}
/* datepicker css end */



/* input[type="date"]:before {

    content: attr(placeholder) !important;

  }

  input[type="date"]:focus:before,

  input[type="date"]:valid:before {

    content: "Date of Birth" !important;

  } */

/* common css end */


/* login and welcome page css start */

.login{
    background: #EAF5FF;
    min-height: 100vh;
    display: flex;
    justify-content: center;
    align-items: center;
    background-image: url(../image/login-bg.png);
    background-repeat: no-repeat;
    background-size: cover;
    background-position: center;
}

.login .login-form{
    background: #FFFFFF;
    box-shadow: 0px 4px 20px rgba(0, 0, 0, 0.15);
    min-height: 100vh;
    padding: 20px 101px;
    text-align: center;
    min-width: 564px;
}

.login .login-form .logo{
    margin-bottom: 40px;
    /* margin-top: 124px; */
}

.login .login-form h4{
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    color: #2C2B2F;
    margin-bottom: 28px;
}

.login .login-form .form-control{
    background: #E9EEF8;
    border: 1px solid #C6D3DC;
    border-radius: 3px;
    padding: 15px;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 12px;
}

.login .login-form .form-control::placeholder{
    color: #B3B7C0;
}

.login .login-form .password-input{
    position: relative;
}

.login .login-form .password-input img{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 15px;
}

.login .form-check-input{
    width: 20px;
    height: 20px;
    background: #FFFFFF;
    border: 1px solid #BDCBD4;
    box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.27);
    border-radius: 0;
}

.login .form-check-input:checked[type=checkbox]{
    background-color: #00a3ff;
}

.login .form-check-label{
    color: #2C2B2F;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    margin-left: 10px;
}

.login .login-form .forgot-link{
    color: #0191E8;
    font-weight: 500;
    font-size: 13px;
    line-height: 20px;
    text-decoration: none;
}

.login .login-form .primary-cus-btn{
    width: 100%;
    margin-top: 32px;
    margin-bottom: 100px;
}

.login .login-form p{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 25px;
    text-align: center;
    margin-bottom: 0;
}

.login .login-form .wel-logo{
    margin-top: 10px;
    margin-bottom: 65px;
}

.login .login-form h2{
    color: #000000;
    font-weight: 500;
    font-size: 29px;
    line-height: 45px;
    margin-bottom: 10px;
}

.login .login-form h5{
    color: #1C6F9D;
    font-weight: 400;
    font-size: 18px;
    line-height: 45px;
}

.login .login-form .mode{
    display: flex;
    justify-content: space-between;
    flex-wrap: wrap;
    margin-top: 40px;
    margin-bottom: 100px;
}

.login .login-form .mode a{
     text-decoration: none;
}

.login .login-form .mode-div .img-div{
    width: 144px;
    height: 144px;
    background: linear-gradient(180deg, #D5EFFF 0%, #FFFFFF 100%);
    border: 2px solid #FFFFFF;
    box-shadow: 0px 30px 79px rgba(0, 0, 0, 0.1);
    border-radius: 90px;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-bottom: 30px;
}

.login .login-form .mode-div h6{
    color: #000000;
    font-weight: 400;
    font-size: 18px;
    line-height: 27px;
    margin-bottom: 20px;
}
.welcome-box{ margin-top:-89px;}
/* login and welcome page css end */



/* dashboard css start */

.main-section{
    background-color: #fff;
    padding: 20px 42px 20px 25px;
    margin-top: 50px;
    margin-left: 270px;
}

.main-section .inner-content{
    background: #F2F6FA;
    box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.07);
}

.inner-content .search-div{
    padding: 25px 24px;
}

.licence-card{
    background: linear-gradient(269.95deg, #018AE0 -1.38%, #01A3FF 97.51%);
    box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.08);
    border-radius: 10px;
    padding: 0px 30px 0px 15px;
    display: flex;
    flex-wrap: wrap;
    align-items: center;
    justify-content: space-between;
    margin-bottom: 15px;
}

.licence-card .light-icon{
    margin-right: 15px;
}

.licence-card h4{
    font-weight: 500;
    font-size: 15px;
    line-height: 22px;
    color: #FFFFFF;
    margin-bottom: 0;
    margin-right: 25px;
}

.licence-card .card-text{
    background: rgba(255, 255, 255, 0.2);
    border: 1px solid rgba(255, 255, 255, 0.2);
    border-radius: 20px;
    padding: 7px 15px;
    margin-right: 20px;
}

.licence-card .card-text.d-flex{
    padding: 0px 15px;
}

.licence-card .card-text.d-flex p{
    margin-right: 15px;
}

.licence-card .card-text.d-flex p:first-child{
    margin-right: 15px;
    padding-right: 10px;
    border-right: 1px solid white;
    line-height: 36px;
}

.licence-card .card-text.d-flex p:nth-child(2){
    padding: 0px 10px 0px 0;
    border-right: 1px solid white;
}

.licence-card .card-text p{
    font-weight: 600;
    font-size: 13px;
    line-height: 20px;
    color: #FFFFFF;
    margin-bottom: 0;
}

.licence-card h5{
    color: #8ED6FF;
    font-weight: 600;
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 0;
}

.categories .card{
    margin-bottom: 15px;
}

.categories .card h4{
    font-weight: 500;
    font-size: 15px;
    line-height: 22px;
    color: #212427;
    margin-bottom: 0;
}

.categories .dark-icon{
    margin-right: 15px;
}

.line-tab .nav-tabs{
    border-bottom: none !important;
    position: relative;
}

.line-tab .nav-tabs::before{
    content: '';
    position: absolute;
    width: 100%;
    height: 1px;
    background-color: #E9EEF8;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.18);
    bottom: 0;
    left: 0;
    z-index: 9;
}

.line-tab .nav-tabs .nav-item.show .nav-link, .line-tab .nav-tabs .nav-link.active, .line-tab .nav-tabs .nav-link:focus, .line-tab .nav-tabs .nav-link:hover{
    border-color: transparent !important;
}

.line-tab .nav-item{
    margin-right: 40px;
}

.line-tab .nav-tabs .nav-link{
    position: relative;
    border:none !important;
    font-weight: 400;
font-size: 15px;
line-height: 22px;
color: #212427;
padding: 10px 24px 16px 24px;
}

.line-tab .nav-tabs .nav-link::after{
    content: '';
    position: absolute;
    display: none;
    bottom: 0.5px;
    width: 38px;
    height: 2px;
    background: #2497F3;
    box-shadow: 0px 0px 16px rgba(0, 0, 0, 0.08);
    border-radius: 3px;
    left: 50%;
    transform: translateX(-50%);
    z-index: 999;
}

.line-tab .nav-tabs .nav-link:hover::after, .line-tab .nav-tabs .nav-link:focus::after{
    display: block;
    z-index: 999;
}

.line-tab .nav-tabs .nav-link.active::after{
    display: block;
}

.line-tab .tab-content{
    padding: 30px;
}

.live-training .training-card{
    background: #F2F6FA;
    border-radius: 10px;
    padding: 10px 13px;
    margin-bottom: 6px;
}

.live-training .training-card h4{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 8px;
}

.live-training .training-card p{
    color: #868C93;
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin-bottom: 0;
}

.user-table{
    border-collapse: separate;
    border-spacing: 0 6px;
    text-align: center;
}

.user-table thead th{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    border-bottom: none;
    white-space: nowrap;
}

.user-table thead th:first-child, .user-table tbody td:first-child{
    text-align: left;
}

.user-table tbody tr td{
    border-bottom: none;
    color: #212427;
    font-weight: 400;
font-size: 15px;
line-height: 22px;
padding: 15px;
vertical-align: middle;
}

.user-table tbody tr td:first-child, .user-table tbody tr td:nth-child(2){
    font-weight: 500;
}

.user-table tbody tr:first-child{
    background-color: #FFFCE5;
}

.user-table tbody tr:nth-child(2){
    background-color: #FAF9F3;
}

.user-table tbody tr:nth-child(3){
    background-color: #F7F7F5;
}

.user-table tbody tr:nth-child(4){
    background-color: #F2F6FA;
}

.plan-ends-card{
    background-image: url(../image/plan-ends.png);
    background-repeat: no-repeat;
    background-size: cover;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 10px;
    padding: 33px 26px;
}

.plan-ends-card h5{
    color: #FFFFFF;
    font-weight: 600;
    font-size: 17px;
    line-height: 26px;
    margin-bottom: 10px;
}

.plan-ends-card p{
    color: #FFFFFF;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 0;
}

.plan-ends-card img{
    margin-right: 17px;
    width: 100%;
    max-width: 54px;
}

.card .no-data{
    text-align: center;
    position: relative;
}

.card .no-data p{
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    margin-bottom: 0;
    color: #757882;
    font-weight: 500;
    font-size: 14px;
    line-height: 26px;
    max-width: 80px;
}

.no-live-training{
    text-align: center;
}

.no-live-training img{
    mix-blend-mode: luminosity;
opacity: 0.6;
}

.no-live-training p{
    margin-bottom: 0;
    margin-top: 22px;
    color: #757882;
    font-weight: 500;
    font-size: 14px;
    line-height: 26px;
}

/* dashboard css end */


/* placeholder > department, group, user css start */

.round-tabs .nav-tabs{
    border-bottom: none;
}

.round-tabs .nav-tabs .nav-item.show .nav-link, .round-tabs .nav-tabs .nav-link.active{
    color: #FFFFFF;
    background: #00A3FF;
    border-color: transparent;
}

.round-tabs .nav-item{
    margin-right: 5px;
}

.round-tabs .nav-tabs .nav-link{
    background: #E3F4FF;
    color: #868C93;
    font-weight: 400;
    font-size: 15px;
    line-height: 22px;
    padding: 12px 18px;
    min-width: 137px;
}

.round-tabs .nav-tabs .nav-link:focus, .round-tabs .nav-tabs .nav-link:hover{
    border-color: transparent;
}

.round-tabs .tab-content{
    background: #F2F6FA;
    box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.07);
}

.search-div{
    background: #FFFFFF;
    padding: 12px 24px 24px;
}

.search-div .search-input .form-control{
    margin: 12px 0 0;
    padding: 6px 42px 6px 16px;
}

.search-div .primary-cus-btn{
    margin: 12px 0 0;
}

.search-div h4{
    color: #212427;
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    margin: 0 19px 0 23px;
}

.search-div .back-btn{
    margin: 0;
}

/* .search-div .back-btn:hover svg path{
    fill: #00A3FF;
    stroke: unset;
} */

.search-div h6{
    color: #212427;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    margin-bottom: 0;
    margin-right: 8px;
}

/* placeholder > department, group, user css end */

/* placeholder > department > technology css start */

.modal .invite-div{
    display: flex;
    align-items: center;
    justify-content: end;
    flex-wrap: wrap;
}

.modal .invite-div p{
    color: #212427;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    margin-right: 21px;
    margin-bottom: 0;
}



.vertical-tab .nav-tabs .nav-link{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    border: none;
    padding: 10px 33px;
    position: relative;
    background: white;
    min-width: unset;
}

.vertical-tab .nav-tabs .nav-link:first-child{
    padding-left: 0;
}

.vertical-tab .nav-tabs .nav-link::after{
    content: '';
    position: absolute;
    right: 0;
    top: 50%;
    height: 14px;
    background-color: #C2CCE2;
    width: 2px;
    transform: translateY(-50%);
}

.vertical-tab .nav-tabs .nav-link:last-child:after{
    display: none;
}

.vertical-tab .nav-tabs .nav-item.show .nav-link, .vertical-tab .nav-tabs .nav-link.active{
    color: #212427;
    background: white;
    font-weight: 600;
}

.vertical-tab .nav-tabs{
    border-bottom: none;
}

.vertical-tab .tab-content{
    padding-top: 20px;
    position: relative;
    background: white;
    box-shadow: none;
}

.vertical-tab .tab-content::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 1px;
    background-color: #E9EEF8;
    box-shadow: 0px 3px 10px rgba(0, 0, 0, 0.18);
}

.vertical-tab nav{
    margin-bottom: 15px;
}

.no-course-add{
    display: flex;
    align-items: center;
    justify-content: center;
    flex-direction: column;
    height: 220px;
}

.no-course-add p{
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    color: #A4AFB9;
    margin-top: 18px;
    margin-bottom: 0;
}

.create-user-div{
    display: flex;
    align-items: center;
    justify-content: end;
}

.create-user-div .view-all{
    margin-top: 12px;
    margin-right: 15px;
    border: 1px solid #C2CCE2;
    border-radius: 3px;
}

.create-user-div .see-all-btn{
    padding: 10px 12px;
}

.theme-table .user-dept label:first-child{
    border-right: 1px solid #C2CCE2;
    padding-right: 10px;
    margin-right: 6px;
}

.user-bulk-select {
    background: #FFFFFF;
    border: 1px solid #D4DDE7;
    box-shadow: inset 0px 0px 10px rgba(0, 0, 0, 0.05);
    border-radius: 3px;
    padding: 6px;
}

.user-bulk-select .theme-table{
    vertical-align: bottom;
}

.user-bulk-select .theme-table tbody tr{
    box-shadow: none;
}

.user-bulk-select .theme-table tbody tr td{
    padding: 7px 5px;
}

.user-bulk-select .modal-checkmark{
    margin-bottom: 16px;
}

.user-bulk-select .cus-scroll{
    max-height: 300px;
    overflow-y: auto;
}

.user-bulk-select .select-all{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
}

.user-bulk-select .theme-table tbody tr td:last-child{
    border-right: 0 !important;
}

.user-bulk-select .theme-table tbody tr td:first-child{
    border-left: 0 !important;
}

.user-dlt{
    position: absolute;
    top: 4px;
    right: -26px;
}

#createuseremailAddModal .form-input{
    margin-bottom: 10px;
}

/* placeholder > user > user course css start */

.user-course-div{
    padding-top: 0 !important;
    padding-right: 0 !important;
    border-top-right-radius: 30px;
}

.user-course-div h6{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 7px;
    margin-left: 23px;
}

.search-div .status-drop{
    display: flex;
    align-items: center;
}

.search-div .status-drop label{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-right: 15px;
}

.search-div .status-drop .cus-dropdown .btn{
    min-width: 140px;
}

.user-course-div .blue-tabs .nav-tabs{
    background-image: url(../image/tab-bg-reverse.png);
    justify-content: end;
    background-position: right;
}


/* placeholder > user > user course css end */


/* placeholder > department > technology css end */


/* placeholder > group > category css start */

.assign-modal-dropdown{
    padding: 16px 20px;
}

.assign-modal-dropdown .form-check{
    margin-bottom: 0;
    padding-left: 0px;
}

.assign-modal-dropdown .form-check .form-check-input{
    position: absolute;
    opacity: 0;
}

.assign-modal label{
    width: 100%;
    cursor: pointer;
    color: #212427;
    font-weight: 400 !important;
    font-size: 13px !important;
    line-height: 30px !important;
    margin: 0 !important;
}
.assign-modal-dropdown .form-check .form-check-input:checked ~ .form-check-label{
    background-image: url(../image/checkmark.png);
    background-repeat: no-repeat;
    background-position: top 10px right 20px;
}

.assign-modal h5{
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 30px !important;
    color: #A4AFB9 !important;
    margin-bottom: 10px !important;
    margin-left: 0 !important;
}

.assign-modal-dropdown .search-input{
    min-width: 438px;
    margin-right: 20px;
    margin-bottom: 10px;
}

.assign-modal-dropdown .search-input .form-control{
    padding: 6px 40px 6px 16px;
}

.assign-modal-dropdown .blue-btn, .assign-modal-dropdown .gray-btn{
    margin-bottom: 10px;
}

.assign-modal-dropdown .course-list{
    max-height: 130px;
    overflow-y: auto;
}

.assign-modal .added-course{
    padding: 10px 20px;
    background: #FFFFFF;
    border: 1px solid #E9EEF8;
    border-radius: 3px;
    margin-top: 8px;
    margin-bottom: 22px;
}

.assign-modal .dropdown-toggle.show::after{
    transform: rotate(180deg);
    top: 45%;
}

.create-grp-search .search-icon{
    top: 50% !important;
    right: 15px !important;
}

.group-courses{
    box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.15);
    margin-bottom: 15px;
}

.group-courses h5{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin: 5px 19px 0 23px;
}

.group-courses .cus-dropdown .btn{
    min-width: 123px;
}
/* 
.group-courses .primary-cus-btn:hover svg path{
    stroke: unset;
    fill: #00A3FF;
} */

.group-courses p{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-top: 20px;
    margin-bottom: 0;
}

.blue-tabs .nav-tabs {
    border-bottom: 0;
    background-image: url(../image/tab-bg.png);
    background-repeat: no-repeat;
    padding-left: 20px;
}

.blue-tabs .nav-tabs .nav-link{
    color: #8ED6FF;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    border: none;
    padding: 24px;
    position: relative;
}

.blue-tabs .nav-tabs .nav-item.show .nav-link, .blue-tabs .nav-tabs .nav-link.active{
    color: #FFFFFF;
    background-color: transparent;
}

.blue-tabs .nav-tabs .nav-link::after{
    content: '';
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 0;
    background-color: #8ED6FF;
    width: 1px;
    height: 24px;
}

.blue-tabs .nav-tabs .nav-item:last-child .nav-link:after{
    display: none;
}

.radius-30{
    border-top-left-radius: 30px;
}

.blue-tabs .tab-content{
    padding: 22px 20px;
}

.blue-tabs label{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
}

.blue-tabs .outline-label{
    margin-left: 15px;
}

.blue-tabs .program-card{
    background: #F8FAFC;
    padding: 14px 20px;
    margin-bottom: 6px;
}

.blue-tabs .program-card h5{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 3px;
    margin-right: 8px;
}

.category-users{
    padding: 20px 28px;
   
}

.category-users h6{
    color: #212427;
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 0;
    margin-right: 10px;
}

.category-users ul{
    padding-left: 0;
    margin-top: 24px;
    max-height: 380px;
    overflow-y: auto;
}

.category-users ul li{
    
    display: flex;
    align-items: center;
    margin-bottom: 18px;
}

.category-users ul li a{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    text-decoration: none;
}

.category-users ul li p{
    margin-left: 15px;
}

/* placeholder > group > category css end */

/* create course css start */
.step-wizard-navigation{
    padding: 10px 97px;
    border-bottom: 1px solid #DFEBF2;
    margin-top: 51px;
    display: flex;
    align-items: center;
}

.step-wizard-navigation p, .step-wizard-navigation p a{
    color: #000000;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    margin-bottom: 0;
    text-decoration: none;
}

.step-wizard-navigation p svg{
    margin: 0 9px;
}

.step-wizard{
    padding: 30px 97px;
}

.step-wizard .back-btn{
    min-width: unset !important;
    margin-bottom: -60px;
}

.step-wizard .multistep-form {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(0, 1fr));
  }
  
  .step-wizard .multistep-btn {
    transition-property: all;
    transition-duration: 0.15s;
    transition-timing-function: linear;
    transition-delay: 0s;
    position: relative;
    padding-top: 43px;
    color: #212427;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    /* text-indent: -9999px; */
    border: none;
    background-color: transparent;
    outline: none !important;
    cursor: pointer;
  }

  .step-wizard .multistep-btn span{
    position: absolute;
    color: #212427;
    font-weight: 500;
    font-size: 15px;
    line-height: 30px;
    LEFT: 50%;
    top: 6px;
    z-index: 99;
    transform: translateX(-50%);
  }
  
  .step-wizard  .multistep-btn:before {
    position: absolute;
    top: 0;
    left: 50%;
    display: block;
    width: 39px;
    height: 39px;
    content: '';
    transform: translateX(-50%);
    transition: all 0.15s linear 0s, transform 0.15s cubic-bezier(0.05, 1.09, 0.16, 1.4) 0s;
    transition: all 0.15s linear 0s, transform 0.15s cubic-bezier(0.05, 1.09, 0.16, 1.4) 0s, -webkit-transform 0.15s cubic-bezier(0.05, 1.09, 0.16, 1.4) 0s;
    border-radius: 50%;
    background-color: #0000000d;
    box-sizing: border-box;
    z-index: 3;
  }
  .step-wizard .multistep-btn:after {
    position: absolute;
    top: 19px;
    left: calc(-37% - 12px / 2);
    transition-property: all;
    transition-duration: 0.15s;
    transition-timing-function: linear;
    transition-delay: 0s;
    display: block;
    width: 80%;
    height: 1px;
    content: '';
    background-color: #A0C6D6;
    z-index: 1;
  }
  .step-wizard .multistep-btn:first-child:after {
    display: none;
  }
  /* .step-wizard .multistep-btn.js-active {
    color: #007bff;
  } */
  .step-wizard .js-active:before {
    background-color: #99E0FF;
  }

  .step-wizard .js-noactive:before{
    /* background-color: #0000000d; */
    background-color: #E9F8FF;
  }
  
  .step-wizard .multisteps-card {
    position: relative;
    
  }
  
  .step-wizard .multistep-panel {
    position: absolute;
    top: 0;
    left: 0;
    width: 100%;
    height: 0;
    opacity: 0;
    visibility: hidden;
    display: none;
  }

  .curriculam-panel .step-card{
    padding: 20px 68px 70px 28px !important;
  }

  .step-wizard .multistep-panel .step-card{
    background: #FCFBFF;
    border: 1px solid #DBE3EB;
    border-radius: 3px;
    padding: 20px 50px 50px;
    margin-bottom: 42px;
  }

  .step-wizard .multistep-panel.js-active {
    height: auto;
    opacity: 1;
    visibility: visible;
    display: block;
  }
  
  .step-wizard .multistep-panel[data-animation="fadeIn"].js-active {
    transition-property: all;
    transition-duration: 0.3s;
    transition-timing-function: linear;
    transition-delay: 0s;
  }

  .step-wizard .multistep-panel label{
    color: #212427;
    font-weight: 500;
    font-size: 16px;
    line-height: 30px;
    margin-top: 30px;
    margin-bottom: 8px;
}

.step-wizard .multistep-panel .js-btn-next, .step-wizard .multistep-panel .js-btn-prev{
    margin-top: 70px;
    min-width: 152px;
}

.step-wizard .preview-btn, .step-wizard .primary-cus-btn{
    min-width: 152px;
}

.step-wizard .multistep-panel .js-btn-prev, .step-wizard .multistep-panel .preview-btn{
    margin-right: 12px;
    background: #DFEBF2 !important;
    color: #004267 !important;
    font-weight: 400 !important;
}

.step-wizard .multistep-panel svg{
    min-width: 16px;
    
}

.step-wizard .multistep-panel .team-handle, .step-wizard .user-handle{
    cursor: all-scroll;
}

.step-wizard .multistep-panel .js-btn-prev:hover{
    border-color: transparent !important;
    color: #004267 !important;
}

.step-wizard .multistep-panel h6{
    color: #000000;
    font-weight: 300;
    font-size: 13px;
    line-height: 23px;
    margin-bottom: 25px;
}

.step-wizard .multistep-panel .total-count{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 29px;
    margin-top: 15px;
    margin-bottom: 0;
}

.step-wizard .multistep-panel .total-count span{
    font-weight: 600;
}

.step-wizard .multistep-panel .total-count span.green-text{
    color: #00A607;
}

.step-wizard .save-draft-sec{
    position: relative;
}

.step-wizard .save-draft-sec::after{
    content: '';
    position: absolute;
    background-color:  #DBE3EB;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
    border-radius: 3px;
    height: 1px;
    width: 100%;
    max-width: 590px;
    left: 50%;
    transform: translateX(-50%);
    top: 35px;
}

.upload-cover-pic{
    padding: 10px;
    background: #FFFFFF;
    border: 1px solid #CACED8;
    border-radius: 3px;
}

.upload-cover-pic .cover-img{
    width: 137px;
    min-width: 137px;
    height: 78px;
    border: 1px solid #CACED8;
    border-radius: 3px;
    overflow: hidden;
    margin-right: 22px;
    background-color: #F3F1F8;
    background-image: url(../image/cover-img-bg.png);
    background-repeat: no-repeat;
    background-position: center;
}

.upload-cover-pic .cover-img img{
    width: 100%;
}

.upload-cover-pic .img-data h5{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 0;
}

.upload-cover-pic .img-data h6{
    color: #A4AFB9;
    font-weight: 400;
    font-size: 13px;
    line-height: 30px;
    margin-bottom: 0;
}

.main-step-wizard{
    min-height: calc(100vh - 115px);
}

.number-input{
    position: relative;
    border: 1px solid #CACED8;
    padding: 8px;
    background: #FFFFFF;
    border-radius: 3px;
}

.number-input svg{
    position: absolute;
    top: -8px;
    right: -8px;
}

.number-input input{
    border: none;
    color: #212427;
}
.number-input .number-weight{
        background: unset;
    text-align: center;
}

.number-input .number{
    background: #FFFFFF;
    border: 1px solid #CACED8;
    border-radius: 3px;
    width: 75px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 8px;
    color: #212427;
    z-index: 9;
}

.number-input .number.green{
    background: #DBF9DC;
}

.number-input .req-text{
    position: absolute;
    top: -10px;
    left: 10px;
    color: #CE2029;
    font-weight: 400;
    font-size: 10px;
    line-height: 20px;
    background-color: white;
    margin-bottom: 0 !important;
    padding: 0 2px;
}

.number-input .cus-dropdown .btn{
    border-color: transparent !important;
}

.number-input .cus-dropdown .dropdown-menu{
    width: 105%;
    transform: translate(-9px, 7px) !important;
}

.add-more-btn{
    padding: 7px 23px;
    color: #67737E;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    background: #ECECEC;
    border: 1px solid #CACED8;
    border-radius: 3px;
    margin-top: 15px;
    margin-right: 18px;
}

.add-more-btn svg{
    margin-right: 15px;
}

.step-card .createimg{
    width: 100%;
    max-width: 103px;
    margin: 26px auto 18px;
}

.step-card .section-card{
    background: #FFFFFF;
    border: 1px solid #DBE3EB;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
    border-radius: 3px;
    padding: 11px 20px;
    width: 100%;
    margin-bottom: 20px;
}

.form-check-terms{
    margin-top: 31px;
    margin-bottom: 20px;
}

.form-check-terms .form-check-input{
    box-shadow: inset 0px 0px 7px rgba(0, 0, 0, 0.15);
    border-radius: 3px;
    width: 18px;
    height: 18px;
    margin-right: 12px;
}

.form-check-terms .form-check-input:checked{
    background-color: #A4AFB9;
    border-color: #A4AFB9;
}

.form-check-terms .form-check-label{
    color: #212427 !important;
    font-weight: 500 !important;
    font-size: 13px !important;
    line-height: 20px !important;
    margin-top: 0 !important;
}

.form-check-terms .form-check-label a{
    color: #0065B4 !important;
    cursor: pointer;
}

.form-check-terms.disabled .form-check-label, .form-check-terms.disabled .form-check-label a{
    color: #A4AFB9 !important;
}

.form-check-terms.disabled{
    cursor: not-allowed;
    pointer-events: none;
}

.mw-fit{
    min-width: fit-content !important;
}

.card-shadow-btn{
    background: #FFFFFF;
    border: 1px solid #DBE3EB;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
    border-radius: 3px;
    padding: 8px 30px;
    width: fit-content;
    margin-bottom: 22px;
    min-width: 293px ;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 30px !important;
    cursor: pointer;
}

.card-shadow-btn svg{
    margin-right: 10px !important;
    margin-top: 0 !important;
}

.drag-sec{
    display: flex;
}

.drag-sec svg{
    margin-top: 32px;
    margin-right: 24px;
}

.drag-sec .accordion-body svg{
    margin-top: 20px;
}

.drag-sec .section-card .input-group{
    padding: 11px 14px;
    border: 1px solid #DBE3EB;
    border-radius: 3px;
    margin-right: 15px;
}

.drag-sec .section-card .input-group .input-group-text{
    color: #212427;
    font-weight: 600;
    font-size: 14px;
    line-height: 30px;
    background-color: #fff;
    padding: 0 16px 0 0;
    border:none;
    border-right: 1px solid #DBE3EB;
}

.drag-sec .section-card .input-group input{
    border: none;
    padding: 0;
    margin-left: 16px !important;
}

.drag-sec .section-card .btn-group .btn{
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    color: #212427;
}

.drag-sec .section-card .btn-group .save-disable{
    color: #A4AFB9;
}

.drag-sec .section-card .btn-group .save-btn{
    color: #00B649;
}

.section-card .accordion-button{
    padding: 23px 34px;
    color: #212427;
    font-weight: 600;
    font-size: 14px;
    line-height: 30px;
    white-space: nowrap;
}

.section-card .accordion-button span{
    font-weight: 400;
    padding-left: 16px;
    border-left: 1px solid #DBE3EB;
    margin-left: 16px;
    white-space: initial;
}

.section-card .accordion-button:focus, .section-card .accordion-button:not(.collapsed){
    color: #212427;
    background-color: white;
    box-shadow: none;
    border-color: transparent;
}

.section-card .accordion-button::after{
    width: 11px;
    height: 7px;
    background-size: 11px;
}
.section-card .accordion-button::after{
    background-image: url(../image/accordian-btn.png);
}

.section-card .accordion-button:not(.collapsed)::after{
    background-image: url(../image/accordian-btn.png);
}

.section-card .accordion-header{
    display: flex;
}

.section-card .accordion-header .view-all{
    display: flex;
    align-items: center;
}

.section-card .accordion-header .view-all .see-all-btn{
    padding: 2px 40px 2px 28px;
    border-left: 1px solid #DBE3EB;
}

.section-card .accordion-header .view-all .see-all-btn svg{
    margin-top: 0;
    margin-right: 0;
}

.section-card .accordion-body{
    border-top: 1px solid #DBE3EB;
    padding: 30px 20px 20px 25px;
}

.card-primary-btn{
    background: #E9F8FF;
    border: 1px solid #DBE3EB;
    border-radius: 3px;
    padding: 8px 56px;
    color: #7A7B93 !important;
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 30px !important;
    display: flex;
    line-height: 30px;
    align-items: center;
    justify-content: center;
    min-width: 226px;
    margin-bottom: 10px;
}

.card-primary-btn svg{
    margin-right: 12px;
    margin-top: 0 !important;
}

.step-card .save-sec-btn{
    background: #CED4DA;
    border-radius: 3px;
    margin: 20px auto 0;
    padding: 8px 40px;
    color: #FFFFFF;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    min-width: 293px;
    display: flex;
    justify-content: center;
    align-items: center;
    border: none;
}

.drag-sec .purple-card{
    margin-bottom: 20px;
}

.drag-sec .purple-card .accordion-header{
    background: #FCFBFF;
}

.drag-sec .purple-card .accordion-button{
    background: #FCFBFF;
    padding: 10px 12px;
    font-weight: 500;
}

.drag-sec .purple-card .accordion-body{
    background: #FCFBFF;
}

.drag-sec .purple-card .accordion-header .view-all .see-all-btn{
    padding: 2px 20px 2px 8px;
    border-bottom: none;
}

.drag-sec .purple-card .card-shadow-btn{
    min-width: 215px;
    margin-bottom: 8px;
}

.section-card .sec-inner-card{
    background: #FFFFFF;
    border: 1px solid #DBE3EB;
    border-radius: 3px;
    padding: 18px 50px 8px 18px;
    position: relative;
    margin-bottom: 8px;
}

.section-card .sec-inner-card .inner-card-btn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 28px;

}

.section-card .sec-inner-card .custom-fileinput label{
    background: #E9F8FF !important;
}

.section-card .sec-inner-card .inner-card-btn svg{
    margin-top: 0;
    margin-right: 0;
}

.section-card .sec-inner-card .sec-head{
    color: #212427;
    font-weight: 500;
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 14px;
    text-align: center;
}

.section-card .sec-inner-card .or-text{
    color: #7A7B93;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 10px;
}

.section-card .sec-inner-card h6{
    color: #212427;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 10px;
    position: relative;
}

.section-card .sec-inner-card .inner-card-btn .btn{
    padding: 0;
}

.section-card .sec-inner-card .yt-link{
    color: #212529;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
}

 

.section-card .add-resourse-file p{
    color: #7A7B93;
    font-weight: 400;
    font-size: 13px;
    line-height: 20px;
    margin-bottom: 0;
}   

.section-card .add-resourse-file h6{
    color: #212529;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 9px;
}

.section-card .add-resourse-file .upload-file{
    color: #7A7B93 !important;
}

.section-card .yt-card{
    padding: 20px 95px 8px 18px;
}

.section-card .yt-card .yt-verify{
    cursor: pointer;
}

.section-card .yt-card .yt-verify:hover .yt-link-verify{
    display: block;
}  

.section-card .yt-card .yt-link-verify{
    padding: 15px;
    background: #FFFFFF;
    box-shadow: 0px 3px 24px rgba(0, 0, 0, 0.18);
    border-radius: 5px;
    max-width: 550px;
    position: absolute;
    min-width: 550px;
    left: 166px;
    bottom: 4px;
    display: none;
    transition: all 0.3s;
}

.section-card .yt-card .yt-link-verify ul li{
    color: #212529;
    font-weight: 400;
    font-size: 14px;
    line-height: 25px;
    letter-spacing: -0.01em;
}
.section-card .yt-card .yt-link-verify ul{
    margin-bottom: 0;
}

.section-card .question-card{
    background: #FFFFFF;
    border: 1px solid #DBE3EB;
    border-radius: 3px;
    padding: 14px 14px 3px;
    margin-bottom: 5px;
}

.section-card .question-card .save-btn, .section-card .question-card .dlt-btn{
    font-weight: 500;
    font-size: 13px;
    line-height: 30px;
    margin-bottom: 15px;
}

.section-card .question-card .save-btn{
    color: #00A3FF !important;
    padding-left: 0;
}

.section-card .question-card .dlt-btn{
    color: #212427;
}

.section-card .question-card h5{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-right: 12px;
    margin-bottom: 10px;
}

.section-card .question-card h6{
    color: #000000;
    font-weight: 300;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 10px;
}

.answer-card{
    padding: 6px;
}

.answer-card .answer-options .options{
    display: flex;
    align-items: start;
    width: 100%;
    margin-bottom: 5px;
    justify-content: space-between;
}

.answer-card .answer-options .options .btn{
    margin-left: 10px;
}   

.answer-card .answer-options .options svg{
    margin-top: 0;
}

.card-primary-btn{
    padding: 8px 15px;
    /* min-width: unset; */
}

.answer-card .answer-options .form-check .form-check-input{
    background-color: #FFFFFF;
    border: 1px solid #B3B8C7;
    border-radius: 3px;
    width: 20px;
    height: 20px;
    margin-left: -35px;
    margin-top: 10px;
}

.answer-card .answer-options .form-check{
    padding-left: 35px;
    width: 92%;
}

.answer-card .answer-options .form-check .form-check-input:focus{
    box-shadow: none;
}

.answer-card .answer-options .form-check .form-check-input:checked {
    background-color: #09B4A9;
    border-color: #09B4A9;
    box-shadow: none;
    background-image: url(../image/radiocheck.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 10px;
}

.answer-card .answer-options .ans-desc{
    margin-bottom: 15px;
}

.answer-card .answer-options .ans-desc p{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 5px;
}

.add-answer-btn{
    color: #212427 !important;
}

.terms-modal p{
    font-weight: 400;
    font-size: 13px;
    line-height: 24px;
    color: #212427;
}

.delete-data-modal{
     text-align: center;
}

.delete-data-modal .modal-header{
    display: block;
    padding: 45px 35px 10px;
}

.delete-data-modal .modal-header .modal-title{
    color: #212529;
    font-weight: 600;
    font-size: 15px;
    line-height: 30px;
}

.delete-data-modal .modal-header .btn-close{
    position: absolute;
    right: 15px;
    top: 15px;
    margin: 0 !important;
    background: transparent url(../image/fill-close.png);
    background-repeat: no-repeat !important;
    background-size: 24px !important;
    opacity: 1;
    width: 24px;
    height: 24px;
}

.delete-data-modal p{
    color: #212529;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 13px;
}

.delete-data-modal .modal-body{
    text-align: center;
}

.course-desc #html_ifr{
    height: 118px !important;
}

.step-card .card-primary-btn.active-btn{
    background: #99E0FF;
}

.step-card .card-primary-btn.deactive-btn{
    background: #CED4DA;
    color: #7A7B93;
}

/* create course css end */

/* create assessment css start */
.step-wizard .passing-marks{
    position: relative;
}

.step-wizard .passing-marks svg{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 14px;
    max-height: 16px;
}

.step-card .upload-assessment .card-primary-btn{
    flex-direction: column;
    min-height: 207px;
    min-width: 452px;
    max-width: 452px;
    margin-left: auto;
    margin-right: auto;
    font-size: 13px !important;
    cursor: pointer;
}

.step-card .upload-assessment .card-primary-btn svg{
    margin-bottom: 10px;
}

.curriculam-panel .file-upload-div{
    position: relative;
    margin-top: 20px;
    margin-bottom: 20px;
}

.curriculam-panel .file-upload-div input{
    min-height: 65px;
}

.curriculam-panel .file-upload-div .upload-btn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 18px;
    display: flex;
}

.curriculam-panel .file-upload-div .upload-btn .card-primary-btn{
    margin-bottom: 0;
}

.curriculam-panel .file-upload-div .upload-btn .current-file{
    background:#FDEDCF;
}

.curriculam-panel .upload-text{
    display: flex;
    align-items: center;
}

.curriculam-panel .upload-text h6{
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 30px !important;
    color: #212427 !important;
    margin-bottom: 0 !important;
}

.curriculam-panel .upload-text .card-primary-btn{
    margin-right: 16px;
    height: 44px;
}

.curriculam-panel .add-question-sec{
    padding: 22px 27px;
    background: #FFFFFF;
    border: 1px solid #CACED8;
    border-radius: 3px;
    margin-top: 25px;
}

.curriculam-panel .add-question-sec .add-que-card{
    background: #FFFFFF;
    border: 1px solid #B3B8C7;
    border-radius: 3px;
    position: relative;
    margin-bottom: 20px;
}

.curriculam-panel .add-question-sec .add-que-card .card-head{
    padding: 10px 16px 0;
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
}

.curriculam-panel .add-question-sec .add-que-card .card-head h5{
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    color: #212427;
    margin-bottom: 10px;
}

.curriculam-panel .add-question-sec .add-que-card .card-head .card-head-btn{
    display: flex;
}

.curriculam-panel .add-question-sec .add-que-card .card-head .card-head-btn button{
    margin-bottom: 8px;
}

.curriculam-panel .add-question-sec .add-que-card .card-head .card-head-btn .card-primary-btn{
    border: none;
    padding: 10px 8px;
}

.curriculam-panel .add-question-sec .add-que-card .card-head .card-head-btn .blue-btn{
    padding-left: 10px;
    border-left: 1px solid #B3B8C7;;
}

.curriculam-panel .add-question-sec .add-que-card .card-body{
    padding: 16px 21px;
    border-top: 1px solid #B3B8C7;
}

.curriculam-panel .add-question-sec .add-que-card .upload-img-div{
    display: flex;
    flex-wrap: wrap;
    justify-content: space-between;
    border-bottom: 1px solid #B3B8C7;
    margin-bottom: 10px;
}

.curriculam-panel .add-question-sec .add-que-card .upload-img-div .img-box{
    background: #E0F1F6;
    border: 0.627737px solid #CACED8;
    border-radius: 2px;
    width: 86px;
    min-width: 86px;
    height: 48.96px;
    background-image: url(../image/cover-img-bg.png);
    background-repeat: no-repeat;
    background-position: center;
    background-size: 24px;
    margin-right: 12px;
}

.curriculam-panel .add-question-sec .add-que-card .upload-img-div .img-box img{
    min-width: 100%;
}

.curriculam-panel .add-question-sec .add-que-card .upload-img-div h6{
    color: #A4AFB9;
    font-weight: 400;
    font-size: 13px;
    line-height: 30px;
    margin-bottom: 0;
}

.curriculam-panel .add-question-sec .add-que-card .form-check{
    width: 100%;
}

.ans-opt{
    display: flex;
}

.ans-opt h5{
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
    color: #212427;
    margin-right: 15px;
    min-width: 119px;
}

.ans-opt label{
    font-weight: 500 !important;
    font-size: 14px !important;
    line-height: 30px !important;
    color: #212427 !important;
    margin-top: 0 !important;
}

.ans-opt .form-check .form-check-input{
    background-color: #FFFFFF;
    border: 1px solid #B3B8C7;
    box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.17);
    width: 14px;
    height: 14px;
    border-radius: 50%;
    margin-left: -24px;
    margin-top: 8px;
}

.ans-opt .form-check .form-check-input:checked[type=radio]{
    background-image: url(../image/ansradio-check.png);
    background-repeat: no-repeat;
    background-size: 8px;
    background-position: center;
}

.curriculam-panel .add-que-card .close{
    position: absolute;
    top: 13px;
    right: -23px;
    padding: 0;
}

.curriculam-panel .step-card .blue-outline-btn{
    margin-top: 30px;
}

/* create assessment css end */

/* create journey css start */
.journey-data{
    padding: 0 0 20px 0;
    position: relative;
    border-bottom: 1px solid #E6E9F0;
    margin-bottom: 20px;
}

.journey-data .card-content{
    display: flex;
    align-items: center;
    margin-bottom: 8px;
}

.journey-data h6{
    margin-bottom: 0 !important;
    margin-right: 18px;
    margin-left: 18px;
    min-width: 18px;
}

.journey-data .journey-card{
    background: #FFFFFF;
    box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.08);
    border-radius: 3px;
    padding: 15px;
    width: 100%;
    display: flex;
    align-items: center;
    min-height: 74px;
}

.journey-data .journey-card .dlt-btn{
    color: #212427;
    font-weight: 500;
    font-size: 14px;
    line-height: 30px;
}

.journey-data .journey-card .blue-btn{
    font-weight: 600;
    margin-left: 20px;
}

.journey-data .journey-card .cus-dropdown{
    width: 100%;
}

.journey-data .journey-card p{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 30px;
    margin-bottom: 0;
    width: 100%;
}

.journey-data .journey-card .view-all{
    margin-right: 10px;
}

.margin-cus{
    margin-left: 23px;
}

.journey-detail-sec .blue-tabs .program-card{
    position: relative;
    z-index: 9;
}

.journey-detail-sec .blue-tabs h4{
    color: #212427;
    font-weight: 600;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 15px;
}

.journey-detail-sec .blue-tabs h5{
    font-weight: 600;
    font-size: 15px;
    line-height: 25px;
    margin-bottom: 5px;
}

.journey-detail-sec .blue-tabs .inner-data{
    margin-right: 50px;
    display: flex;
    align-items: center;
    margin-top: 10px;
}

.journey-detail-sec .blue-tabs .inner-data label{
    font-weight: 500;
    margin-right: 10px;
}

.journey-detail-sec .blue-tabs .inner-data p{
    font-weight: 500;
    font-size: 16px;
    line-height: 24px;
    color: #212529;
    margin-bottom: 0;
}

.journey-detail-sec .card-lines{
    position: relative;
}

.journey-detail-sec .card-lines::before, .journey-detail-sec .card-lines::after{
    content: '';
    position: absolute;
    height: 100%;
    width: 10px;
    background-color: #E9EEF8;
    top: 0;
}

.journey-detail-sec .card-lines::before{
    left: 80px;
}

.journey-detail-sec .card-lines::after{
    right: 80px;
}

.training-form{
    background: #FCFBFF;
    border: 1px solid #DBE3EB;
    padding: 40px 20px;
}

.training-form h4{
    font-size: 20px;
    margin-bottom: 20px;
}

.training-form label{
    margin-bottom: 10px;
    font-size: 14px;
}

.training-form .form-control{
    margin-bottom: 10px;
}

.required-text{
    position: absolute;
    top: -11px;
    right: 100px;
    font-weight: 500;
    font-size: 16px;
    line-height: 30px;
    color: #212427;
    margin-bottom: 0;
}

/* create journey css end */

/* create live training css start */
.livetraining-radio label{
    margin-right: 95px;
}

.livetraining-radio .form-check-input{
    width: 20px !important;
    height: 20px !important;
    margin-top: 5px !important;
    margin-right: 12px !important;
    box-shadow: none !important;
}

.livetraining-radio .ans-opt .form-check .form-check-input:checked[type=radio]{
    background-size: 10px;
}
/* create live training css end */

.blue-tabs .course-card{
    background: #F8FAFC;
    padding: 14px 20px;
    margin-bottom: 6px;
}

.blue-tabs .course-card h5{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 3px;
    margin-right: 8px;
}

/* @media (min-width: 500px) {
    .step-wizard .multistep-btn {
      text-indent: 0;
    }
  } */

/* reports css start */

.reports-div{
    padding-bottom: 20px;
}

.reports-div .report-search{
    padding: 0 24px 0 0 !important;
    border-top-left-radius: 30px;
    background: #F2F6FA;
}

.reports-div .blue-tabs .nav-tabs{
    background-position: right;
    border-top-left-radius: 30px;
    position: relative;
    background-image: url(../image/tab-bg-full.png);
}

.reports-div .btn-outline svg{
    margin-left: 38px;
}

.reports-div .search-div {
    padding: 7px 24px 19px;
}

.reports-div .search-div .btn-outline{
    padding: 11px 14px;
}

.reports-div .report-search .cus-dropdown{
    width: 45%;
}

.doubledate-input{
    display: flex;
    align-items: center;
    background-color: white;
    border: 1px solid #C2CCE2;
    border-radius: 3px;
    position: relative;
    background-image: url(../image/bx-calendar.png);
    background-repeat: no-repeat;
    background-position: top 10px right 10px;
    cursor: pointer;
    padding-right: 35px;
}

.doubledate-input input{
    border-color: transparent;
    width: 120px;
}

.doubledate-input input:focus{
    border-color: transparent;
}

.doubledate-input input::placeholder{
    color: #212427;
}

.reports-div .search-input .form-control{
    margin: 19px 0 0;
}

.reports-div table thead th:first-child{
    width: 75%;
}

.reports-head{
    display: flex;
    flex-wrap: wrap;
    /* align-items: center; */
}

.reports-head .course-drop{
    margin-bottom: 30px;
}

.reports-head .course-drop .btn{
    min-width: 570px;
}

.reports-head h2{
    color: #212427;
    font-weight: 600;
    font-size: 22px;
    line-height: 33px;
    margin-bottom: 30px;
    margin-right: 30px;
}

.reports-head .course-drop .lock-btn{
    position: absolute;
    top: 50%;
    transform: translateY(-50%);
    right: 23px;
    background: white;
    border: none;
}

.reports-head .course-drop .lock-btn:hover, .reports-head .course-drop .lock-btn:focus{
    border: none;
    box-shadow: none;
}

.reports-head .cus-dropdown .dropdown-item{
    position: relative;
}

.reports-head .course-drop .lock-item{
    color: #868C93;
}

.journey-card{
    background: #FFFFFF;
    box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.07);
}

.journey-card .card-sec{
    padding: 30px 30px 20px;
    border-bottom: 1px solid #E9EEF8;
}

.journey-card .card-sec h5{
    color: #212427;
    font-weight: 600;
    font-size: 16px;
    line-height: 24px;
    margin-right: 10px;
    margin-bottom: 20px;
}

.journey-card .card-sec h6{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 20px;
}

.journey-card .card-sec .journey-name{
    display: flex;
    align-items: center;
    flex-wrap: wrap;
}

.journey-card .card-sec .journey-name p{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    padding: 17px 20px;
    margin-right: 10px;
    background: #FFFFFF;
    border: 1px solid #C2CCE2;
    border-radius: 10px;
    margin-bottom: 10px;
}

.journey-card .card-sec .journey-name p.active{
    background: rgba(33, 175, 255, 0.1);
    border: 2px solid #00A3FF;
}

.journey-card .journey-card-data{
    padding: 30px;
    min-height: 450px;
    display: flex;
    align-items: center;
    justify-content: center;
}

.journey-card .journey-card-data .no-journey{
    height: 100%;
    padding: 20px;
    text-align: center;
}

.journey-card .journey-card-data .no-journey p{
    color: #868C93;
    font-weight: 500;
    font-size: 14px;
    line-height: 21px;
    margin-top: 23px;
    margin-bottom: 0;
}

.journey-card-data .journey-graph{
    width: 100%;
}

.journey-card-data .journey-graph h6{
    color: #212427;
    font-weight: 600;
    font-size: 15px;
    line-height: 22px;
    margin-bottom: 10px;
}

.journey-card-data .journey-graph .btn{
    margin-bottom: 10px;
}

.journey-card-data .graph-img{
    text-align: center;
    margin-top: 20px;
}

.journey-card-data .graph-img img{
    width: 100%;
    max-width: 1000px;
}

.search-div h3{
    font-weight: 600;
    font-size: 17px;
    line-height: 26px;
    color: #212427;
    margin-bottom: 0px;
}

.assessment-table tr td, .assessment-table tr th{
    text-align: right;
}

/* reports css end */

/* request center css start */

.round-tabs.request-center .nav-tabs .nav-link{
    min-width: 140px;
}

.request-center .status-drop .cus-dropdown .btn{
    min-width: 220px;
}

.round-tabs.request-center .nav-link.disable-link{
    background: #DBE3EB;
    /* pointer-events: none; */
}

/* request center css end */

/* settings css start */
.settings-card{
    background: #FFFFFF;
    padding: 26px;
    margin-bottom: 14px;
    display: flex;
    flex-direction: column;
    justify-content: space-between;
}

.mh-95{
    min-height: 95%;
}

.settings-card h5{
    color: #212427;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    margin-bottom: 11px;
}

.settings-card h5 span{
    color: #EA472A;
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin-right: 10px;
}

.settings-card p{
    color: #A4AFB9;
    font-weight: 400;
    font-size: 13px;
    line-height: 21px;
    margin-bottom: 25px;
}

.settings-card .card-primary-btn{
    padding: 10px 37px;
    margin-top: 25px;
    margin-bottom: 0px;
    text-decoration: none;
    border: none;
    background: #EBF3F8;
    color: #212427 !important;
}

.settings-card .accordion-item{
    border-radius: 0px;
    border: none;
}

.settings-card .accordion-header .accordion-button{
    background: white;
    color: #212427;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
    justify-content: start;
}

.settings-card .accordion-button:not(.collapsed){
    box-shadow: none;
}

.settings-card .accordion-header .accordion-button:focus{
    box-shadow: none;
}

.settings-card .accordion-header .accordion-button::after{
    margin-left: 25px;
}

.settings-card .accordion-collapse{
    border-top: 1px solid #E9EEF8;
}

.settings-card .cat-label{
    background: #EBF3F8;
    border-radius: 3px;
    padding: 7px 19px;
    margin-bottom: 8px;
    display: flex;
    align-items: center;
    justify-content: space-between;
}

.settings-card .cat-label p{
    color: #212427;
    font-weight: 400;
    font-size: 13px;
    line-height: 30px;
    margin-bottom: 0;
}

.settings-card .cat-label .view-all .dropdown-menu{
    padding: 11px 25px 11px 25px;
}

.settings-card .accordion-button:not(.collapsed)::after{
    background-image: var(--bs-accordion-btn-icon);
}

.settings-card .logo-img{
    min-width: 150px;
}

.company-name{
    color: #212427 !important;
    font-weight: 400 !important;
    font-size: 14px !important;
    line-height: 21px !important;
    margin-bottom: 0px !important;
    margin-left: 20px;
}

.status-update-btn{
    position: relative;
}

.status-update-btn span{
    position: absolute;
    color: #A4AFB9;
    font-weight: 400;
    font-size: 8px;
    top: 2px;
}

.status-update-btn.active span{
    color: #fff;
}
/* settings css end */


/* transactions css start */

.inner-shadow-content{
    background: #F8FAFC;
box-shadow: 0px 0px 11px rgba(0, 0, 0, 0.07);
}

.settings-card h6{
    color: #212427;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 15px;
}

.settings-card label{
    color: #212427;
    font-weight: 500;
    font-size: 18px;
    line-height: 27px;
}
/* transactions css end */


/* demo css start */
.demo-card{
    background: #FFFFFF;
    /* box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.06); */
    padding: 21px;
    margin-bottom: 10px;
}

.demo-card h5{
    color: #212427;
    font-weight: 400;
    font-size: 16px;
    line-height: 24px;
    margin-bottom: 6px;
}

.demo-card h6{
    color: #868C93;
    font-weight: 400;
    font-size: 14px;
    line-height: 21px;
    margin-bottom: 5px;
}

.video-div{
    background: #FFFFFF;
    border: 1px solid #DFE6EC;
    border-radius: 5px;
    padding: 18px 20px;
}
/* demo css end */

.reqcenter-table{
    border-spacing: 0;
    border: 0;
}

.reqcenter-table thead tr th{
    border-bottom: 6px solid #f2f6fa;
}

.reqcenter-table tbody tr:nth-child(even){
    box-shadow: none !important;
}

.reqcenter-table tbody tr:nth-child(even) td{
    border-bottom: 6px solid #f2f6fa;
    padding-top: 0;
}

/* user feedback form css  */

.user-feedback{
    padding-top: 0px !important;
}
.formTitle{
    text-align: center;
}
#title-form{
    color: #212427;
text-align: center;
font-family: Poppins;
font-size: 20px;
font-style: normal;
font-weight: 600;
line-height: 29px; /* 145% */
margin-bottom: 20px;
margin-top: 30px;
}
/* classroom css start */
.classSeries{
    color: #5E6A76;
    font-weight: 500;
    font-size: 13px;
    margin-left: 10px;
}
.classSeries svg{
    margin-left: 3px;
}
.litType{
    color: #00A3FF;
    padding: 3px 10px;
    background: rgba(33, 175, 255, 0.10);
    border: 1px solid #A0DDFF;
    border-radius: 18px;
    font-size: 12px;
    font-weight: 500;
    margin-right:10px;
}
.deletedClass{
    color: #F0652E;
    font-weight: 500;
    font-size: 12px;
    padding: 3px 10px;
    background: rgba(240, 101, 46, 0.15);
    border: 1px solid #F0652E;
    border-radius: 18px;
    margin-left: 3px;
}
.deletedMeeting{
    background: #EAF2F5 !important;
    color: #5E6A76 !important;
}
.deletedMeeting h5{
    
    color: #5E6A76 !important;
    font-weight: 600 !important;
    text-decoration: line-through;
}
.deletedMeeting .litType{
    color: #5E6A76;
    background: rgba(94, 106, 118, 0.10);
    border: 1px solid #5E6A76;
}
.deletedLitMeeting{
    background: #D6DEE2 !important;
    color: #5E6A76 !important;
}
.deletedLitMeeting h5{
    
    color: #5E6A76 !important;
    text-decoration: line-through;
}
.deletedLitMeeting .litType{
    color: #5E6A76;
    background: rgba(94, 106, 118, 0.10);
    border: 1px solid #5E6A76;
}
.deletedLitMeeting .deletedClass{
    margin-left: 10px;
}
.deletedLitMeeting .lineStrike{
    text-decoration: line-through;
}
.litTag{
    margin-right: 0px;
}
.deletedClassroom .classroomTitle{
    color: #5E6A76 !important;
    text-decoration: line-through;
    display: inline-block;
}
.deletedClassroom .litTag {
    color: #5E6A76;
    background: rgba(94, 106, 118, 0.10);
    border: 1px solid #5E6A76;
}
.deletedClassroom .classDetails {
    color: #5E6A76 !important;
    text-decoration: line-through;
}



@media(min-width:1200px){
   .w-lg-50{
    width: 50% !important;
   }
}


@media (max-width:1492px) {
    .upload-assessment{
        width: 100%;
    }
}

@media (max-width:1400px) {

}
@media (max-width:1200px) {
    .step-wizard .livetraining-back-btn{
        margin-bottom: 20px;
    }
    .curriculam-panel .step-card {
        padding: 20px 15px 70px 15px !important;
    }
}

@media (max-width:1146px) {

    /* dashboard css start */
    .border-right{
        display: none;
    }
    /* dashboard css end */
}

@media(max-width:992px){
    /* placeholder > group > category css start */
   .user-course-div .blue-tabs .nav-tabs .nav-link{
        padding: 24px 10px;
        font-size: 15px;
    }

    .assign-modal-dropdown .search-input{
        min-width: unset;
        margin-right: 0;
    }
    /* placeholder > group > category css end */

    /* create course css start */
    .step-wizard{
        padding: 30px 40px;
    }

    .curriculam-panel .file-upload-div .upload-btn{
        position: unset;
        transform: unset;
        margin-top: 10px;
        justify-content: end;
        flex-wrap: wrap;
    }

    .curriculam-panel .file-upload-div .upload-btn .card-primary-btn{
        margin-bottom: 10px;
    }

    .section-card .sec-inner-card .inner-card-btn{
        display: flex;
        flex-direction: column;
    }
    /* create course css end */

    /* reports css start */
    .reports-head .course-drop .btn{
        min-width: unset;
    }

    .reports-head .course-drop .dropdown-item{
        line-height: 22px;
        white-space: unset;
        margin-bottom: 8px;
    }
     /* reports css end */

    /* request center css start */
    .round-tabs.request-center .nav-tabs .nav-link{
        min-width: unset;
    }
    /* request center css end */
}

@media(max-width:767px){
    
    /* header css start */

    .header-logo{
        width: 80px;
        padding: 6px 19px;
    }

    .header-content{
        width: calc(100% - 80px);
        padding: 0 10px;
    }

    /* header css end */

    /* sidebar css start */

    .overlay {
        display: none;
        position: fixed;
        /* full screen */
        width: 100vw;
        height: 100vh;
        /* transparent black */
        background: rgba(0, 0, 0, 0.7);
        /* middle layer, i.e. appears below the sidebar */
        z-index: 998;
        opacity: 0;
        /* animate the transition */
        transition: all 0.5s ease-in-out;
        top: 0;
    }
    /* display .overlay when it has the .active class */
    .overlay.active {
        display: block;
        opacity: 1;
    }

    #sidebar {
        position: fixed;
        top: 50px;
        left: -276px;
        height: 100vh;
        z-index: 1024;
        color: #fff;
        transition: all 0.3s;
        overflow-y: scroll;
        box-shadow: 3px 3px 3px rgb(0 0 0 / 20%);
    }

    #sidebar .secondary-cus-btn{
        margin-bottom: 50px;
        margin-top: 80px;
    }

    #sidebar.active {
        left: 0;
    }

    #sidebarCollapse{
        display: block;
    }

    /* sidebar css end */

    /* dashboard css start */

    .main-section{
        margin-left: 0;
    }

    /* dashboard css end */


    .step-wizard{
        padding: 30px 20px;
    }

    .step-wizard-navigation{
        padding: 10px 20px;
    }

    .full-header .header-content{
        padding: 0 20px;
    }

    /* create course css start */
    .section-card .accordion-body{
        padding: 30px 10px 20px 10px;
    }

    .card-primary-btn{
        min-width: unset;
        padding: 8px 30px;
    }

    .step-wizard .multistep-panel .step-card{
        padding: 20px 15px;
    }
    /* create course css end */

    /* create journey css start */
    .journey-data .journey-card .blue-btn{
        margin-left: 0;
    }
    /* create journey css end */

    .reports-div .report-search .col-xxl-8{
        padding: 0 0 0 24px !important;
    }

}

@media (max-width:600px) {

    /* login and welcome page css start */

    .login .login-form{
        min-width: calc(100vw - 40px);
    }
    .login .login-form .logo{
        margin-top: 60px;
    }

    /* login and welcome page css end */

    /* craete course css start */
    .section-card .accordion-button span{
        margin-left: 7px;
        padding-left: 7px;
    }
    /* craete course css end */
}

@media(max-width:576px){
    
    /* login and welcome page css start */
    .login{
        padding: 15px;
    }
    .login .login-form{
        min-height: unset;
        padding: 20px 25px;
    }
    .login .login-form .mode{
        margin-bottom: 50px;
    }
    .login .login-form .mode{
        flex-direction: column;
        justify-content: center;
        align-items: center;
    }
    /* login and welcome page css end */
  
    /* dashboard css start */

    .main-section{
        padding: 20px;
    }

    /* dashboard css end */

    /* common css start */
    
    .primary-cus-btn{
        min-width: unset;
    }

    /* common css end */

    /* placeholder > group > category css start */

     .round-tabs .nav-tabs .nav-link{
        padding: 12px 11px;
        min-width: unset;
     }

    .blue-tabs .nav-tabs .nav-link{
        padding: 24px 6px !important;
        font-size: 14px;
    }

    .user-course-div{
        padding-left: 2px !important;
    }
    /* placeholder > group > category css end */

    /* create course css start */
    .step-wizard .back-btn{
        margin-bottom: 20px;
    }
    /* create course css end */

    .step-card .upload-assessment .card-primary-btn{
        min-width: unset;
        width: 100%;
    }

    .max-char-input-div .max-char-text{
        position: unset;
        transform: unset;
    }

    .request-center .status-drop .cus-dropdown .btn{
        min-width: 140px;
    }
}
@media(max-width:425px){

    /* header css start */
    .header-logo {
        width: 60px;
        padding: 6px 9px;
    }
    .header-content {
        width: calc(100% - 60px);
    }
    .header-content h4{
        display: none;
    }

    /* header css end */

    /* dashboard css start */

    .main-section{
        padding: 15px;
    }

    .licence-card .card-text p{
        font-size: 10px;
    }

    /* dashboard css end */

    /* common css start */

    .dropdown-big {
        width: 248px;
        min-width: unset;
    }

    /* common css end */

    .required-text{
        right: 50px;
    }
}

.logo-circle {
    border-radius: 50%;
    width: 60px; /* adjust size */
    height: 60px; /* must match width for perfect circle */
    object-fit: cover; /* prevents image distortion */
    display: block;
}

.logo-rectangle {
    border-radius: 8px; /* optional: slight rounded corners */
    width: auto; /* or fixed width like 120px */
    height: 40px; /* adjust proportion */
    object-fit: contain; /* keeps aspect ratio */
    display: block;
}