@import url('https://fonts.googleapis.com/css2?family=Jost:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&display=swap');

/* Define an array of predefined colors */
:root {
   --colors: #FFEACB, #C0E4FE, #BBF7D5, #FFD9D8, #FFDC98, #D9D0EA, #cddc39a1, #3ec4783b, #D3D3D3, #e6e6fa, #f08080ba, #ffa07ad4, #e6a8d7, #AFE4DE, #F0E68C; /* Add more colors as needed */
 }
.content-wrapper,
body.hold-transition.login-page {
   background-color: #FBFAF3;
}

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

.worksheets a.btn {
   margin: 15px;
   padding: 5px 6px 2px;
   border-radius: 2px;
}

.worksheets i.fas.fa-file-pdf {
   font-size: 40px;
}

.resources a.btn {
   margin-bottom: 14px;
}

.selfnotes .info-box-content {
   line-height: 1.5;
}

span.wstitle {
   display: block;
   font-size: 9px;
}

.worksheets {
   text-align: center;
}

.card.card-widget.widget-user .card-footer {
   padding: 0;
}

.card.card-widget.widget-user .card-footer p {
   margin-bottom: 3px;
}

.widget-user-header.bg-info {
   height: auto;
}

.widget-user .widget-user-header {
   height: 235px;
}

.stepwizard-step p {
   margin-top: 10px;
}

.stepwizard-row {
   display: table-row;
}

.stepwizard {
   display: table;
   width: 100%;
   position: relative;
}

.stepwizard-step button[disabled] {
   opacity: 1 !important;
   filter: alpha(opacity=100) !important;
}

.stepwizard-row:before {
   top: 14px;
   bottom: 0;
   position: absolute;
   content: " ";
   width: 100%;
   height: 1px;
   background-color: #ccc;
   z-order: 0;
}

.stepwizard-step {
   display: table-cell;
   text-align: center;
   position: relative;
}

.btn-circle {
   width: 30px;
   height: 30px;
   text-align: center;
   padding: 6px 0;
   font-size: 12px;
   line-height: 1.428571429;
   border-radius: 15px;
}

.btn-primary.btn-default {
   color: #fff;
   background-color: #007bff;
   border-color: #007bff;
   box-shadow: none;
}

.form-group .form-row.form-row-1 {
   width: 50%;
   padding: 0 15px;
}

.form-group .form-row.form-row-2 {
   width: 26.5%;
   padding: 0 15px;
}

.form-group .form-row.form-row-3 {
   width: 40.5%;
   padding: 0 15px;
}

.form-group .form-row.form-row-4 {
   width: 36%;
   padding: 0 15px;
}

.iti {
   display: block;
}

.profile-info {
   position: relative;
   color: #c2c7d0;
}

.profile-info span {
   position: absolute;
   right: 0;
   top: 5px;
}

.cursor-pointer {
   cursor: pointer;
}

.pdf_box {
   width: 90%;
   margin: 0 auto;
   padding: 14px;
   background: #fff;
   border-radius: 12px;
   overflow: hidden;
}

.pdf_box iframe {
   height: 300px;
}

.pdfdown_button a {
   margin: 16px auto 0;
   display: table;
   color: #4f4f4f;
   border: 2px solid #d8c8c2;
   padding: 5px 40px;
   border-radius: 60px;
}

.btn-warning {
   color: #fff;
   background-color: #ffa656;
   border-color: #ffa656;
}

.btn-warning:hover,
.btn-warning:focus,
.btn-warning:active,
.btn-warning:not(:disabled):not(.disabled):active {
   background-color: #e4812b;
   border-color: #e4812b;
   color: #fff;
}

.action-btns {
   display: flex;
   align-items: center;
   gap: 10px;
   flex-wrap: wrap;
}

/***********Login css***************/

section.Login_Page {
   height: 100vh;
   display: flex;
   align-items: center;
}

.LoginMain {
   max-width: 450px;
   width: 100%;
   padding: 60px 50px;
   border-radius: 25px;
   backdrop-filter: blur(60px);
}

.LoginLogo img {
   margin: auto;
   display: block;
}

.LoginForm h3 {
   font-size: 50px;
   font-weight: bold;
   text-align: center;
   font-family: 'Jost', sans-serif;
   margin: 20px 0px 30px 0px;
}

.InputDesign label {
   font-size: 16px;
   color: #444444;
   font-weight: 400 !important;
   font-family: 'Jost', sans-serif;
}

.InputDesign input {
   border-top-left-radius: 10px;
   border-bottom-left-radius: 10px;
   height: 50px;
   border: none;
   padding-left: 20px;
   font-family: 'Jost', sans-serif;
   background: rgb(255 255 255 / 70%);
}

.InputDesign .input-group-text {
   background: #fff;
   border: none;
   border-top-right-radius: 10px;
   border-bottom-right-radius: 10px;
   background: rgb(255 255 255 / 70%);
}

.InputDesign .input-group {
   box-shadow: 0 5px 15px rgb(0 0 0 / 0);
   border-radius: 10px;
}

a.ForgotPass {
   font-size: 14px;
   color: #00A0E3;
   font-family: 'Jost', sans-serif;
   font-weight: 500;
}

.ThemeBtn:hover {
   background: #f0801b;
}

.ThemeBtn {
   padding: 15px 60px;
   font-size: 16px;
   border-radius: 10px;
   font-weight: 500;
   background: #00A0E3;
   border: none;
   box-shadow: 0 5px 15px rgb(0 0 0 / 20%);
   font-family: 'Jost', sans-serif;
}

.StyleModal {
   border-radius: 10px;
   box-shadow: 0px 5px 10px rgb(0 0 0 / 20%);
}

.StyleModal p {
   font-size: 13px;
   display: flex;
   align-items: center;
   gap: 10px;
}

.StyleModal ul {
   padding-left: 18px;
   font-size: 14px;
}

.text-lead {
   font-family: 'Jost', sans-serif;
}

/****************Sidebar css**********************/

.NewVersionSidebar {
   background: rgb(78, 203, 255);
   background: linear-gradient(180deg, rgba(78, 203, 255, 1) 0%, rgba(255, 249, 165, 1) 100%);
}
.orange-sidebar {
   background: #EF7429 !important;
   height: 100%;
}
.orange-sidebar .nav-pills .nav-link {
   color: #fff !important;
}
.orange-sidebar span.brand-text{
   color: #fff !important;
}
.orange-sidebar .user-type-name{
   color: #fff !important;
}
span.brand-text {
   font-size: 16px;
   color: #111111;
   font-weight: 500 !important;
   font-family: 'Jost', sans-serif;
}

.brand-link {
   padding: 20px 0.5rem !important;
}

.os-content {
   padding: 0 !important;
}

.NewVersionUpdateMenus .active {
   border-top-left-radius: 0;
   border-bottom-left-radius: 0;
   border-bottom-right-radius: 10px;
   border-top-right-radius: 10px;
   background: #FFA656 !important;
   color: #fff !important;
}

.NewVersionUpdateMenus .nav-pills .nav-link {
   color: #111;
   padding-top: 10px;
   padding-bottom: 10px;
}

.NewVersionUpdateMenus .nav-pills .nav-link p {
   white-space: nowrap;
}

.NewVersionUpdateMenus .nav-pills .nav-link:not(.active):hover {
   color: #111;
   opacity: 0.5;
}

.NewVershionHeader {
   background: #FBFAF3;
   border: none;
   padding: 15px 20px;
}

@media (max-width: 767.98px) {
   .NewVershionHeader {
      position: fixed;
      width: 100%;
      top: 0;
      left: 0;
      box-shadow: 0 3px 10px rgb(0 0 0 / 10%);
  }
}

.NewVersionRightNav .nav-link {
   background: #fff;
   border-radius: 100%;
   width: 36px;
   height: 36px;
   padding: 0;
   display: flex;
   justify-content: center;
   align-items: center;
   color: #241D42;
   box-shadow: 0px 3px 10px rgb(0 0 0 / 20%);
   padding: 0 !important;
   border: 2px solid #fff;
}

.NewVersionRightNav {
   gap: 20px;
   align-items: center;
}

.Counter {
   position: absolute;
   top: -5px;
   right: -5px;
   width: 16px;
   height: 16px;
   font-size: 10px;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 100%;
   background: #E50000;
   color: #fff;
}

.UserDetails h3 {
   font-size: 24px;
   color: #241D42;
   margin: 0;
}

.UserDetails p {
   color: #6A6A6A;
   font-size: 16px;
}

.content-wrapper {
   padding: 0px 20px 20px;
}

@media (max-width: 767.98px) {
   .content-wrapper {
      padding: 15px;
      margin-top: 80px;
   }
}

.pageTitle {
   display: flex;
   align-items: center;
   justify-content: space-between;
   flex-wrap: wrap;
   margin: 0 0 15px;
   padding: 15px;
   border-radius: 10px;
   box-shadow: 0 5px 15px rgb(0 0 0 / 12%);
   background: #9fe4ff;
}

.pageTitle .breadcrumb {
   margin: 0;
   padding: 0;
   background: transparent;
}

.pageTitle h2 {
   margin: 0;
   font-size: 22px;
}

li.nav-item.dropdown .nav-link {
   border-color: #9FE4FF;
   width: 50px;
   height: 50px;
}

.InnerBox {
   background: #fff;
   padding: 0;
   border-radius: 15px;
   box-shadow: 0px 3px 6px #00000029;
}

.IconCounter {
   display: flex;
   flex-wrap: wrap;
   justify-content: space-between;
   align-items: center;
   padding-right: 20px;
   height: 100%;
}
.fs-50 {
   font-size: 38px;
   color: #fff;
}
.IconRaps {
   width: 100px;
   height: 100px;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 15px 0 0 15px;
   background: #9FE4FF;
   box-shadow: none;
}
.blue-bg{
   background-color: #1894D1;
}
.orange-bg{
   background-color: #EF7429;
}
.yellow-bg{
   background-color: #EFE634;
}
.GreenBox {
   background: #BBF7D5;
}

.GreenBox .IconRaps {
   background: #51EE95;
}

.PinkBox {
   background: #FFD9D8;
}

.PinkBox .IconRaps {
   background: #FF9F9C;
}

.BoxTitle p {
   font-size: 18px;
}

.stud-dash-cnt-box{
   font-size: 24px !important;
}

.BoxTitle {
   margin-top: 0px;
   margin-right: auto;
   margin-left: 7px;
}

.CounterRaps span {
   font-size: 28px;
   font-weight: 600;
}

.card {
   background: #fff;
   border-radius: 15px;
   box-shadow: 0px 5px 15px rgb(0 0 0 / 10%);
}

.card:last-child {
   margin-bottom: 0;
}

.card-header {
   padding: 10px 15px !important;
   border-color: #EEEEEE;
   display: flex;
   align-items: center;
   flex-wrap: wrap;
   gap: 15px;
   justify-content: space-between;
   border-top-right-radius: 15px;
   border-top-left-radius: 15px;
}

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

.card-header h3 {
   font-size: 16px;
   font-weight: 400;
   text-transform: capitalize;
}

.card-header::after {
   display: none;
}

.card-header i {
   color: #241D42;
}

ul.comments_list {
   margin: 0;
   padding: 0;
   list-style: none;
   max-height: 400px;
}

ul.comments_list li {
   padding: 10px 0px;
   border-bottom: 1px solid #eee;
   font-size: 16px;
}

.main-footer {
   background-color: #fbfaf3;
   border-top: none;
   color: #241D42;
   padding: 1rem 25px;
   font-size: 13px;
   font-weight: 400;
}

.modal-content {
   border-radius: 15px;
}

.InnerContentCard {
   background: #fff;
   box-shadow: 0px 10px 15px rgb(0 0 0 / 5%);
   height: 230px;
   margin-bottom: 15px;
}

.ThemeBtnContent {
   border-radius: 30px;
   padding: 3px 15px;
}

.InnerContentCard p {
   overflow: hidden;
   text-overflow: ellipsis;
   -webkit-line-clamp: 2;
   display: -webkit-box;
   -webkit-box-orient: vertical;
}

.ContentBody:after {
   display: none;
}

.ContentBody {
   display: flex;
   flex-direction: column;
   justify-content: space-between;
   width: 100%;
   height: 100% !important;
   min-height: 100% !important;
   max-height: 100%;
   padding: 15px;
}

/* Apply random color from the predefined set to each child element */
.CustomBody .InnerContentCard {
   background: var(--random-color);
 }

.IConHere {
   height: 50px;
   width: 50px;
   position: relative;
}

.trainer-level-image {  
   width: 100%;
   object-fit: cover;
   object-position: top;
   height: 200px;
}

.ContentBody .card-title {
   font-weight: 500 !important;
   font-size: 18px;
}
/* 
.CustomBody .row .col-md-4 .InnerContentCard .IConHere .level_icon:after {   
   height: 50px;
   width: 50px;
   content: '';
   position: absolute;
   top: 0;
   z-index: 999;
   background-position: center;
   background-size: contain;
   background-repeat: no-repeat;
} */



.LoadMore .ContentBody {
   background: #E2DFB3;
   justify-content: center;
   align-items: center;
   gap: 10px;
   text-align: center;
}

.LoadMore .ContentBody p {
   margin: 0;
}

.btn-primary {
   background: #51ccfd;
   border-color: #51ccfd;
   font-weight: 500;
}

.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active {
   color: #fff;
   background-color: #00b5ff;
   border-color: #00b5ff;
}

a.open_chat span {
   width: 35px;
   height: 35px;
   display: flex;
   justify-content: center;
   align-items: center;
}

.CustomBtn {
   background: #ffa656;
   border-color: #ffa656;
   border-radius: 30px;
   padding: 4px 15px;
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   color: #fff;
}

.CustomBtn i {
   color: #fff;
}

.CustomBtn:hover {
   color: #fff;
}

.table td,
.table th {
   vertical-align: middle !important;
}

.pdfopen a {
   width: 35px;
   height: 35px;
   display: flex;
   justify-content: center;
   align-items: center;
}

.AlignAction {
   display: flex;
   align-items: center;
   justify-content: space-between;
   gap: 15px;
}

.custominfo {
   border-radius: 30px;
   padding: 6px 20px;
   background: #ffa656;
   border: none;
   color: #000;
   font-weight: 500;
}

.BtnMores {
   display: flex;
   margin-bottom: 20px;
   gap: 10px;
}

.page-item.active .page-link {
   background-color: #FFA656 !important;
   border-color: #FFA656 !important;
}

.InnerBeginner {
   padding: 10px;
   border: 2px solid;
   border-radius: 15px;
   min-height: 200px;
   display: flex;
   justify-content: space-between;
   flex-direction: column;
   background: #f4f5f7;
   border-color: #acadaf;
}

.InnerBeginner .TickIcon i {
   color: #acadaf;
}

.InnerBeginner .progress-bar {
   background: #acadaf;
}

.InnerBeginner p {
   color: #acadaf;
}

.TickIcon {
   text-align: right;
}

.progress {
   border-radius: 10px;
   height: 5px;
}

.progress-bar {
   border-radius: 10px;
}

.GreenBoxContent .intortext p {
   font-weight: 500;
   color: #111;
}

.GreenBoxContent {
   background: #e8f4ea;
   border-color: #278556;
}

.GreenBoxContent .TickIcon i {
   color: #278556;
}

.GreenBoxContent .progress-bar {
   background: #278556;
}


.PinkBoxContent {
   background: #fde1ed;
   border-color: #be407f;
}

.PinkBoxContent .TickIcon i {
   color: #be407f;
}

.PinkBoxContent .progress-bar {
   background: #be407f;
}




.InnerBeginner .TickIcon i {
   font-size: 18px;
}

.UserClick {
   display: flex;
   align-items: center;
   gap: 10px;
}

.UserClick a {
   display: flex;
   width: 30px;
   height: 30px;
   justify-content: center;
   align-items: center;
   background: #6c757d;
   border-radius: 100%;
   font-size: 13px;
   color: #fff;
}

a.DownloadBTn {
   background: #53ccfd;
}

a.ViewBtn {
   background: #fd7e14;
}

.videoInfo span {
   width: calc(100% - 100px);
   display: block;
   font-size: 14px;
}
.videoInfo .btn-group a i {
   font-size: 12px;
}
.worksheetInfo span {
   width: calc(100% - 100px);
   display: block;
   font-size: 14px;
}
.worksheetInfo .btn-group a i {
   font-size: 12px;
}

.AssignmentTabs .nav-item {
   background: #55ccfb;
   border-radius: 30px;
   color: #000;
   font-weight: 500;
}

.AssignmentTabs .nav {
   gap: 10px;
   margin-bottom: 20px;
   border: none;
}

.AssignmentTabs .nav-link.active {
   background: #FFA656 !important;
   color: #fff;
}

.ContentSetting {
   color: #111;
   font-weight: 400;
   line-height: 24px;
}

.innerForms {
   background: #BBF7D5;
   border-radius: 15px;
   box-shadow: 0px 5px 15px rgb(0 0 0 / 10%);
}

button#open-button {
   border-radius: 30px;
   background: #fd7e14;
}

.dottedBox {
   display: flex;
   justify-content: center;
   align-items: center;
   flex-direction: column;
   gap: 15px;
   width: 100%;
   border: 2px dashed #111;
   padding: 30px;
   text-align: center;
   border-radius: 15px;
   margin: 0;
}

.dottedBox label {
   margin: 0;
}

.dottedBox input {
   border-radius: 10px;
   height: 50px;
   border: 0;
}

.fileuploadDesign input {
   text-align: center;
   display: flex;
   justify-content: center;
   align-items: center;
   padding: 10px;
   background: #fff;
   border-radius: 10px;
}

.PDFViewer iframe {
   padding: 15px;
   border-radius: 10px;
   background: #d3d27e;
}

.maincontent {
   /* padding: 15px 0;
   margin-bottom: 0px;
   border-radius: 15px;
   position: relative;
   overflow: hidden; */
}

/* .maincontent:after {
   position: absolute;
   content: '';
   width: 80%;
   height: 100%;
   right: 0;
   top: 0;
   background: linear-gradient(291deg, rgb(114 211 251) 0%, rgb(249 240 128) 100%);
   border-radius: 15px;
} */

.maincontent .row {
   position: relative;
   z-index: 1;
}

.projectGid {
   display: flex;
   flex-wrap: wrap;
   gap: 20px;
}

.projectBox {
   padding: 20px;
   background: #fbfaf3;
   border-radius: 10px;
   box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
   border: 1px solid #eee;
   width: calc(33% - 15px);
   display: flex;
   flex-direction: column;
   gap: 15px;
}

.projectBox .projectHead {
   display: flex;
   align-items: flex-start;
   gap: 15px;
   justify-content: space-between;
}

.projectBox .projectHead h2 {
   font-size: 22px;
   overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
   margin: 0;
   height: 54px;
}

.projectBox .projectFooter {
   display: flex;
   align-items: center;
   justify-content: space-between;
   margin-top: auto;
}

.projectBox .description {
   overflow: hidden;
   display: -webkit-box;
   -webkit-line-clamp: 2;
   -webkit-box-orient: vertical;
}

/* Beginner Tab */

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {
   color: #fff;
   background-color: #55ccfb;
   border-color: #55ccfb;
}

.nav-pills .nav-link:not(.active):hover {
   color: #55ccfb;
}

.BeginnerTab {
   gap: 15px;
   padding-bottom: 15px;
   margin-bottom: 15px;
   border-bottom: 1px solid #eee;
}

.BeginnerTab button {
   padding: 5px 15px;
   border-radius: 30px !important;
   background: #f5f5f5;
   border: 1px solid #eee;
   min-height: auto;
}

.beginner-cardList {
   display: flex;
   flex-wrap: wrap;
   gap: 16px;
   margin: 0;
   padding: 0;
   list-style-type: none;
}

.beginner-cardList li {
   display: flex;
   flex-direction: column;
   gap: 15px;
   padding: 15px;
   background: #f5f5f5;
   border: 1px solid #eee;
   border-radius: 10px;
   width: calc(50% - 8px);
}

@media (max-width: 767.98px) {
   .beginner-cardList li {
      width: 100%;
   }
}

.beginner-cardList li:nth-child(1) {
   background: #FFEACB;
}

.beginner-cardList li:nth-child(1) .btn,
.beginner-cardList li:nth-child(1) .btn i {
   color: #ffa656;
}

.beginner-cardList li:nth-child(2) {
   background: #C0E4FE;
}

.beginner-cardList li:nth-child(2) .btn,
.beginner-cardList li:nth-child(2) .btn i {
   color: #00A0E3;
}

.beginner-cardList li:nth-child(3) {
   background: #BBF7D5;
}

.beginner-cardList li:nth-child(3) .btn,
.beginner-cardList li:nth-child(3) .btn i {
   color: #3EC478;
}

.beginner-cardList li:nth-child(4) {
   background: #FFD9D8;
}

.beginner-cardList li:nth-child(4) .btn,
.beginner-cardList li:nth-child(4) .btn i {
   color: #FF726E;
}

.beginner-cardList li:nth-child(5) {
   background: #FFDC98;
}

.beginner-cardList li:nth-child(5) .btn,
.beginner-cardList li:nth-child(5) .btn i {
   color: #A86F00;
}

.beginner-cardList li:nth-child(6) {
   background: #D9D0EA;
}

.beginner-cardList li:nth-child(6) .btn,
.beginner-cardList li:nth-child(6) .btn i {
   color: #6939C4;
}

.beginner-cardList li:nth-child(7) {
   background: #E2DFB3;
}

.beginner-cardList li:nth-child(7) .btn,
.beginner-cardList li:nth-child(7) .btn i {
   color: #878353;
}

.beginner-cardList li .thumb-box {
   border-radius: 10px;
   overflow: hidden;
}

.beginner-cardList li .thumb-box img {
   aspect-ratio: 2/1;
   width: 100%;
   object-fit: cover;
}

.beginner-cardList li .detailsInfo {
   flex: 1;
   display: flex;
   flex-direction: column;
   
}
.stream-list-lock{
   position: relative;
   overflow: hidden;
}
.detailsInfo.stream-list-lock:after {
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   top: 0;
   background-color: rgba(0, 0, 0, 0.50);
   opacity: 1;
   /* font-family: 'PhpDebugbarFontAwesome'; */
   color: #eca761;
   text-align: center;
   display: flex;
   align-items: end;
   /* justify-content: center; */
   font-size: 20px;
   /* padding: 20px 15px; */
   background-image: url(../img/Lock.svg);
   background-repeat: no-repeat;
   background-position: calc(15px - 0px) calc(100% - 25px);
}
.projectHead span.prj-ninja-verified {
   color: green;
}
.new_design_three_col  li .detailsInfo .icons {
   height: 60px;
}

.beginner-cardList li .detailsInfo h2 {
   font-size: 18px;
   margin: 0 0 15px;
   line-height: normal;
   overflow: hidden;
   text-overflow: ellipsis;
   -webkit-line-clamp: 2;
   display: -webkit-box;
   -webkit-box-orient: vertical;
}

.beginner-cardList li .detailsInfo .btns-group {
   margin-top: auto;
}

.beginner-cardList li .detailsInfo .btns-group .iconBtn {
   width: 33px;
   min-width: 33px;
   height: 33px;
}

.beginner-cardList li .detailsInfo .btns-group .iconBtn i {
   font-size: 14px;
}

/* Beginner Tab end */

.ContentVideo video,
.ContentVideo iframe {
   height: 500px;
   object-fit: cover;
   border-radius: 10px;
   line-height: 0;
}

.description-texts p {
   line-height: normal !important;
   /* white-space: pre-wrap; */
}

.description-texts img {
   max-width: 100%;
   height: 320px;
   object-fit: cover;
}

/* toggle menu  */

.toggleBar {
   padding: 8px;
   display: flex;
   flex-direction: column;
   gap: 5px;
   justify-content: center;
   margin-right: 20px;
   width: 36px;
   height: 36px;
   background: #9fe4ff;
   border-radius: 3px;
   box-shadow: 0 3px 5px rgb(0 0 0 / 15%);
}

.toggleBar span {
   display: block;
   width: 100%;
   height: 2px;
   background: #000;
   border-radius: 20px;
   transition: all 0.3s ease-in-out;
}

.toggleBar span:last-child {
   width: 12px;
}

.toggleBar span:first-child {
   width: 18px;
}

.toggleBar:hover span {
   width: 100%;
}


.OverallGrade {
   display: flex;
   justify-content: center;
   gap: 20px;
   align-items: center;
   padding: 20px 0;
}

.GradeBox {
   display: flex;
   align-items: center;
   justify-content: center;
   padding: 25px;
   width: 130px;
   height: 140px;
   border-radius: 10px;
   box-shadow: 0 5px 15px rgb(0 0 0 / 10%);
}

.GradeBox img {
   width: 100%;
}

.GradeBox:first-child {
   background: #C0E4FE;
}

.GradeBox:last-child {
   background: #D9D0EA;
}

.GradeBox:nth-child(2) {
   background: #FFDC98;
   width: 170px;
   height: 180px;
}

.gradeInfo {
   display: flex;
   align-items: center;
   justify-content: center;
   gap: 10px;
   line-height: normal;
}

.gradeInfo i {
   color: #ffa656;
}

.btn {
   display: inline-flex;
   justify-content: center;
   align-items: center;
   gap: 8px;
   border-radius: 30px;
   box-shadow: 0 3px 10px rgb(0 0 0 / 5%);
   padding: 8px 20px;
   min-height: 40px;
   transition: all 0.3s ease-in-out;
   border: 0;
}

.btn i {
   color: #fff;
}

.btn-sm {
   padding: 5px 16px;
   line-height: normal;
   min-height: 32px;
   gap: 5px;
}

.btn-sm i {
   font-size: 17px;
}

.iconBtn {
   width: 36px;
   min-width: 36px;
   height: 36px;
   min-height: 36px;
   display: flex;
   align-items: center;
   justify-content: center;
   box-shadow: 0 2px 5px rgb(0 0 0 / 15%);
   padding: 0;
   border-radius: 100%;
}

.iconBtn i {
   font-size: 16px;
}

.iconBtn.btn-sm {
   width: 32px;
   min-width: 32px;
   height: 32px;
   min-height: 32px;
}

/* .btn-yallow {
   background: #feea01;
   color: #000;
   font-weight: 600;
}

.btn-yallow i {
   color: #000;
}

.btn-yallow:hover {
   background: #cfbe01;
} */


.data_more_less_inner {
   overflow: hidden;
   position: relative;
   margin-bottom: 20px;
}

.dec-text {
   margin: 0;
   line-height: normal;
   white-space: pre-line;
}

.iconStream {
   font-size: 16px !important;
}

.mw-150 {
   min-width: 150px;
}

.action_less {
   display: none;
}

.less_active .action_less {
   display: inline-block;
}

.less_active .action_more {
   display: none;
}

.data_more_less:not(.less_active):not(.action_disabled) .data_more_less_inner:after {
   content: '';
   display: block;
   position: absolute;
   bottom: 0;
   left: 0;
   width: 100%;
   height: 50px;
}

.data_more_less.action_disabled .more_less_action {
   display: none;
}

.btn-light {
   background-color: #fff;
   border-color: #fff;
   color: #000;
}

.btn-light i {
   color: #000;
}

.eventsList-container {
   display: flex;
   flex-direction: column;
   gap: 15px;
}

.eventsList {
   padding: 15px;
   border-radius: 10px;
   display: flex;
   align-items: center;
   gap: 20px;
   background: #fbfaf3;
   border: 1px solid #eee;
}

@media (max-width: 767.98px) {
   .eventsList {
      flex-wrap: wrap;
   }
}

.eventsList-thumbnail {
   width: 300px;
   min-width: 300px;
   height: 200px;
   line-height: 0;
   border-radius: 10px;
   overflow: hidden;
   box-shadow: 0 3px 10px rgb(0 0 0 / 20%);
}

.eventsList-thumbnail img {
   width: 100%;
   height: auto;
}

.eventsList-details {
   flex: 1;
}

.eventsList-details .titleInfo {
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.eventsList-details .titleInfo h2 {
   font-size: 24px;
   margin: 0;
}

.eventsList-details .bottomInfo {
   display: flex;
   align-items: flex-end;
   justify-content: space-between;
}

.eventsList-details .dateInfo {
   margin: 15px 0 0;
}

.eventsList-details .dateInfo p {
   margin: 0;
}

.iframeBox {
   line-height: 0;
}

.iframeBox iframe {
   border-radius: 10px;
}

.bg-light {
   background-color: #faf9f2 !important;
}

/* calendar css  */

.calendar-body {
   background: url('../img/calendar-back.jpg') center no-repeat;
   background-size: cover;
   background-blend-mode: overlay;
   position: relative;
   border-radius: 10px;
   overflow: hidden;
}

.calendar-body:after {
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   top: 0;
   left: 0;
   background: rgb(255 255 255 / 60%);
   backdrop-filter: blur(5px);
}

#calendar {
   position: relative;
   z-index: 1;
}

.fc-header-toolbar {
   background: #faf9f2;
   border-radius: 10px;
   box-shadow: 0 5px 10px rgb(0 0 0 / 8%);
   gap: 15px;
}

@media (max-width: 767.98px) {
   .fc .fc-view-harness {
      min-height: 340px !important;
   }
}

.fc-theme-standard .fc-scrollgrid {
   border: 0;
}

.fc-theme-standard td,
.fc-theme-standard th {
   border: 0;
}

.fc-col-header-cell .fc-col-header-cell-cushion {
   color: #ffa656;
}

.fc-daygrid-day {
   padding: 3px !important;
}

.fc .fc-daygrid-day.fc-day-today {
   background: transparent;
}

.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-frame {
   background-color: #FFA656;
}
.fc-liquid-hack .fc-daygrid-day-frame{
   position: relative;
}
.fc .fc-daygrid-day-frame {
   background: #fff;
   border-radius: 10px;
   overflow: hidden;
}

/* Make every cell a flex container that will grow */
.fc .fc-daygrid-day-frame {
  display: flex;
  flex-direction: column;
  height: 100%;
}

/* The background layer will flex to fill */
.fc .fc-daygrid-day-bg {
  flex: 1;
}

/* Ensure the outer grid has a fixed height */
.fc .fc-scrollgrid-sync-inner,
.fc .fc-scrollgrid {
  height: 100%;  /* now there’s a reference height */
}



.fc .fc-daygrid-day-bg .fc-non-business {
   border-radius: 10px;
   background: rgb(159 228 255 / 15%);
}

.fc .fc-daygrid-body-balanced .fc-daygrid-day-events {
   padding: 0 5px;
}

.fc .fc-daygrid-day-number {
   margin-left: auto;
   padding: 10px 10px 5px;
   font-size: 18px;
}

.fc .fc-daygrid-event {
   padding: 2px 30px 2px 10px;
   background: #51ccfd !important;
   border-color: #51ccfd !important;
   border-radius: 30px;
   position: relative;
}

.fc .fc-daygrid-event:after {
   content: '';
   position: absolute;
   top: 50%;
   right: 10px;
   font-family: 'Material Icons';
   transform: translateY(-50%);
   color: #fff;
   background: url(../../images/logo-icon.png) center no-repeat;
   background-size: contain;
   width: 24px;
   height: 24px;
}

.fc .fc-button-group>.fc-button {
   border-radius: 30px;
}

.fc .fc-button {
   font-size: 14px;
}

.fc-direction-ltr .fc-toolbar>*> :not(:first-child) {
   border-radius: 30px;
   padding-left: 20px;
   padding-right: 20px;
}

/* calendar css  */

.CertificationBanner:after {
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   background: #000;
   top: 0;
   left: 0;
   opacity: 0.3;
}

.CertificationBanner {
   background: url(../img/bnnr.jpg) bottom no-repeat;
   background-size: cover;
   height: 200px;
   border-radius: 10px;
   background-attachment: fixed;
   position: relative;
   overflow: hidden;
}

.Certification-box {
   position: relative;
   border-radius: 10px;
   overflow: hidden;
   line-height: 0;
   text-align: center;
}

.Certification-box:after {
   content: '';
   position: absolute;
   width: 100%;
   height: 100%;
   background: rgb(0 0 0 / 15%);
   top: 0;
   left: 0;
   backdrop-filter: blur(3px);
}

.trainer-certification-box:after {
   background: unset !important;
   backdrop-filter: unset !important;
}

.Certification-box img {
   width: 100%;
   aspect-ratio: 2/2;
   object-fit: cover;
}

.Certification-box .certification-badge {
   position: absolute;
   z-index: 2;
   aspect-ratio: unset;
   top: 50%;
   left: 50%;
   transform: translate(-50%, -50%);
   width: 80px;
   filter: drop-shadow(0px 3px 6px #00000052);
}

.Certification-box button {
   position: absolute;
   bottom: 15px;
   left: 50%;
   transform: translateX(-50%);
   min-width: 220px;
   z-index: 2;
   box-shadow: 0 4px 15px rgb(0 0 0 / 29%);
}

.project_example {
   border: 1px solid #ced4da;
   border-radius: 10px;
   padding: 15px;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   margin-top: 15px;
}

.project_example .form-control {
   width: auto;
   flex: 1;
   height: auto;
}

.project_example label {
   width: 100%;
}

.project_example .BtnMores {
   margin: 0 0 0 15px;
}

.note-toolbar {
   background: #ffa656;
   margin: -1px -1px 0 !important;
   justify-content: flex-start;
   gap: 5px 15px;
}

.note-toolbar .note-btn-group .note-btn {
   border-color: #00000032;
   font-size: 13px;
   padding: 0px 15px;
   box-shadow: 0 5px 10px rgb(0 0 0 / 20%);
   line-height: 28px;
}

.btns-group {
   display: flex;
   align-items: center;
   gap: 10px;
   flex-wrap: wrap;
}

.eventDetails-box {
   border: 1px solid #ddd;
   border-radius: 10px;
   padding: 15px;
   display: flex;
   gap: 40px;
   align-items: top;
}

@media (max-width: 767.98px) {
   .eventDetails-box {
      flex-wrap: wrap;
      gap: 0;
   }
}

.eventDetails-box .thumbImg {
   border-radius: 10px;
   overflow: hidden;
   line-height: 0;
   width: 50%;
   min-width: 50%;
   height: 330px;
}

@media (max-width: 767.98px) {
   .eventDetails-box .thumbImg {
      width: 100%;
      min-width: 100%;
      height: 250px;
   }
}

.eventDetails-box .thumbImg img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.eventDetails-box .statusInfo {
   display: inline-flex;
   align-items: center;
   padding: 5px 50px;
   gap: 10px;
   margin: 0 0 15px;
   background: linear-gradient(90deg, rgba(159, 228, 255, 0) 0%, rgba(159, 228, 255, 1) 25%, rgba(159, 228, 255, 1) 50%, rgba(159, 228, 255, 1) 75%, rgba(159, 228, 255, 0) 100%);
}

.eventDetails-box .statusInfo p {
   margin: 0;
}

.eventDetails-box .feeInfo {
   margin: 0 0 15px;
   display: flex;
   align-items: center;
   gap: 10px;
}

.eventDetails-box .feeInfo h5 {
   display: flex;
   align-items: center;
   margin: 0;
   font-size: 16px;
   gap: 10px;
}

.eventDetails-box .rewardInfo {
   text-align: justify;
   white-space: pre-line;
}

.eventDetails-box .rewardInfo h5 {
   margin: 0;
   font-size: 16px;   
}

.eventDetails-box .detailsBox {
   text-align: center;
   display: flex;
   flex-direction: column;
   align-items: center;
   padding: 30px;
}

@media (max-width: 767.98px) {
   .eventDetails-box .detailsBox {
      padding: 30px 15px 10px;
   }
}

/* school css */

.schoolStatus h2 {
   font-size: 20px;
   margin: 0;
}

.schoolStatus p {
   margin: 0;
}

.profileInfo-body {
   background: rgb(255 255 255 / 90%) url('../img/profile-back.jpg') center no-repeat;
   background-size: cover;
   background-blend-mode: overlay;
}

.profileInfo-container {
   display: flex;
   gap: 30px;
   align-items: center;
}

.profileInfo-container .profileThumb {
   width: 400px;
   min-width: 400px;
   border-radius: 10px;
   overflow: hidden;
   line-height: 0;
   height: 250px;
}

.profileInfo-container .profileThumb img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.profileInfo-container .profileDetails {
   display: flex;
   flex-wrap: wrap;
   gap: 15px 30px;
}

.profileInfo-container .profileDetails .profileStatus {
   width: calc(50% - 15px);
}

.profileInfo-container .profileDetails .profileStatus h2 {
   font-size: 18px;
}

.profileInfo-container .profileDetails .profileStatus span {
   display: inline-flex;
   font-size: 16px;
   align-items: baseline;
   gap: 5px;
   margin: 0 0 5px;
}

.profileInfo-container .profileDetails .profileStatus span:after {
   content: '';
   width: 20px;
   height: 1px;
   border: 1px dashed #6c757d;
}

.InnerForm .form-control {
   border-radius: 10px;
   overflow: hidden;
   border: 1px solid #dfdfdf;
   min-height: 42px;
   font-size: 14px;
}

.InnerForm select {
   border-radius: 10px;
   overflow: hidden;
   border: 1px solid #dfdfdf;
}

.customselect {
   border-radius: 10px;
   overflow: hidden;
   border: 1px solid #dfdfdf;
}

.InnerForm textarea {
   border-radius: 10px;
   overflow: hidden;
   border: 1px solid #dfdfdf;
}

.InnerForm label {
   font-size: 14px;
   font-weight: 500 !important;
   color: #333 !important;
}

.InnerForm .input-group-text {
   background-color: #ffa656;
   border: 1px solid #ffa656;
   border-radius: 10px;
   color: #fff;
}

.InnerForm .custom-file-label::after {
   background-color: #56cdfb;
   color: #fff;
   cursor: pointer;
}

.InnerForm .custom-file-label {
   border-radius: 10px;
}

.submitbtn {
   width: 100%;
}

.ActionBtns a {
   margin: 0 !important;
}

.ActionBtns {
   display: flex;
   align-items: center;
   gap: 15px;
}

.fc-event-title {
   color: #fff;
}

.fc-event-time {
   color: #fff;
}

.ProgressRow {
   display: flex;
   justify-content: space-between;
   align-items: center;
   width: 100%;
}

.Student_infos {
   display: flex;
   align-items: center;
   background: #ace3cf;
   padding: 15px;
   border-radius: 15px;
   box-shadow: 0 0 10px rgb(0 0 0 / 12%);
   position: relative;
   margin-top: 7px;
}

.Student_img img {
   height: 32px;
   object-fit: cover;
}

.Student_name p {
   color: #000;
   font-weight: 600;
   font-size: 18px;
}

.InnerCardInfo span.info-box-number {
   color: #111;
}

.InnerCardInfo span.info-box-text {
   color: #333;
}

.InnerCardInfo .info-box {
   padding: 15px;
   border-radius: 15px;
   box-shadow: 0px 10px 15px rgb(0 0 0 / 5%);
   background: #D9D0EA;
}

.InnerCardInfo .bg-success {
   background: #BBF7D5 !important;
}

.InnerCardInfo .bg-info {
   background: #C0E4FE !important;
}

.InnerCardInfo .bg-primary {
   background: #FFEACB !important;
}

.InnerCardInfo .bg-danger {
   background: #FFD9D8 !important;
}

.InnerCardInfo .bg-warning {
   background: #673ab759 !important;
}

.InnerCardInfo span.info-box-number a {
   color: #333;
}

.InnerCardInfo .card-info:not(.card-outline)>.card-header {
   background-color: #fff;
   color: #111;
}

.InnerCardInfo .card-primary:not(.card-outline)>.card-header {
   background-color: #fff;
   color: #111;
}

.InnerCardInfo .nav-link {
   padding: 10px 0px;
   color: #333;
   font-weight: 500;
}

.InnerCardInfo span.btn.btn-sm.btn-danger {
   height: 40px;
   width: 40px;
   margin-right: 15px;
   background: rgb(255 17 0 / 80%);
}

.InnerCardInfo .card-body::-webkit-scrollbar-track {
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
   border-radius: 10px;
   background-color: #F5F5F5;
}

.InnerCardInfo .card-body::-webkit-scrollbar {
   width: 5px;
   background-color: #F5F5F5;
}

.InnerCardInfo .card-body::-webkit-scrollbar-thumb {
   border-radius: 10px;
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
   background-color: #ff4133;
}

.InnerCardInfo .card-primary.card-outline {
   border: none;
}

.commenpadding li {
   padding: 10px 0px;
}

.InnerCardInfo .card-success.card-outline {
   border: none;
}

.Student_infos:after {
   content: '\e913';
   font-family: 'Material Icons';
   font-size: 36px;
   position: absolute;
   right: 20px;
   color: #333;
}

.InnerCardInfo .card-header {
   position: relative;
}

.InnerCardInfo .card-header:before {
   content: '\e886';
   font-family: 'Material Icons';
   font-size: 25px;
   position: absolute;
   right: 12px;
   color: #333;
}

.event-response-box {
   border: 1px solid #ddd;
   border-radius: 10px;
   padding: 15px;
   gap: 40px;
   align-items: center;
}

.link-disable {
   opacity: .4;
   cursor: default !important;
   pointer-events: none;
}
.CardStyle {
   background: #FFEACB;
}

.CardStyle .card-header {
   border-color: #f1d9b6;
}

.CardStyle .table-bordered,
.CardStyle .table-bordered td,
.CardStyle .table-bordered th {
   border: 1px solid #f1d9b6;
}

.HeadRow {
   background: #dfcaac;
   padding: 10px 20px;
   border-radius: 5px;
   color: #000;
   display: flex;
   align-items: center;
   justify-content: space-between;
}

.btn-dark {
   background: #343a40;
}

.btn-dark:hover {
   background: #111;
}

.HeadTitle {
   margin: 0;
   font-size: 14px;
}

.ListView ul {
   padding: 0 !important;
}

.ListView {
   height: 450px;
   overflow: auto;
   padding: 10px;
}

.ListView::-webkit-scrollbar-track {
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, 0.3);
   border-radius: 10px;
   background-color: #F5F5F5;
}

.ListView::-webkit-scrollbar {
   width: 6px;
   background-color: #F5F5F5;
}

.ListView::-webkit-scrollbar-thumb {
   border-radius: 10px;
   -webkit-box-shadow: inset 0 0 6px rgba(0, 0, 0, .3);
   background-color: #343a40;
}

.users-list-name {
   font-size: 18px;
   height: 100%;
   display: flex;
   align-items: center;
   padding: 10px;
}

.ListView li {
   border: none;
   box-shadow: 0 0 10px #ccc;
   margin-bottom: 20px;
   padding: 5px;
   border-radius: 10px !important;
}

.ContentCard .card-title {
   font-size: 16px;
}

.ContentCard img {
   object-fit: cover;
   object-position: top;
}

.TitleName a {
   color: #000;
   font-size: 18px;
   text-transform: capitalize;
}

input[type=range] {
   height: 27px;
   -webkit-appearance: none;
   margin: 10px 0;
   width: 100%;
   border: none;
}

input[type=range]:focus {
   outline: none;
}

input[type=range]::-webkit-slider-runnable-track {
   width: 100%;
   height: 10px;
   cursor: pointer;
   animate: 0.2s;
   box-shadow: 0px 0px 0px #000000;
   background: #FFA656;
   border-radius: 50px;
   border: 0px solid #000000;
}

input[type=range]::-webkit-slider-thumb {
   box-shadow: 0px 0px 0px #000000;
   border: 1px solid #FFA656;
   height: 20px;
   width: 20px;
   border-radius: 50px;
   background: #FFA656;
   cursor: pointer;
   -webkit-appearance: none;
   margin-top: -5.5px;
}

input[type=range]:focus::-webkit-slider-runnable-track {
   background: #FFA656;
}

input[type=range]::-moz-range-track {
   width: 100%;
   height: 10px;
   cursor: pointer;
   animate: 0.2s;
   box-shadow: 0px 0px 0px #000000;
   background: #FFA656;
   border-radius: 50px;
   border: 0px solid #000000;
}

input[type=range]::-moz-range-thumb {
   box-shadow: 0px 0px 0px #000000;
   border: 1px solid #FFA656;
   height: 20px;
   width: 20px;
   border-radius: 50px;
   background: #FFA656;
   cursor: pointer;
}

input[type=range]::-ms-track {
   width: 100%;
   height: 10px;
   cursor: pointer;
   animate: 0.2s;
   background: transparent;
   border-color: transparent;
   color: transparent;
}

input[type=range]::-ms-fill-lower {
   background: #FFA656;
   border: 0px solid #000000;
   border-radius: 100px;
   box-shadow: 0px 0px 0px #000000;
}

input[type=range]::-ms-fill-upper {
   background: #FFA656;
   border: 0px solid #000000;
   border-radius: 100px;
   box-shadow: 0px 0px 0px #000000;
}

input[type=range]::-ms-thumb {
   margin-top: 1px;
   box-shadow: 0px 0px 0px #000000;
   border: 1px solid #FFA656;
   height: 20px;
   width: 20px;
   border-radius: 50px;
   background: #FFA656;
   cursor: pointer;
}

input[type=range]:focus::-ms-fill-lower {
   background: #FFA656;
}

input[type=range]:focus::-ms-fill-upper {
   background: #FFA656;
}

.todo-list li {
   display: flex;
   align-items: center;
}

.todo-list li .tools {
   display: none;
   align-items: center;
   gap: 10px;
   margin-left: auto;
}

.todo-list>li:hover .tools {
   display: flex;
}

.dropzone {
   border: 1px dashed rgba(0,0,0,.3) !important;
   padding: 20px;
   border-radius: 5px;
}

.card-body>.table>thead>tr>th {
   border-top-width: 1px !important;
}

.table-bordered thead th {
   border-bottom-width: 1px;
   border-top-width: 1px;
}

.description-info {
   margin: 30px 0 0;
}

.description-info h5 {
   position: relative;
}

.description-info h5:after {
   content: '';
   width: 50px;
   height: 2px;
   display: block;
   margin: 15px 0;
   background: linear-gradient(90deg, rgba(78, 203, 255, 1) 0%, rgba(255, 249, 165, 1) 100%);
}

.description-info p {
   margin: 0 0 15px !important;
   font-size: 14px !important;
}

.mailbox-controls {
   padding: 0 12px;
   display: flex;
   gap: 20px;
   justify-content: space-between;
   margin: 0 0 15px;
}

.inputs-group {
   display: flex;
   gap: 15px;
}

.question-div{
    background-color: #555;
    color: #ddd;
    border-radius: 10px;
    padding: 20px;
    max-width: 700px;
}
.question-div.container > p{
    font-size: 32px;
}
.question-div .question-box{
    width: 75%;
}
.question-div .options{
    position: relative;
    padding-left: 50px;
}
.question-div #options label {
   display: block;
   margin-bottom: 25px;
   cursor: pointer;
   border-radius: 0;
   width: 100%;
   font-size: 19px;
   color: rgb(0, 10, 56);
   font-weight: 500;
   transition: 0.5s all ease;
   line-height: 30px;
}
.question-div .options input{
    opacity: 0;
}
.question-div .checkmark {
   position: absolute;
   top: 0;
   left: 0;
   -webkit-appearance: none;
   border: solid 2px rgb(233, 233, 233);
   border-radius: 50%;
   width: 33px;
   height: 33px;
   cursor: pointer;
   margin-right: 20px;
   transition: 0.5s all ease;
}
.question-div .options input:checked ~ .checkmark:after {
    display: block;
}
/* .question-div .options .checkmark:after{
    content: "";
	 width: 10px;
    height: 10px;
    display: block;
	 background: white;
    position: absolute;
    top: 50%;
	 left: 50%;
    border-radius: 50%;
    transform: translate(-50%,-50%) scale(0);
    transition: 300ms ease-in-out 0s;
} */
.question-div .options .checkmark:after {
   top: 50%;
   left: 50%;
   border-radius: 50%;
   transition: 300ms ease-in-out 0s;
   transform: translate(-50%,-50%) scale(0);
   position: absolute;
   width: 100%;
   height: 100%;
   content: "\f00c";
   line-height: 31px;
   text-align: center;
   font-size: 14px;
   color: rgb(255, 255, 255);
   font-family: "Font Awesome 5 Free";
   font-weight: 600;
}
.question-div .options input[type="radio"]:checked ~ .checkmark{
    background: #21bf73;
    transition: 300ms ease-in-out 0s;
}
.question-div .options input[type="radio"]:checked ~ .checkmark:after{
    transform: translate(-50%,-50%) scale(1);
}
.question-div .btn-primary{
    background-color: #555;
    color: #ddd;
    border: 1px solid #ddd;
}
.question-div .btn-primary:hover{
    background-color: #21bf73;
    border: 1px solid #21bf73;
}
.question-div .btn-success{
    padding: 5px 25px;
    background-color: #21bf73;
}
.question-div .queCntDiv {
   text-align: right;
}
.stud-score {
   text-align: center;
}
.quiz-score {
   text-align: right;
}
.dash-quiz-box {
   border-bottom: 1px solid #eee;
}
.dash-quiz-box-header {
   font-size: 14px;
   font-weight: 600 !important;
   color: #333 !important;
}
.score-download-btn {
   padding-left: 20px;
}
@media(max-width:576px){
   .question-div .question-box{
        width: 100%;
        word-spacing: 2px;
    } 
}

@media (max-width: 767.98px) {
   .mailbox-messages td {
      display: -webkit-box;
   }
}


/* Quiz Design */
.question-div.new_quiz_box {
   background-color: transparent;
   color: #000;
   border-radius: 0;
   padding: 0;
   max-width: 100%;
}
.question-div.new_quiz_box .queCntDiv {
   font-size: 20px;
   color: rgb(0, 10, 56);
   font-weight: bold;
   text-align: right;
   display: block;
}
.question-div.new_quiz_box .form-heading{
   font-size: 28px;
   color: rgb(0, 10, 56);
   font-weight: bold;
   margin-top: 1.5rem;
}
.box_padd{
   padding: 40px !important;
}
.progress_with_counter .progress{
   width: calc(100% - 170px);
   height: 16px;
}
.progress_with_counter .progress-bar{
   height: 16px;
   background: linear-gradient(-90deg, rgba(78, 203, 255, 1) 0%, rgba(255, 249, 165, 1) 100%);
   color: #000;
}

.draft-content {
   color: #721c24;
   background-color: #f8d7da;
   border-color: #f5c6cb;
}

.modal-fullscreen {
   width: 100vw;
   max-width: none;
   height: 100%;
   margin: 0;
}
.thankyou-page-inner {
   background: rgb(255,255,255);
   border-radius: 90px;
   width: 100%;
   position: relative;
   /* transform: translateY(50%); */
   text-align: center;
}
.thankyou-page-inner .wrapper {
   padding: 80px 130px;
}
.thankyou-page-inner .wrapper .tick {
   position: relative;
}
.thankyou-page-inner .wrapper .done-tick {
   width: 120px;
   height: 120px;
   border: solid 1px transparent;
   text-align: center;
   margin-left: auto;
   margin-right: auto;
   border-left-color: rgb(34,208,136);
   animation: rotate-circle 0.5s linear forwards;
   animation-delay: 0.5s;
   border-radius: 50%;
   background-color: transparent;
}
.thankyou-page-inner .tick i {
   font-weight: 900;
   font-size: 50px;
   color: rgb(34,208,136);
   position: absolute;
   animation: tick-icon 0.8s linear forwards;
   animation-delay: 0.5s;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   margin-left: auto;
   margin-right: auto;
   opacity: 0;
   animation-delay: 0.5s;
}
.thankyou-page-inner h2 {
   font-size: 45px;
   color: rgb(5, 17, 51);
   font-weight: bold;
   max-width: 70%;
   margin: 50px auto 0 auto;
}
.thankyou-page-inner p {
   font-size: 16px;
   color: rgb(170, 170, 170);
   margin-top: 20px;
}
.thankyou-page-inner .next-prev-btn .back {
   border: 0;
   border-radius: 50px;
   background-color: #fa4729;
   font-size: 17px;
   color: #000;
   font-weight: bold;
   text-transform: uppercase;
   max-width: 240px;
   height: 67px;
   margin-top: 15px;
   background: linear-gradient(-90deg, rgba(78, 203, 255, 1) 0%, rgba(255, 249, 165, 1) 100%);
   padding: 0 50px;
}
.modal-dialog.modal-fullscreen .modal-content {
   border-radius: 0 !important;
   background-color: rgb(243, 247, 254);
}
.thankyou-page {
   height: 100%;
   display: flex;
   align-items: center;
   justify-content: center;
}
.fa-check:before {
   content: "\f00c";
}
.modal-dialog.modal-fullscreen .modal-body {
   max-height: 100%;
   overflow: auto;
}

.pop-slide{
    animation: pop-slide 1s ease forwards;
}
@keyframes pop-slide
{
    0%
    {
        transform: translateX(500px) scale(0.2);
    }
    50%
    {
        transform: translate(0px) scale(0.8);
    }
    100%
    {
        transform: translate(0px) scale(1);
    }
}

.thankyou-circle{
  animation: circle 0.5s linear forwards;
}
.stream-sessionList {
   display: grid;
}
.take-quiz-btn {
   width: 30%;
   min-height: 45px;
   font-size: 17px;
}
.proj-edit-del-action {
   display: flex;
}
.proj-edit-del-action .projectDelete {
   margin-left: 5px;
}

@keyframes circle 
{
  0%
  {
    clip-path: circle(0%);
  }  
  100%
  {
    clip-path: circle(100%);
  }  
}
/*tick animation*/

@keyframes rotate-circle
{
  25% 
  {

  		border-left-color: rgb(34,208,136);
  }
  50% 
  {

  		border-left-color: rgb(34,208,136);
  		border-top-color: rgb(34,208,136);
  }
  75% 
  {

  		border-left-color: rgb(34,208,136);
  		border-top-color: rgb(34,208,136);
  		border-right-color: rgb(34,208,136);
  }
  100% 
  {
  		transform: rotate(360deg);
  		border-color: rgb(34,208,136);
  }
}

@keyframes tick-icon
{
  0%
  {
    font-size: 0;
    opacity: 1;
    top: 50%;
  }
  20%
  {
    font-size: 10px;
    top: 45%;
  }
  40%
  {
    font-size: 20px;
    top: 40%;
  }
  70%
  {
    font-size: 200px;
    top: 0;
  }
  100%
  {
    font-size: 50px;
    opacity: 1;
    top: 30%;
  }
}


/* form style */
.wizard-fieldset [type="file"] {
   font-size: 13px;
}
.form-wizard .wizard-fieldset {
   display: none;
}
.form-wizard .wizard-fieldset.show {
   display: block !important;
}
.form-wizard .wizard-form-error {
   display: none;
   background-color: #d70b0b;
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   height: 2px;
   width: 100%;
}
label.fw-300 {
   font-weight: 400 !important;
}
.fs-22{
   font-size: 22px;
}

::-webkit-scrollbar-track{
	background-color: #fafafa;
}
::-webkit-scrollbar{
	width: 4px;
   height: 4px;
	background-color: #fff; 
}
::-webkit-scrollbar-thumb{  
	background: linear-gradient(180deg, rgba(78, 203, 255, 1) 0%, rgba(255, 249, 165, 1) 100%);
}
.bg-color-skyblue{
   background-color: #9fe4ff !important;
}

.currect_ans [type="radio"]:checked,
.currect_ans [type="radio"]:not(:checked){
    position: absolute;
    left: -9999px;
}
.currect_ans [type="radio"]:checked + label,
.currect_ans [type="radio"]:not(:checked) + label{
   position: relative;
   padding-left: 20px;
   cursor: pointer;
   line-height: 30px;
   display: inline-block;
   color: #666;
   width: 20px;
   height: 20px;
   margin: 0;
}
.currect_ans [type="radio"]:checked + label:before,
.currect_ans [type="radio"]:not(:checked) + label:before{
    content: '';
    position: absolute;
    left: 0;
    top: 0;
    width: 20px;
    height: 20px;
    border: 1px solid #ddd;
    border-radius: 100%;
    background: #fff;
}
.currect_ans [type="radio"]:checked + label:after,
.currect_ans [type="radio"]:not(:checked) + label:after{
   content: "\f00c";
   font-family: "Font Awesome 5 Free";
   width: 20px;
   height: 20px;
   background: linear-gradient(180deg, rgba(78, 203, 255, 1) 0%, rgba(255, 249, 165, 1) 100%);
   position: absolute;
   top: 0px;
   left: 0px;
   border-radius: 100%;
   -webkit-transition: all 0.2s ease;
   transition: all 0.2s ease;
   line-height: 2;
   color: #000;
   font-size: 11px;
   text-align: center;
}
.currect_ans [type="radio"]:not(:checked) + label:after{
    opacity: 0;
    -webkit-transform: scale(0);
    transform: scale(0);
}
.currect_ans [type="radio"]:checked + label:after{
    opacity: 1;
    -webkit-transform: scale(1);
    transform: scale(1);
}
.form-wizard .que-div {
   max-height: calc(100vh - 350px) !important;
   overflow: auto !important;
}
.que-div .form-group{
   position: relative;
}
.que-div .form-group .currect_ans{
   position: absolute;
   right: 9px;
   bottom: 2px;
}
.que-div .form-group .form-control{
   padding-right: 30px
}
.que-box {
   padding: 15px;
   border: 1px solid #f1f1f1;
   border-radius: 0;
   margin-right: 10px;
   box-shadow: 0 0 10px rgba(0,0,0,0.15);
   border-radius: 10px;
}
.addMore {
   margin-top: 15px;
}



/* new tabbing design */
.BeginnerTab.scrolling_tab {
   margin-bottom: 30px;
   padding-bottom: 0;
}
.bg_light_grey{
   background-color: #F2F5F9;
}
.new_design_three_col {
   display: flex !important;
   gap: 0 !important;
   margin: 0;
   padding: 0;
}
.new_design_three_col .col_wrap {
   padding: 0 15px !important;
   background-color: transparent !important;
   border: 0;
   gap: 0 !important;
   display: flex;
   flex-wrap: wrap;
   border-radius: 0;
}
.new_design_three_col .col_wrap .detailsInfo h2{
   font-size: 24px;
}
.new_design_three_col .col_wrap .detailsInfo .btns-group .btn{
   color: #fff;
}
.new_design_three_col .col_wrap .detailsInfo .btns-group .btn .material-icons{
   color: #fff;
}
.new_design_three_col .col_wrap:nth-child(1n+1) .detailsInfo .btns-group .btn{
   background-color: #ECA761;
}
.new_design_three_col .col_wrap:nth-child(2n+2) .detailsInfo .btns-group .btn{
   background-color: #6BAFE1;
}
.new_design_three_col .col_wrap:nth-child(3n+3) .detailsInfo .btns-group .btn{
   background-color: #59BA73;
}
.new_design_three_col .col_wrap:nth-child(4n+4) .detailsInfo .btns-group .btn{
   background-color: #F09895;
}
.new_design_three_col .col_wrap:nth-child(5n+5) .detailsInfo .btns-group .btn{
   background-color: #946725;
}
.new_design_three_col .col_wrap .detailsInfo .icons i{
   font-size: 50px;
}
.new_design_three_col .col_wrap:nth-child(1n+1) .detailsInfo .icons i{
   color: #ECA761;
}
.new_design_three_col .col_wrap:nth-child(2n+2) .detailsInfo .icons i{
   color: #6BAFE1;
}
.new_design_three_col .col_wrap:nth-child(3n+3) .detailsInfo .icons i{
   color: #59BA73;
}
.new_design_three_col .col_wrap:nth-child(4n+4) .detailsInfo .icons i{
   color: #F09895;
}
.new_design_three_col .col_wrap:nth-child(5n+5) .detailsInfo .icons i{
   color: #946725;
}

.detailsInfo {
   -webkit-box-shadow: 0px 3px 6px #00000029;
           box-shadow: 0px 3px 6px #00000029;
   border-radius: 10px;
   margin-bottom: 30px;
   background-color: #fff;
   padding: 20px;
}
.scrolling_tab{
   overflow-x: auto;
    overflow-y: hidden;
    flex-wrap: nowrap;
}
.scrolling_tab .nav-link {
   flex-wrap: nowrap;
   white-space: pre;
}
.BeginnerTab button {
   padding: 5px 15px;
   border-radius: 10px 10px 0 0 !important;
   background: #f5f5f5;
   border: 0px solid #eee;
}
.BeginnerTab .nav-pills .nav-link.active, .BeginnerTab .nav-pills .show>.nav-link {
   background-color: #4F9BB0;
   border-color: #4F9BB0;
}

/* for scroll */
.stepper {
   width: calc(100% - 240px);
   margin-top: 5px;
}
.stepper ul{
   padding: 0;
   overflow-x: auto;
   overflow-y: hidden;
   border-radius: 2px;
   flex-wrap: nowrap;
}
.stepper ul, .stepper ul li{
   list-style: none;
}
.stepper ul li{
   margin: 5px 20px;
}

.stepper .nav-item {
   width: auto;
}
.stepper ul li a{
   color: #000000;
}
.white-space-nowrap {
   white-space: nowrap;
}
@media(max-width: 991px){
   .title_stepper .stepper {
      order: 3;
      width: calc(100% - 0px);
   }
}
.fs-11{
   font-size: 11px !important;
}
.go_to_quiz{
   background-color: #37BC71;
   color: #fff;
   width: auto;
   min-height: 35px;
   font-size: 13px;
   padding: 7px 15px;
   line-height: 11px;
}
.border-bottom:last-child{
   border: 0 !important
}
.bg_light_yellow{
   background-color: #f8f7f0;
}
.title_minus_btn{
   width: calc(100% - 115px);
}
/* Challenge Details style here*/
.challenge_details {
   background-color: #F1F5F9;
}
.challenge_details_content {
   padding-bottom: 60px;
   padding-left: 30px;
   padding-right: 30px;
   padding-top: 30px;
   box-shadow: 0px 6px 14px #00000010;
   border-radius: 8px;
}
.challenge_details_content h3 {
   letter-spacing: 0px;
   color: #1498AE;
   font-size: 30px;
   text-align: center;
   width: 100%;
   margin-bottom: 15px;
   line-height: 30px;
}
.challenge_details_content p, .challenge_details_content p span {
   text-align: center;
   font-size: 18px !important;
   margin-bottom: 15px;
}
.challenge_details_content p:last-child{
   margin-bottom: 0;
}
.overlap_section {
   border: 1px solid #1498AE;
   border-radius: 6px;
   background-color: #fff;
   padding: 20px;
   margin-top: -60px;
}
.overlap_section p{
   margin-bottom: 0;
}
.overlap_section .mb {
   margin-bottom: 15px;
}
.overlap_section .mb:last-child{
   margin-bottom: 0;
}
.reward_section{
   max-width: 790px;
   margin: auto;
}
.reward_section h3{
   letter-spacing: 0px;
   color: #FF9E55;
   font-size: 30px;
   margin-bottom: 20px;
}
.video_link{
   max-width: 790px;
   margin: auto;
}
.video_link iframe {
   width: 100%;
   height: 300px;
}
.poster_link a {
   font-size: 20px;
   color: #000;
   text-decoration: underline;
}
.poster_link p i{
   color: #1498AE;
}
.poster_link a i{
   color: #1498AE;
}
.box-shadow{
   box-shadow: 0px 6px 14px #00000010;
}
@media(min-width: 991px){
   .challenge_details_hero img {
      width: 100%;
   }
}

.highlight_box {
   display: flex;
   flex-wrap: wrap;
}
.highlight_box .icon img{
   width: 75px;
}
.highlight_box .content {
   width: calc(100% - 75px);
   padding-left: 20px;
   padding-right: 15px;
}
.highlight_box .content p{
   text-align: left;
}
.overlap_section.challenges_box{
   margin-top: 0;
   border: 0;
   padding: 0;
}
@media(max-width: 1367px){
   .challenge_details_content {
      padding-bottom: 100px;
      padding-left: 20px;
      padding-right: 20px;
      padding-top: 20px;
   }
   .challenge_details_content h3 {
      font-size: 28px;
   }
   .challenge_details_content p, .challenge_details_content p span, .overlap_section p {
      font-size: 16px !important;
   }
  .overlap_section {
      padding: 20px;
      margin-top: -90px;
   }
}
@media(max-width: 991px){
   .challenge_details_content h3 {
      font-size: 22px;
   }
}

.resource-box, .poster-box, .subTitle-box, .batch-box, .observation-box {
   background-color: #9fe4ff29;
   padding: 15px;
   margin-bottom: 30px;
   border-radius: 5px;
   border: 1px solid #9fe4ff;
}

.resource-box .form-group, .poster-box .form-group, .subTitle-box .form-group, .batch-box .form-group, .observation-box .form-group {
   position: relative;
}

.resource-box .form-group .trash_title, .poster-box .form-group .trash_title, .subTitle-box .form-group .trash_title, .batch-box .form-group .trash_title, .observation-box .form-group .trash_title {
   position: absolute;
   right: 0;
}
.overlap_section .image_title {
   width: 100%;
   position: relative;
}
.overlap_section .image_title .titleInfo {
   color: #fff;
   width: 100%;
   padding: 24px;
   background-color: rgba(0,181,173,0);
   -webkit-transition: background-color .3s;
   -o-transition: background-color .3s;
   transition: background-color .3s;
   position: absolute;
   top: 0;
   left: 0;
   right: 0;
   bottom: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: stretch;
       -ms-flex-align: stretch;
           align-items: stretch;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
}
.overlap_section .image_title .titleInfo:after {
   content: '';
   position: absolute;
   bottom: 0;
   left: 0;
   top: auto;
   right: 0;
   width: 100%;
   height: 50%;
   z-index: 0;
   background: -webkit-gradient(linear, left bottom, left top, from(rgba(0,0,0,1)), to(rgba(0,0,0,0)));
   background: -o-linear-gradient(bottom, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
   background: linear-gradient(360deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
}

.overlap_section .eventsList .image_title .titleInfo h2 {
   width: 100%;
   margin-top: auto;
   margin-bottom: 0;
   font-size: 23px;
   text-transform: capitalize;
   position: relative;
   z-index: 1;
}

.overlap_section .eventsList {
   position: relative;
   padding: 0;
   border-radius: 0;
   margin-top: 15px;
   border: 0;
   margin-bottom: 15px;
}
.overlap_section .eventsList-thumbnail {
   width: 100%;
   min-width: 100%;
   min-height: min-content;
   border-radius: 0;
   height: auto;
   aspect-ratio: 16 / 9;
}
.overlap_section .eventsList-details .dateInfo {
   margin: 15px 0 0;
   width: 100%;
}
.overlap_section .eventsList-details .bottomInfo {
   width: 100%;
   padding: 0px;
   margin-top: auto;
   flex-wrap: wrap;
   position: absolute;
   bottom: 10px;
   right: 10px;
}
.overlap_section .eventsList-details .bottomInfo .dateInfo{
   width: auto;
   padding: 0;
}
.overlap_section .eventsList-details .title_date h2{
   text-transform: capitalize;
   width: 100%;
}
.overlap_section .eventsList-details .title_date p{
   text-transform: capitalize;
   width: 100%;
}
.overlap_section .eventsList-details .dateInfo {
   width: 100%;
   margin-bottom: auto;
   margin-top: 10px;
   padding: 0;
}
.overlap_section .eventsList-details {
   -webkit-box-flex: 1;
       -ms-flex: 1;
           flex: 1;
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   top: 0;
   background-color: rgb(159 228 255 / 90%);
   padding: 15px;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
   -webkit-box-pack: justify;
       -ms-flex-pack: justify;
           justify-content: space-between;
   -ms-flex-wrap: wrap;
       flex-wrap: wrap;
   opacity: 0;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   z-index: 2;
}
.overlap_section .eventsList:hover .eventsList-details{
   opacity: 1;
}
.overlap_section .eventsList .image_title .titleInfo{
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
}
.overlap_section .eventsList-details .title_date {
   width: 100%;
   margin-top: 0;
   margin-bottom: auto;
}
.overlap_section .eventsList-details .title_date .titleInfo{
   flex-wrap: wrap;
}
.overlap_section .eventsList .image_title .titleInfo h2{
   text-transform: capitalize;
   width: 100%;
}
.overlap_section .eventsList .image_title .titleInfo p{
   width: 100%;
}
.overlap_section .eventsList:hover .image_title .titleInfo{
   opacity: 0;
}
.overlap_section .eventsList-details .bottomInfo .btn-primary{
   color: #fff;
   background-color: #19aae3;
   border-color: #19aae3;
}

.download .action-btn .btn-sm {
   width: 32px;
   padding: 0 !important;
   height: 32px;
   gap: 0;
}
.download .action-btn .btn-sm i {
   font-size: 13px;
}

.download {
   border: 1px solid #e1e1e1;
   padding: 5px 10px;
}
.image-box input, .project-attachments, .attachment-box input, .video-box input {
   font-size: 14px;
   padding: 4px !important;
}
.image-box, .attachment-box,  .video-box {
   position: relative;
   margin-bottom: 10px;
}
.image-box .btn.btn-danger.btn-sm.trash_title, .attachment-box .btn.btn-danger.btn-sm.trash_title, .video-box .btn.btn-danger.btn-sm.trash_title{
   right: 10px;
   border-radius: 50%;
   width: 30px;
   height: 30px;
   top: 3px;
}
.image-box .btn.btn-danger.btn-sm.trash_title i, .attachment-box .btn.btn-danger.btn-sm.trash_title i, .video-box .btn.btn-danger.btn-sm.trash_title i{   
   font-size: 13px;
}

.swiper-button-next, .swiper-button-prev {
   padding: 0;
   background-color: rgba(0, 0, 0, 0.1);
   border-radius: 5px;
}
.swiper-button-prev:after, .swiper-rtl .swiper-button-next:after, .swiper-button-next:after, .swiper-rtl .swiper-button-prev:after {
   color: #fff;
   font-size: 20px !important;
   text-shadow: 0px 1px 2px #000;
}
.slider_section .description-texts .sub-title-bg {
   padding: 10px 15px;
   color: #fff;
   font-weight: 500;
   font-size: 20px;
   margin-bottom: 20px;
   margin-top: 20px;
   width: calc(100% + 15px) !important;
   max-width: calc(100% + 15px) !important;
}
.slider_section .description-texts .odd-even-row:nth-child(odd) .sub-title-bg{
   background-color: #FFA7BB;
}
.slider_section .description-texts .odd-even-row:nth-child(even) .sub-title-bg{
   background-color: #AEA7FF;
}

.banner-detail-page.one-img .singal-img{
   width: 100%;
}
.banner-detail-page.one-img .singal-img img{
   width: 100%;
}
.banner-detail-page.two-img .singal-img, .banner-detail-page.two-img .dabaal-img{
   width: 50%;
}
.banner-detail-page.two-img .dabaal-img img {
   height: 100%;
}
.banner-detail-page {
   display: flex;
   flex-wrap: wrap;
}
.banner-detail-page .singal-img {
   width: 66%;
   height: 460px;
   padding-right: 15px;
}



.banner-detail-page .singal-img img{
   width: 100%;
   height: 100%;
   object-fit: cover;
}
.banner-detail-page .dabaal-img {
   width: 34%;
   height: 460px;
}
.banner-detail-page .dabaal-img img {
   height: calc(50% - 12px);
   width: 100%;
   object-fit: cover;
   margin-bottom: 23px;
}
.banner-detail-page .dabaal-img img:last-child{
   margin-bottom: 0;
}
.odd-even-row:nth-child(even) .row .col-lg-7{
   order: 2;
}
.odd-even-row:nth-child(even) .row .col-lg-5{
   order: 1;
}

.InnerBox.orange_box .IconRaps, .InnerBox.blue_box .IconRaps, .InnerBox.yellow_box .IconRaps{
   width: auto;
   height: auto;
   background-color: transparent;
}
.InnerBox.orange_box .IconRaps i.fa,  .InnerBox.blue_box .IconRaps i.fa,  .InnerBox.yellow_box .IconRaps i.fa{
   font-size: 36px;
}
.InnerBox.orange_box{
   background-color: #F59758;
}
.InnerBox.blue_box{
   background-color: #67ACDD;
}
.InnerBox.yellow_box{
   background-color: rgb(248 194 38);
}

select.form-select {
   box-shadow: 0px 3px 6px #00000029;
   border-radius: 6px;
   border: 0;
   padding: 10px 15px;
}


.recommended_challenges_box {
    padding: 5px 10px 10px 15px;
    background-position: center;
    background-size: contain;
    background-repeat: no-repeat;
    min-height: min-content;
    display: flex;
    align-items: end;
    position: relative;
    border-radius: 15px;
    overflow: hidden;
    aspect-ratio: 16 / 9;
}
.recommended_challenges_box:after {
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   top: 0;
   bottom: 0;
   width: 100%;
   height: 100%;
   opacity: 0.7;
   background: rgb(0,0,0);
   background: linear-gradient(360deg, rgba(0,0,0,1) 0%, rgba(0,0,0,0) 100%);
}
.recommended_challenges_box h5 {
   position: relative;
   z-index: 1;
   color: #fff;
   margin: 0;
}
.border-radius-20{
   border-radius: 20px;
}
.card-header.custom_padding {
   padding: 20px 22px !important;
}
.card-header.pb-0.custom_padding.subscription-activity-tab{
   padding-bottom: 0 !important;
}
.subscription-activity-tab ul.w-100.nav.nav-tabs {
   border-bottom: 0;
}
.subscription-activity li {
   margin-bottom: 15px;
   position: relative;
}
/* .subscription-activity li:after {
   content: '';
   position: absolute;
   left: -20px;
   top: 6px;
   bottom: 0;
   width: 12px;
   height: 12px;
   border-radius: 50%;
   border: 1px solid #707070;
   background-color: #fff;
   z-index: 2;
} */
.content-add-on li:after, .subscription-activity.content-add-on:after {
   display: none;
}
.subscription-activity.content-add-on{
   padding: 0 0 0 15px;
}
/* .subscription-activity li.active:after {
   background-color: #1ED573;
   border: #1ED573;
}
.subscription-activity li.active:first-child:before{
   display: none;
}
.subscription-activity li.active:before {
   content: '';
   background-color: #1ED573;
   left: -15px;
   top: auto;
   height: calc(100% + 15px);
   bottom: calc(100% - 15px);
   position: absolute;
   width: 2px;
   z-index: 2;
} */
.subscription-activity li span:first-child{
   color: #959595;
   display: block;
}
.subscription-activity li span:last-child{
   color: #000000;
   display: block;
}
.subscription-activity li.active span:last-child{
   color: #1ED573;
}
.min-height-390 {
   min-height: 390px;
}
ul.subscription-activity {
   padding: 0 0 0 30px;
   margin: 0;
   list-style: none;
   position: relative;
   overflow: scroll;
   max-height: 490px;
}
ul.subscription-activity:after {
   content: '';
   position: absolute;
   left: 15px;
   top: 10px;
   bottom: 35px;
   width: 2px;
   background-color: #EAEAEA;
}
.bg_brick_orange{
   background-color: #F59758; 
}
.top_badge_wrap img {
   height: 30px;
}
.filter_grayscale img {
   filter: grayscale(1);
}
.bg-dark-grey{
   background-color: #a9abb6;   
}
.borde-radius-15 {
   border-radius: 15px;
}
.gap-3 .p-0 {
   margin-left: -10px;
   margin-right: -10px;
}
.badge img {
   height: auto;
   width: auto;
   max-height: 80px;
   max-width: max-content;
}
.bg-skyblue{
   background-color: #46B3E5;
}
.bg-skyblue h4{
   color: #fff;
}
.bg-skyblue a i{ color: #fff;}
.opacity-20{
   opacity: 0.2 !important;
}
.height-fix img {
   max-width: 100%;
   height: auto;
}
.card-body.padding-0{
   padding: 0 !important;
}
.btn-orange {
   background-color: #EF7429;
   color: #fff;
   font-weight: 600;
   text-transform: uppercase;
}
@media(min-width: 1641px){
   ul.subscription-activity {
      max-height: 498px;
   }
}
@media(max-width: 1640px){
   .IconRaps {
      width: 70px;
      height: 80px;
   }
   .fs-50 {
      font-size: 28px;
   }
   .stud-dash-cnt-box {
      font-size: 16px !important;
   }
   .CounterRaps span {
      font-size: 20px;
   }
   .InnerBox.orange_box .IconRaps i.fa, .InnerBox.blue_box .IconRaps i.fa, .InnerBox.yellow_box .IconRaps i.fa {
      font-size: 24px;
   }
   .orange_box .IconCounter .BoxTitle, .blue_box .IconCounter .BoxTitle, .yellow_box .IconCounter .BoxTitle {
      width: calc(100% - 100px);
   }
   .card .card-header h3, .card .card-header h4 {
      font-size: 1.2rem;
  }
}

@media screen and (min-device-width:1200px), screen and (max-width:1366px) {
   .badge-box-height {
      min-height: 350px;
   }
}

.old_dashboard .InnerBox {
   background: #fff;
   padding: 15px;
   border-radius: 15px;
   box-shadow: 0px 10px 15px rgb(0 0 0 / 5%);
}
.old_dashboard .InnerBox .IconCounter .IconRaps {
   width: 34px;
   height: 34px;
   display: flex;
   justify-content: center;
   align-items: center;
   border-radius: 5px;
   background: #9FE4FF;
   box-shadow: 0px 3px 6px rgb(0 0 0 / 16%);
}
.old_dashboard .stud-dash-cnt-box {
   font-size: 14px !important;
}
.old_dashboard .CounterRaps span {
   font-size: 20px;
}
.old_dashboard  .IconCounter {
   padding-right: 0;
   height: 100%;
}
.old_dashboard .BoxTitle {
   margin-top: 15px;
   margin-left: 0;
}
.old_dashboard .GreenBox {
   background: #BBF7D5;
}
.old_dashboard .PinkBox {
   background: #FFD9D8;
}
.old_dashboard .GreenBox .IconRaps {
   background: #51EE95;
}
.old_dashboard .PinkBox .IconRaps {
   background: #FF9F9C;
}
@media(max-width: 1440px){
   .banner-detail-page .singal-img {
      height: 360px;
   }   
   .banner-detail-page .dabaal-img {
      height: 360px;
   }
}

@media(max-width: 767px){
   .banner-detail-page .singal-img {
      height: 240px;
   }   
   .banner-detail-page .dabaal-img {
      height: 240px;
   }
   
   .overlap_section .eventsList-details .title_date {
      display: flex;
      flex-wrap: wrap;
   }
   .overlap_section .eventsList-details .dateInfo {
      width: 45%;
   }
   .overlap_section .eventsList-details .title_date p {
      text-transform: capitalize;
      width: 100%;
      text-overflow: ellipsis;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
      font-size: 13px !important;
   }
   .overlap_section .eventsList-details .title_date h2 {
      font-size: 20px;
      text-overflow: ellipsis;
      overflow: hidden;
      display: -webkit-box;
      -webkit-line-clamp: 1;
      -webkit-box-orient: vertical;
   }
   .overlap_section .eventsList-details .dateInfo label {
      font-size: 14px;
      line-height: 14px;
  }

}

@media(min-width: 991px){
   
   .description-texts .odd-even-row:nth-child(even) .row .for-order:first-child {
      order: 2;
  }
}
.opacity-50{
   opacity: 0.5;
}
.InnerContentCard .IConHere img.level_icon {
   width: 60px;
   height: 60px;
   object-fit: contain;
}
.InnerContentCard.add-ons-box{
   padding: 30px;
}
.for-loop-btn .bg-b:nth-child(4n+1) .levels.bg-white .ContentBody .view-button .btn.btn-primary{
   background-color: #e67834;
}
.for-loop-btn .bg-b:nth-child(4n+2) .levels.bg-white .ContentBody .view-button .btn.btn-primary{
   background-color: #5cb1e3;
}
.for-loop-btn .bg-b:nth-child(4n+3) .levels.bg-white .ContentBody .view-button .btn.btn-primary{
   background-color: #777373;
}
.for-loop-btn .bg-b:nth-child(4n+4) .levels.bg-white .ContentBody .view-button .btn.btn-primary{
   background-color: #dd5930;
}

.for-loop-color .bg-r:nth-child(5n+1) .InnerContentCard.add-ons-box{
   background-color: #E8E28A;
}
.for-loop-color .bg-r:nth-child(5n+2) .InnerContentCard.add-ons-box{
   background-color: #FBCEA9;
}
.for-loop-color .bg-r:nth-child(5n+3) .InnerContentCard.add-ons-box{
   background-color: #B8B4B4;
}
.for-loop-color .bg-r:nth-child(5n+4) .InnerContentCard.add-ons-box{
   background-color: #B8D6EF;
}
.for-loop-color .bg-r:nth-child(5n+5) .InnerContentCard.add-ons-box{
   background-color: #F9C2A5;
}


.InnerContentCard.add-ons-box .btn.btn-orange, .InnerContentCard.levels .btn.btn-primary{
   font-weight: 400 !important;
   text-transform: capitalize !important;
}
.InnerContentCard.add-ons-box .btn.btn-orange:hover{
   color: #fff;
}
.InnerContentCard.add-ons-box .btn.btn-orange i, .InnerContentCard.levels .btn.btn-primary i{
   font-size: 10px;
}
.levels-add-ons .InnerContentCard.levels .ContentBody .IConHere {
   width: 60px;
   height: 60px;
}
.levels-add-ons .InnerContentCard.levels .ContentBody{
   flex-direction: inherit;
}
.levels-add-ons .InnerContentCard.levels {
   margin-bottom: 30px;
   height: calc(100% - 15px);
}
.levels-add-ons .InnerContentCard.levels .ContentBody {
   padding: 20px;
}
.levels-add-ons .InnerContentCard.levels .ContentBody .content {
   width: calc(100% - 80px);
   padding-left: 15px;
   margin-bottom: auto;
}
.levels-add-ons .InnerContentCard.levels .ContentBody .content h5 {
   line-height: 22px !important;
   margin-bottom: 5px;
}
.levels-add-ons .InnerContentCard.levels .ContentBody .content p {
   text-overflow: inherit;
   overflow: visible;
   display: block;
}
.levels-add-ons .InnerContentCard.levels .ContentBody .IConHere {
   margin-bottom: auto;
}

.levels-add-ons .InnerContentCard.levels .ContentBody .view-button {
   margin-top: auto !important;
}
.InnerContentCard.add-ons-box {
   height: calc(100% - 15px) !important;
   margin-bottom: 30px;
}
.InnerContentCard.add-ons-box .IConHere {
   width: 60px;
   height: 60px;
}
.InnerContentCard.add-ons-box .content p {
   display: block;
}
.InnerContentCard.add-ons-box .content .card-title {
   font-size: 24px;
   line-height: 32px !important;
   margin-bottom: 5px;
}

.InnerContentCard.add-ons-box .assignment-text .content .card-title {
   width: calc(100% - 40px) !important;
   margin-bottom: 0;
   word-wrap: break-word;
}
.assignment-text i {
   width: 40px;
   text-align: center;
   font-size: 34px;
}

.scroll-tab {
   flex-wrap: nowrap;
   overflow-y: hidden;
}
.scroll-tab  .nav-link {
   white-space: nowrap;
}
.scroll-tab.nav-tabs .nav-item.show .nav-link, .scroll-tab.nav-tabs .nav-link.active {
   color: #000;
   background-color: #94E0FD;
   border-color: #dee2e6 #dee2e6 #fff;
}
.new_design_three_col.trainer_new{
   gap: 16px !important;
}
.new_design_three_col.trainer_new li {
   gap: 0;
   padding: 0;
   background: #fff;
   /* border: 0px solid #eee;
   border-radius: 0; */
   margin: 0 0 10px 0;
   width: calc(33% - 8px);
}
.new_design_three_col.trainer_new li .detailsInfo{
   margin: 0;
   background-color: unset;
}
.new_design_three_col.trainer_new li .detailsInfo .btn-sm {
   background-color: #f3a55c !important;
   color: #fff !important;
}
.new_design_three_col.trainer_new li .detailsInfo .btn-sm i{
   color: #fff;
}
.new_design_three_col.trainer_new li .detailsInfo h2 {
   font-size: 16px;
}
.new_design_three_col.trainer_new li:nth-child(5n+1) {
   background-color: #E8E28A;
} 
.new_design_three_col.trainer_new li:nth-child(5n+2) {
   background-color: #FBCEA9;
}
.new_design_three_col.trainer_new li:nth-child(5n+3) {
   background-color: #B8B4B4;
}
.new_design_three_col.trainer_new li:nth-child(5n+4) {
   background-color: #B8D6EF;
}
.new_design_three_col.trainer_new li:nth-child(5n+5) {
   background-color: #F9C2A5;
}

.text-normal {
   text-transform: capitalize;
   font-weight: 400;
}
.btn-orange.text-normal:hover{
   color: #fff;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(1)  .description-info {
   background-color: #F4F4F4;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(2)  .description-info {
   background-color: #94E0FD5A;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(3)  .description-info {
   background-color: #94E0FD5A;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(4)  .description-info {
   background-color: #F4F4F4;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(5)  .description-info {
   background-color: #F4F4F4;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(6)  .description-info {
   background-color: #94E0FD5A;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(7)  .description-info {
   background-color: #94E0FD5A;
}
.trainer-detail-odd-even .row .trainer-box:nth-child(8)  .description-info {
   background-color: #F4F4F4;
}

.trainer-detail-odd-even .row .trainer-box .description-info {
   padding: 20px;
   height: 100%;
   margin: 0px 0 0 0;
}
.trainer-detail-odd-even .row .trainer-box .description-info p, .trainer-detail-odd-even .row .trainer-box .description-info p span {
   text-align: left !important;
   letter-spacing: 0px !important;
   color: #000000 !important;
   font-size: 14px !important;
   /* text-transform: capitalize; */
}
.trainer-detail-odd-even .row .trainer-box .description-info p,
.trainer-detail-odd-even .row .trainer-box .description-info p a,
.trainer-detail-odd-even .row .trainer-box .description-info p span,
.trainer-detail-odd-even .row .trainer-box .description-info p a,
.trainer-detail-odd-even .row .trainer-box .description-info p span b span,
.trainer-detail-odd-even .row .trainer-box .description-info p b,
.trainer-detail-odd-even .row .trainer-box .description-info p span u,
.trainer-detail-odd-even .row .trainer-box .description-info ul li,
.trainer-detail-odd-even .row .trainer-box .description-info ul li u,
.trainer-detail-odd-even .row .trainer-box .description-info ul li font,
.trainer-detail-odd-even .row .trainer-box .description-info ul li font span,
.trainer-detail-odd-even .row .trainer-box .description-info span,
.trainer-detail-odd-even .row .trainer-box .description-info font,
.trainer-detail-odd-even .row .trainer-box .description-info span{
font-size: 16px !important;
font-family: 'Jost', sans-serif !important;
color: #000 !important;
background-color: transparent !important;
/* list-style: none !important; */
/* text-decoration: none !important; */
/* font-weight: 400 !important; */
text-align: left !important;
}
/* .trainer-detail-odd-even .row .trainer-box .description-info ul {
   padding: 0 !important;
   list-style: none !important;
}
.trainer-detail-odd-even .row .trainer-box .description-info ul li{
   list-style: none !important;
} */

.trainer-detail-odd-even .row .trainer-box .description-info p:last-child{
   margin-bottom: 0 !important; 
}
.trainer-detail-odd-even .row .trainer-box .description-info h5 {
   margin-bottom: 15px;
}
.trainer-detail-odd-even .row .trainer-box .description-info h5:after{
   display: none;
}
.description-info.pdf-wrap h6 i{
   color:#1498AE;
}
.description-info.pdf-wrap a{
   color: #000;
   text-decoration: underline;
}

.swiper .gallery img {
   width: 100%;
   height: 100% !important;
   object-fit: contain;
}
.swiper .gallery {
   height: 300px;
   border: 1px solid #e1e1e1;
}

@media(max-width: 1440px){
   .InnerContentCard.add-ons-box .assignment-text .content .card-title {
      width: calc(100% - 20px) !important;
      font-size: 18px;
   }
  .assignment-text i {
      width: 20px;
      text-align: center;
      font-size: 18px;
      color: #212529;
   }
   .new_design_three_col.trainer_new li .detailsInfo h2 {
      font-size: 16px;
   }
   
}
@media(max-width: 1199px){
   .InnerContentCard.add-ons-box .content .card-title {
      font-size: 20px;
      line-height: 26px !important;
      margin-bottom: 10px;
   }
   .new_design_three_col.trainer_new li .detailsInfo h2 {
      font-size: 16px;
   }
   .new_design_three_col.trainer_new li {
      width: calc(50% - 8px);
   }
}
@media(max-width: 767px){
   .new_design_three_col.trainer_new li {
      width: 100%;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(1)  .description-info {
      background-color: #F4F4F4;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(2)  .description-info {
      background-color: #94E0FD5A;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(3)  .description-info {
      background-color: #F4F4F4;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(4)  .description-info {
      background-color: #94E0FD5A;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(5)  .description-info {
      background-color: #F4F4F4;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(6)  .description-info {
      background-color: #94E0FD5A;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(7)  .description-info {
      background-color: #F4F4F4;
   }
   .trainer-detail-odd-even .row .trainer-box:nth-child(8)  .description-info {
      background-color: #94E0FD5A;
   }
}
.subscription-activity-tab .nav-tabs .nav-link{
   color: #000;
}
.subscription-activity-tab .nav-tabs .nav-link.active {
   background-color: rgb(248 194 38);
   color: #000;
}

.student-workbook h5:after {
   margin: 5px 0;
   background: none;
}

.scorm-progress {
   height: 20px !important;
}

.stud-import-notes {
   padding: 5px;
   background-color: #fcf8e3;
}   

.profileInfo-container .dashboard-school-logo img {
   object-fit: contain !important;
}

.progress-student-list {
   max-height: 315px;
   overflow: scroll;
}
.progress-student-information {
   background: #fff;
   border-radius: 15px;
   box-shadow: 0px 5px 15px rgb(0 0 0 / 10%);
   padding: 15px;
}

.btn-respond {
   text-transform: none;
}

.btn-respond:hover {
   color: #fff;
}

.btn-respond-action {
   text-transform: none;
}

.btn-respond-action:hover {
   color: #fff;
}

.border-none {
   border: none;
}

.bg-blue-work{
   background-color: #1894D1;
}
.overflow-hidden{
   overflow: hidden;
}
.workspace_timeline li {
   list-style: none;
   position: relative;
   margin-bottom: 91px;
}
.workspace_timeline ol.ps-timeline {
   padding: 80px 50px;
   margin: 0;
   column-count: 2;
}

.ps-timeline li:nth-child(1) .img-handler{
   background-color: #FCC659;
}
.ps-timeline li:nth-child(2) .img-handler{
   background-color: #90A7F2;
}
.ps-timeline li:nth-child(3) .img-handler{
   background-color: #90F2B2;
}
.ps-timeline li:nth-child(4) .img-handler{
   background-color: #FFE3E3;
}
.ps-timeline li .img-handler {
   width: 540px;
   text-align: center;
   padding: 15px;
   border-radius: 15px;
   margin: auto;
}
.workspace_timeline li .ps p {
   font-size: 24px;
   color: #000;
   margin: 0;
   line-height: 36px;
}
.img-handler img {
   height: 270px;
   width: auto;
}
.workspace_timeline li .ps {
   position: absolute;
   left: 0;
   right: 0;
   bottom: -94px;
   margin: auto;
   text-align: center;
   width: 100%;
}
.workspace_timeline li:after {
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   bottom: -43px;
   width: 6px;
   height: 43px;
   border-radius: 7px;
   background-color: #434343;
   margin: auto;
}

.workspace_timeline li:nth-child(1){
   width: 50%;
}
.workspace_timeline li:nth-child(2) {
   margin-bottom: 0 !important;
   width: 50%;
   margin-left: 50%;
}
.workspace_timeline li:nth-child(3){
   width: 50%;
}
.workspace_timeline li:nth-child(4) {
   margin-bottom: 0 !important;
   width: 50%;
   margin-left: 50%;
}
.workspace_timeline li:nth-child(2):after, .workspace_timeline li:nth-child(4):after {
   top: -43px;
   bottom: auto;
}
.workspace_timeline li:nth-child(2) .ps:after, .workspace_timeline li:nth-child(4) .ps:after {
   top: 50px;
   bottom: 0%;
}

.workspace_timeline li:nth-child(2) .ps, .workspace_timeline li:nth-child(4) .ps{
   bottom: calc(100% + 60px);
}

.workspace_timeline li:nth-child(1):before, .workspace_timeline li:nth-child(3):before {
   content: '';
   position: absolute;
   width: 120%;
   background-color: #434343;
   height: 6px;
   bottom: -49px;
   left: 0;
   border-radius: 10px;
}
.workspace_timeline li:nth-child(2):before, .workspace_timeline li:nth-child(4):before {
   content: '';
   position: absolute;
   width: 105%;
   background-color: #434343;
   height: 6px;
   bottom: auto;
   left: 0%;
   border-radius: 10px;
   top: -48px;
}

.workspace_timeline li .ps:after {
   position: absolute;
   content: '';
   width: 24px;
   height: 24px;
   background-color: #434343;
   top: -24px;
   border-radius: 50%;
   left: 0;
   right: 0;
   margin: auto;
}
@media(max-width: 2500px){
   .workspace_timeline ol.ps-timeline {
      padding: 80px 20px;
   }
   .ps-timeline li .img-handler {
      width: 440px;
   }
}
@media(max-width: 2100px){
   .ps-timeline li .img-handler {
      width: 400px;
   }
   .img-handler img {
      height: 240px;
      width: auto;
   }
}
@media(max-width: 1920px){
   .ps-timeline li .img-handler {
      width: 100%;
   }
   .img-handler img {
      height: 200px;
      width: auto;
   }
   .workspace_timeline ol.ps-timeline {
      padding: 20px;
   }
   .workspace_timeline li:nth-child(1) {
      width: 60%;
   }
   .workspace_timeline li:nth-child(2) {
      margin-bottom: 0 !important;
      width: 60%;
      margin-left: 45%;
  }
  .workspace_timeline li:nth-child(3) {
      width: 60%;
      margin-left: -10%;
   }
   .workspace_timeline li:nth-child(4) {
      width: 60%;
      margin-left: 40%;
   }
}

@media(max-width: 1640px){
   .workspace_timeline li:nth-child(1) {
      width: 70%;
   }
   .workspace_timeline li:nth-child(2) {
      margin-bottom: 0 !important;
      width: 70%;
      margin-left: 44%;
   }
   .workspace_timeline li:nth-child(3) {
      width: 70%;
      margin-left: -15%;
   }
   .workspace_timeline li:nth-child(4) {
      margin-bottom: 0 !important;
      width: 70%;
      margin-left: 30%;
   }
   .ps-timeline li .img-handler {
      width: 80%;
   }
   .img-handler img {
      height: 170px;
   }
}

@media(max-width: 1440px){
   .ps-timeline li .img-handler {
      width: 300px;
   }
   .img-handler img {
      height: 160px;
      width: auto;
   }
   .workspace_timeline li .ps {
      width: 100%;
   }
   .workspace_timeline li .ps p {
      font-size: 18px;
      line-height: 28px;
   }
   .workspace_timeline li:nth-child(2) .ps:after, .workspace_timeline li:nth-child(4) .ps:after {
      top: 42px;
   }
   .workspace_timeline li .ps {
      bottom: -86px;
   }
   .workspace_timeline ol.ps-timeline {
      padding: 0px;
   }
   .workspace_timeline li:nth-child(2):before, .workspace_timeline li:nth-child(4):before {
      width: 100%;
   }

}
@media(max-width: 1368px){
   .ps-timeline li .img-handler {
      width: 80%;
   }
   .img-handler img {
      height: 120px;
   }
}
@media(max-width: 767px){
   .workspace_timeline li:after,
   .workspace_timeline li:nth-child(1):before,
   .workspace_timeline li:nth-child(2):before,
   .workspace_timeline li:nth-child(3):before,
   .workspace_timeline li:nth-child(4):before,
   .workspace_timeline li .ps:after{
      display: none;
   }
   .workspace_timeline ol.ps-timeline {
      padding: 10px;
      column-count: inherit;
      display: flex;
      flex-wrap: wrap;
   }
   .workspace_timeline li:nth-child(1), .workspace_timeline li:nth-child(2), .workspace_timeline li:nth-child(3), .workspace_timeline li:nth-child(4) {
      width: 50%;
      margin: 0 0 0px 0;
      padding: 15px 15px 40px 15px;
   }
   .workspace_timeline li .ps {
      bottom: 0px;
   }
   .workspace_timeline li:nth-child(2) .ps, .workspace_timeline li:nth-child(4) .ps {
      bottom: 0px;
   }

}
@media(max-width: 575px){
   .workspace_timeline li:nth-child(1), .workspace_timeline li:nth-child(2), .workspace_timeline li:nth-child(3), .workspace_timeline li:nth-child(4) {
      width: 100%;
  }
}


.btn-orange, .bg-orange-work{
   background-color: #EF7429;
}
.btn-orange-outline {
   border: 1px solid #EF7429 !important;
   background-color: transparent;
   color: #EF7429;
}
.btn-orange-outline:hover{
   border: 1px solid #EF7429 !important;
   background-color: #EF7429;
   color: #fff;
}
.text-white{
   color: #fff;
}
.bg-orange-work button.close {
   width: 40px;
   height: 40px;
   background-color: #fff;
   opacity: 1;
   border-radius: 50%;
   padding: 0;
   position: absolute;
   right: 0;
   top: 0;
   color: #EF7429;
   font-weight: 400;
   font-size: 31px;
   padding: 0 0 5px 0px;
}
.custom_modal .modal-header.bg-orange-work {
   border-radius: 13px 13px 0 0;
}
.edit_profile_wrap {
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   margin-bottom: 20px;
   border-bottom: 1px solid #e1e1e1;
   padding-bottom: 20px;
}

.edit_profile_wrap .edit_profile_logo {
   width: 120px;
   height: 120px;
}
.edit_profile_wrap img {
   width: 100%;
   height: 100%;
   object-fit: cover;
}

.edit_profile_wrap .schoolStatus {
   width: calc(100% - 250px);
   padding-left: 25px;
   padding-right: 25px;
}
.schoolStatus p {
   margin: 0 0 5px 0;
}
.profileStatus h5 {
   margin-bottom: 2px;
}

@media(max-width: 575px){
   .edit_profile_wrap .schoolStatus {
      width: 100%;
      padding-left: 0;
      padding-right: 0;
      margin-top: 10px;
      margin-bottom: 15px;
  }
}

.profile_status_right_img img{
   height: 320px;
   object-fit: contain;
}
.bg-grey-work{
   background-color: rgb(255 255 243);
}

.sidebar-clickable {
   z-index: 1060;
}

.disable-weekly-quiz, .disable-manual-submission, .disable-btn-assignment-submit {
   opacity: 0.6 !important;
   pointer-events: none;
}
.leader-board-data .accordion h2{
   width: 100%;
   display: block;
}
.leader-board-data .accordion h2 button{
   width: 100%;
   display: block;
}
.leader-board-data .accordion .card .card-header .leader-board-avtar {
   width: 32px;
   height: 32px;
   border-radius: 50%;
   background-color: #e1e1e1;
   overflow: hidden;
}
.leader-board-data .accordion .card .card-header .leader-board-avtar img {
   height: 100%;
   width: 100%;
   object-fit: cover;
}
.leader-board-data .accordion .card .card-header .collapsible-link{
   padding-right: 24px;
}
.leader-board-data .accordion .card .card-header .collapsible-link .text{
   width: calc(100% - 80px);
}
.leader-board-data .accordion .card .card-header [aria-expanded="false"].collapsible-link::after {
   content: '';
   position: absolute;
   width: 10px;
   height: 2px;
   background-color: #000;
   right: 21px;
   transform: rotate(45deg);
   transition: 0.5s;
}
.leader-board-data .accordion .card .card-header [aria-expanded="false"].collapsible-link::before {
   content: '';
   position: absolute;
   width: 10px;
   height: 2px;
   background-color: #000;
   right: 15px;
   transform: rotate(-45deg);
   transition: 0.5s;
}
.leader-board-data .accordion .card .card-header [aria-expanded="true"].collapsible-link::after{
   content: '';
   position: absolute;
   width: 10px;
   height: 2px;
   background-color: #000;
   right: 21px;
   transform: rotate(-45deg);
   transition: 0.5s;
}
.leader-board-data .accordion .card .card-header [aria-expanded="true"].collapsible-link::before{
   content: '';
   position: absolute;
   width: 10px;
   height: 2px;
   background-color: #000;
   right: 15px;
   transform: rotate(45deg);
   transition: 0.5s;
}
.card-header.custom_padding_badges {
   padding: 15px 22px !important;
}

.mt-minus25 {
   margin-top: -25px !important;
}

.bg-color-unset {
   background-color: unset !important;
}

.scorm-iframe {
   aspect-ratio: 16 / 10;
   height: auto;
}
.required-asterisks {
   color: red;
}

.brand-link.brand-logo {
   display: flex;
   flex-direction: column;
}

.brand-link.brand-logo .brand-image {
   object-fit: contain;
   object-position: left;
}
.rounded-4{
   border-radius: 4px !important;
}

.card-max-height {
   max-height: 920px;
   overflow-y: scroll;
}

.download-profile-disable {
   opacity: 0.5;
   /* pointer-events: none; */
}

.reward-tooltip-info {
   position: absolute;
   top: 10px;
   right: 10px;
}

.layout-fixed .main-sidebar .sidebar {
   height: calc(100vh - 110px) !important;
}

.assignment-review-pending {
   background-color: #fcf8e3 !important;
}

.assignment-review-pending-badge {
   background-color: #fa3e3e;
   border-radius: 100%;
   color: white;
   padding: 1px 3px;
   font-size: 12px;
   top: -10px;
   right: -10px;
   width: 22px;
   height: 22px;
   position: absolute;
   display: flex;
   justify-content: center;
   align-items: center;
 }
 
 .remarkable-note-list {
   max-height: 120px !important;
   overflow-y: scroll !important;
}

.gap-0 {
   gap: 0;
}

.dottedBox p{
   margin: 0;
   text-align: left;
   display: block;
   width: 100%;
}

.dottedBox ul{
   padding: 0 0 0 20px;
   margin: 0;
   text-align: left;
   width: 100%;
   margin-bottom: 30px;
}

.dottedBox li{
   padding: 0;
   margin: 0;
   text-align: left;
   font-weight: 400;
   font-size: 14px;
   width: 100%;
}
.satisfy-regular {
   font-size: 12px !important;
   background-color: #f3d42b;
   width: auto !important;
   display: inline-block !important;
   margin: auto;
   text-align: center !important;
   border: 1px solid #000;
   padding: 1px 10px;
   color: #000;
   margin-bottom: 15px;
}
 .light-orange a {
   display: block;
   height: 100%;
   text-align: center;
}
.watch-video-assi .nav-item {
   background-color: #df632f;
}
.watch-video-assi .scroll-tab.nav-tabs .nav-item.show .nav-link,
.watch-video-assi .scroll-tab.nav-tabs .nav-link.active{
   background-color: #df632f;
}

.watch-video-assi .BeginnerTab .watch-video-btn {
   background-color: #ffbb9c;
   color: #fff;
   max-width: 100%;
   height: 100%;
   width: 100%;
}
.watch-video-assi .BeginnerTab .watch-video-btn.nav-link.active{
   background-color: #e46d36;
   color: #fff;
}
.watch-video-assi .BeginnerTab .assignment-tab-btn{
   background-color: #b9c3ff;
   color: #fff;
}
.watch-video-assi .BeginnerTab .assignment-tab-btn.nav-link.active{
   background-color: #273bb7;
   color: #fff;
}
.watch-video-assi .BeginnerTab {
   border: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
}
.watch-video-assi .BeginnerTab button {
   border-radius: 30px !important;
   z-index: 2;
   display: inline-block;
   text-align: center !important;
   padding: 20px 10px;
   border: 0;
   height: 100%;
}
.watch-video-assi .BeginnerTab span {
   text-align: center;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-pack: center;
   -ms-flex-pack: center;
   justify-content: center;
   font-size: 14px;
   line-height: 1.3;
}
.text-black{
   color: #000;
}
.play-icon {
   position: relative;
   padding: 0 0 0 13px;
   font-size: 14px;
}
.play-icon:after {
   width: 0px;
   height: 0px;
   border-style: solid;
   border-width: 6px 0 6px 8px;
   border-color: transparent transparent transparent #fff;
   transform: rotate(0deg);
   position: absolute;
   content: '';
   left: 0;
   top: 0;
   bottom: 0;
   margin: auto;
   border-radius: 3px 5px 1px 3px;
}

.watch-video-assi .BeginnerTab button span{
   margin-bottom: auto;
   margin-top: 0;
   display: -webkit-box;
   display: -ms-flexbox;
   display: flex;
   -webkit-box-align: center;
       -ms-flex-align: center;
           align-items: center;
   -webkit-box-pack: center;
       -ms-flex-pack: center;
           justify-content: center;
   height: auto;
   width: auto;
   padding: 0;
   text-wrap: auto;
   margin-bottom: 10px;
}
.light-yellow {
   color: #f3eb31;
   font-weight: 700;
   font-size: 15px !important;
   z-index: 1;
   letter-spacing: -0.9px;
}
.light-orange {
   background-color: #fcefe8;
   border: 1px solid #2f2826;
   border-radius: 30px;
   padding: 20px 10px;
   z-index: 1;
   height: 100%;
   max-width: 240px;
}
.light-blue {
   background-color: #dfe7ff;
   border: 1px solid #2f2826;
   border-radius: 20px;
}
.eual-div {
   z-index: 1;
   position: relative;
   height: 100%;
   width: 200px;
}
.light-bulb-img-wrap {
   padding-right: 14px;
   width: 80px;
   z-index: 1;
   position: relative;
}
.watch-video-assi .BeginnerTab {
   border: 0;
   -webkit-box-align: center;
   -ms-flex-align: center;
   align-items: center;
   -webkit-box-pack: justify;
   -ms-flex-pack: justify;
   justify-content: space-between;
   position: relative;
   gap: 20px;
   display: -ms-grid;
   display: grid;
   grid-auto-flow: column;
   padding-right: 0;
   padding-bottom: 10px !important;
}
.watch-video-assi .BeginnerTab:after {
   content: '';
   position: absolute;
   height: 1px;
   width: calc(100% - 100px);
   background-image: -o-repeating-linear-gradient(left, #ef7429, #ef7429 12px, transparent 12px, transparent 22px);
   background-image: repeating-linear-gradient(90deg, #ef7429, #ef7429 12px, transparent 12px, transparent 22px);
   background-position: left top;
   background-repeat: repeat-x;
   background-size: 100% 2px;
   left: 40px;
}

.watch-video-assi .BeginnerTab img {
   height: 80px;
   z-index: 2;
}
.watch-video-assi .BeginnerTab .rocket {
   -webkit-transform: rotateZ(90deg);
       -ms-transform: rotate(90deg);
           transform: rotateZ(90deg);
           height: 90px;
           margin-top: 10px;
}
.watch-video-assi .BeginnerTab .light-bulb {
   height: 56px;
   -webkit-transform: rotate(45deg);
       -ms-transform: rotate(45deg);
           transform: rotate(45deg);
}

@media (max-width: 1199px) {
   .watch-video-assi .BeginnerTab .rocket {
      -webkit-transform: rotateZ(0deg);
      -ms-transform: rotate(0deg);
      transform: rotateZ(0deg);
      height: 100px;
      margin: auto;
   }
   .watch-video-assi .BeginnerTab {
      
      -webkit-box-pack: justify;
      -ms-flex-pack: justify;
      justify-content: center;
      display: -ms-grid;
      display: grid  ;
      grid-auto-flow: inherit;
  }
   .watch-video-assi .BeginnerTab .eual-div{
      display: grid;
      justify-content: center;
      grid-auto-flow: inherit;
   }
   
   .watch-video-assi .BeginnerTab:after {
      height: calc(100% - 110px);
      width: 1px;
      left: 0;
      right: 0;
      margin: auto;
      background-image: repeating-linear-gradient(180deg, #ef7429, #ef7429 12px, transparent 12px, transparent 22px);
      background-position: left top;
      background-repeat: repeat-y;
      background-size: 2px 100%;
   }
   .watch-video-assi .BeginnerTab .light-bulb {
      height: 60px;
      margin: auto;
   }
   .light-bulb-img-wrap {
      padding-right: 0;
      width: 80px;
      z-index: 1;
      position: relative;
      margin: auto;
      padding-left: 8px;
   }
}

#more-feedback, #more-comment {
   display: none;
}

/* figma new design  */
.for-loop-btn.fig-card .bg-b:nth-child(4n+1) .levels.bg-white {
   background-image: linear-gradient(278.51deg, #FFFFFF 37.72%, #FFE6CB 96.75%);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+2) .levels.bg-white {
   background-image: linear-gradient(279.5deg, #FFFFFF 42.53%, #C8EEFF 98.46%);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+3) .levels.bg-white {
   background-image: linear-gradient(281.04deg, #FFFFFF 49.1%, #FFF4CA 98.24%);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+4) .levels.bg-white {
   background-image: linear-gradient(278.57deg, #FFFFFF 43.98%, #DBE7FF 96.47%);
}

/* 2 box same start   */
.for-loop-btn.fig-card .bg-b:nth-child(1) .levels.bg-white.two-box,
.for-loop-btn.fig-card .bg-b:nth-child(2) .levels.bg-white.two-box  {
   background-image: linear-gradient(278.51deg, #FFFFFF 37.72%, #FFE6CB 96.75%);
}
.for-loop-btn.fig-card .bg-b:nth-child(3) .levels.bg-white.two-box,
.for-loop-btn.fig-card .bg-b:nth-child(4) .levels.bg-white.two-box {
   background-image: linear-gradient(279.5deg, #FFFFFF 42.53%, #C8EEFF 98.46%);
}
.for-loop-btn.fig-card .bg-b:nth-child(5) .levels.bg-white.two-box,
.for-loop-btn.fig-card .bg-b:nth-child(6) .levels.bg-white.two-box {
   background-image: linear-gradient(281.04deg, #FFFFFF 49.1%, #FFF4CA 98.24%);
}
.for-loop-btn.fig-card .bg-b:nth-child(7) .levels.bg-white.two-box,
.for-loop-btn.fig-card .bg-b:nth-child(8) .levels.bg-white.two-box {
   background-image: linear-gradient(278.57deg, #FFFFFF 43.98%, #DBE7FF 96.47%);
}
/* 2 box same end */

.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody .IConHere{
   width: 50px;
   height: 50px;
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody .IConHere img,
.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody .IConHere svg{
   width: 100%;
   height: 100%;
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody:hover .IConHere img,
.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody:hover .IConHere svg{
   transform: rotate(-10deg);
}

.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody:hover .IConHere{
   width: 100px;
   height: 100px;
}

.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody .content {
   width: calc(100% - 50px);
   padding-left: 20px;
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}

.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody:hover .content {
   width: calc(100% - 100px);
   padding-left: 20px;
}

.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels .ContentBody {
   outline: 2px solid transparent;
   border-radius: 24px;
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+1) .levels.bg-white:hover .ContentBody:hover{
   outline-color: rgba(253, 101, 0, 1);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+2) .levels.bg-white:hover .ContentBody:hover{
   outline-color: rgba(32, 159, 218, 1);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+3) .levels.bg-white:hover .ContentBody:hover{
   outline-color: rgba(255, 200, 0, 1);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+4) .levels.bg-white:hover .ContentBody:hover{
   outline-color: rgba(74, 131, 255, 1);
}

/* two box same start */
.for-loop-btn.fig-card .bg-b:nth-child(1) .levels.bg-white.two-box:hover .ContentBody:hover,
.for-loop-btn.fig-card .bg-b:nth-child(2) .levels.bg-white.two-box:hover .ContentBody:hover{
   outline-color: rgba(253, 101, 0, 1);
}
.for-loop-btn.fig-card .bg-b:nth-child(3) .levels.bg-white.two-box:hover .ContentBody:hover,
.for-loop-btn.fig-card .bg-b:nth-child(4) .levels.bg-white.two-box:hover .ContentBody:hover{
   outline-color: rgba(32, 159, 218, 1);
}
.for-loop-btn.fig-card .bg-b:nth-child(5) .levels.bg-white.two-box:hover .ContentBody:hover,
.for-loop-btn.fig-card .bg-b:nth-child(6) .levels.bg-white.two-box:hover .ContentBody:hover{
   outline-color: rgba(255, 200, 0, 1);
}
.for-loop-btn.fig-card .bg-b:nth-child(7) .levels.bg-white.two-box:hover .ContentBody:hover,
.for-loop-btn.fig-card .bg-b:nth-child(8) .levels.bg-white.two-box:hover .ContentBody:hover{
   outline-color: rgba(74, 131, 255, 1);
}
/* two box same end */

.for-loop-btn.fig-card .bg-b:nth-child(4n+1) .levels.bg-white .ContentBody .view-button .btn.btn-primary {
   background-color: rgba(255, 125, 0, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+1) .levels.bg-white:hover .ContentBody .view-button .btn.btn-primary {
   background: linear-gradient(100.76deg, #FFC800 7.3%, #FF7D00 29.91%);
   box-shadow: 0px 9px 40px 0px rgba(255, 175, 27, 0.62);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+2) .levels.bg-white .ContentBody .view-button .btn.btn-primary {
   background-color: rgba(32, 159, 218, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+2) .levels.bg-white:hover .ContentBody .view-button .btn.btn-primary {
   background: linear-gradient(104.57deg, #9ADFFF 8.06%, #209FDA 39.56%);
   box-shadow: 0px 9px 40px 0px rgba(27, 194, 255, 0.62);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+3) .levels.bg-white .ContentBody .view-button .btn.btn-primary {
   background-color: rgba(246, 175, 34, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+3) .levels.bg-white:hover .ContentBody .view-button .btn.btn-primary {
   background: linear-gradient(104.74deg, #FFDC96 0.18%, #FFAE00 36.92%);
   box-shadow: 0px 9px 40px 0px rgba(255, 194, 27, 0.62);
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+4) .levels.bg-white .ContentBody .view-button .btn.btn-primary {
   background-color: rgba(49, 114, 255, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.for-loop-btn.fig-card .bg-b:nth-child(4n+4) .levels.bg-white:hover .ContentBody .view-button .btn.btn-primary {
   background: linear-gradient(105.46deg, #A9C4FF 5.57%, #3172FF 44.94%);
   box-shadow: 0px 9px 40px 0px rgba(27, 118, 255, 0.62);
}


.CustomBody.levels-add-ons .for-loop-btn.fig-card .bg-b {
   margin-bottom: 15px;
   /* padding-left: 15px !important;
   padding-right: 15px !important; */
}
.CustomBody.levels-add-ons .InnerContentCard.levels {
   margin-bottom: 0;
   height: 100%;
   width: 100%;
}

.CustomBody.levels-add-ons .for-loop-btn.fig-card .InnerContentCard.levels {
   border-radius: 24px;
}

.for-loop-btn.fig-card .bg-b .levels.bg-white .ContentBody .view-button .btn.btn-primary i{
   display: none;
}
.for-loop-btn.fig-card .bg-b .levels.bg-white .ContentBody .card-title {
   font-family: Jost;
   font-weight: 600 !important;
   font-size: 24px;
   line-height: 122% !important;
   margin-bottom: 10px;
   display: flex;
   align-items: flex-start;
   justify-content: space-between;
   width: 100%;
}
.for-loop-btn.fig-card .bg-b .levels.bg-white .ContentBody p.card-text {
   font-weight: 400;
   font-size: 16px;
   line-height: 150%;
   display: block;
   display: -webkit-box;
   max-width: 100%;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
   min-height: 72px;
}
/* .for-loop-btn.fig-card .bg-b .levels.bg-white .ContentBody:hover p.card-text{
   -webkit-line-clamp: 3;
  -webkit-box-orient: vertical;
  overflow: hidden;
  text-overflow: ellipsis;

} */
/* 
.CustomBody.levels-add-ons .for-loop-btn.fig-card{
   padding-left: 15px;
   padding-right: 15px;
} */


.InnerContentCard.add-ons-box.fig-img-card {
   border-radius: 30px;
   padding: 0;
   overflow: hidden;
}
.InnerContentCard.add-ons-box.fig-img-card .content .card-title {
   font-weight: 600 !important;
   font-size: 24px;
   line-height: 120% !important;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
}
.InnerContentCard.add-ons-box.fig-img-card:hover .content .card-title{
   font-size: 20px;
}
.InnerContentCard.add-ons-box.fig-img-card .content p {
   font-weight: 400;
   font-size: 0px;
   line-height: 150%;
   color: rgba(92, 92, 92, 1);
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   display: block;
   display: -webkit-box;
   max-width: 100%;
   -webkit-line-clamp: 3;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
}

.InnerContentCard.add-ons-box.fig-img-card:hover .content p{
   font-size: 16px;
}

.InnerContentCard.add-ons-box.fig-img-card .view-button a i{
   display: none;
}
.InnerContentCard.add-ons-box.fig-img-card  .ContentBody .view-button{
   width: 100%;
   padding: 0 30px;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
}
.InnerContentCard.add-ons-box.fig-img-card .view-button a{
   background-color: rgba(255, 125, 0, 1);
   width: 170px;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
}

.InnerContentCard.add-ons-box.fig-img-card:hover .view-button a{
   width: 100%;
   background-image: linear-gradient(100.76deg, #FFC800 7.3%, #FF7D00 29.91%);
   box-shadow: 0px 9.7px 43.1px 0px rgba(255, 175, 27, 0.62);
}


.for-loop-color .bg-r:nth-child(5n+1) .InnerContentCard.add-ons-box.fig-img-card,
.for-loop-color .bg-r:nth-child(5n+2) .InnerContentCard.add-ons-box.fig-img-card,
.for-loop-color .bg-r:nth-child(5n+3) .InnerContentCard.add-ons-box.fig-img-card,
.for-loop-color .bg-r:nth-child(5n+4) .InnerContentCard.add-ons-box.fig-img-card,
.for-loop-color .bg-r:nth-child(5n+5) .InnerContentCard.add-ons-box.fig-img-card {
   background-color: #fff;
}
.InnerContentCard.add-ons-box.fig-img-card {
   width: 100%;
   height: auto;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   position: relative;
}

.InnerContentCard.add-ons-box.fig-img-card:hover{
   transform: scale(1.06);
   z-index: 1039;
}
.InnerContentCard.add-ons-box.fig-img-card .IConHere img.level_icon {
   width: 100%;
   height: 100%;
   object-fit: cover;
   object-position: top center;
}
.InnerContentCard.add-ons-box.fig-img-card .IConHere {
   width: 100%;
   height: 235px;
   -webkit-transition: 0.5s;
   -o-transition: 0.5s;
   transition: 0.5s;
   position: relative;
}
.InnerContentCard.add-ons-box.fig-img-card .IConHere:before {
   position: absolute;
   content: '';
   width: 100%;
   height: 100px;
   background-image: url(../../../image/level/icon/Subtract.svg);
   background-size: 100%;
   background-position: center bottom;
   bottom: -3px;
   background-repeat: no-repeat;
}
.InnerContentCard.add-ons-box.fig-img-card:hover .IConHere {
   width: 100%;
   height: 160px;
}

.InnerContentCard.add-ons-box.fig-img-card .ContentBody {
   padding-bottom: 30px !important;
}
.InnerContentCard.add-ons-box.fig-img-card .ContentBody .content {
   padding: 0 30px;
}

@media(max-width: 1299px){
   .for-loop-btn.fig-card .bg-b .levels.bg-white .ContentBody .card-title {
      font-size: 18px;
   }
   .for-loop-btn.fig-card .bg-b .levels.bg-white .ContentBody p.card-text {
      font-size: 16px;
   }
   .InnerContentCard.add-ons-box.fig-img-card .IConHere {
      height: 175px;
   }
   .InnerContentCard.add-ons-box.fig-img-card:hover .IConHere {
      height: 100px;
   }
   .InnerContentCard.add-ons-box.fig-img-card:hover .content .card-title {
      font-size: 18px;
   }
  
   .InnerContentCard.add-ons-box.fig-img-card .content .card-title {
      font-size: 22px;
      line-height: 130% !important;
      display: block;
      display: -webkit-box;
      max-width: 100%;
      -webkit-line-clamp: 2;
      -webkit-box-orient: vertical;
      overflow: hidden;
      text-overflow: ellipsis;
   }
   .InnerContentCard.add-ons-box.fig-img-card:hover .content p {
      font-size: 14px;
   }
}

/* lesson plan page design */

.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo {
   outline: 2px solid transparent;
   border-radius: 24px;
   box-shadow: 0px 10px 15px rgb(0 0 0 / 5%);
   transition: 0.5s;
   display: flex;
   flex-direction: unset;
   flex-wrap: wrap;
}

.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo .icons{
   width: 50px;
   height: 50px;
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo:hover .icons{
   width: 100px;
   height: 100px;
   transform: rotate(-10deg);
}
.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo .content {
   width: calc(100% - 50px);
   padding-left: 20px;
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo:hover .content {
   width: calc(100% - 100px);
}

.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo .content p{
   font-weight: 400;
    font-size: 16px;
    line-height: 150%;
    display: block;
    display: -webkit-box;
    max-width: 100%;
    -webkit-line-clamp: 3;
    -webkit-box-orient: vertical;
    overflow: hidden;
    text-overflow: ellipsis;
    min-height: 72px;
}
.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo .icons img{
   width: 100%;
}

.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+1) .detailsInfo{
   background-image: linear-gradient(278.51deg, #FFFFFF 37.72%, #FFE6CB 96.75%);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+2) .detailsInfo {
   background-image: linear-gradient(279.5deg, #FFFFFF 42.53%, #C8EEFF 98.46%);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+3) .detailsInfo {
   background-image: linear-gradient(281.04deg, #FFFFFF 49.1%, #FFF4CA 98.24%);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+4) .detailsInfo {
   background-image: linear-gradient(278.57deg, #FFFFFF 43.98%, #DBE7FF 96.47%);
}

.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+1) .detailsInfo:hover{
   outline-color: rgba(253, 101, 0, 1);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+2) .detailsInfo:hover{
   outline-color: rgba(32, 159, 218, 1);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+3) .detailsInfo:hover{
   outline-color: rgba(255, 200, 0, 1);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+4) .detailsInfo:hover{
   outline-color: rgba(74, 131, 255, 1);
}

.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+1) .detailsInfo .btns-group .btn.btn-sm {
   background-color: rgba(255, 125, 0, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+1) .detailsInfo:hover .btns-group .btn.btn-sm {
   background: linear-gradient(100.76deg, #FFC800 7.3%, #FF7D00 29.91%);
   box-shadow: 0px 9px 40px 0px rgba(255, 175, 27, 0.62);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+2) .detailsInfo .btns-group .btn.btn-sm {
   background-color: rgba(32, 159, 218, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+2) .detailsInfo:hover .btns-group .btn.btn-sm {
   background: linear-gradient(104.57deg, #9ADFFF 8.06%, #209FDA 39.56%);
   box-shadow: 0px 9px 40px 0px rgba(27, 194, 255, 0.62);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+3) .detailsInfo .btns-group .btn.btn-sm {
   background-color: rgba(246, 175, 34, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+3) .detailsInfo:hover .btns-group .btn.btn-sm {
   background: linear-gradient(104.74deg, #FFDC96 0.18%, #FFAE00 36.92%);
   box-shadow: 0px 9px 40px 0px rgba(255, 194, 27, 0.62);
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+4) .detailsInfo .btns-group .btn.btn-sm {
   background-color: rgba(49, 114, 255, 1);
   -webkit-transition: 1s;
   -o-transition: 1s;
   transition: 1s;
}
.new_design_three_col.lesson_plan_fig .col_wrap:nth-child(4n+4) .detailsInfo:hover .btns-group .btn.btn-sm {
   background: linear-gradient(105.46deg, #A9C4FF 5.57%, #3172FF 44.94%);
   box-shadow: 0px 9px 40px 0px rgba(27, 118, 255, 0.62);
}
.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo .btns-group .btn.btn-sm{
   padding: 7px 20px;
   min-height: 40px;
}
.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo .btns-group .btn.btn-sm i{
   display: none;
}

.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo .btns-group {
   margin-top: auto;
   margin-left: auto;
}

.new_design_three_col.lesson_plan_fig .col_wrap .detailsInfo h2 {
   font-size: 24px;
   line-height: 100%;
   display: -webkit-box;
   max-width: 100%;
   -webkit-line-clamp: 1;
   -webkit-box-orient: vertical;
   overflow: hidden;
   text-overflow: ellipsis;
}
@media(max-width: 1640px){
   .new_design_three_col.lesson_plan_fig .col_wrap{
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
   }
}
@media(max-width: 1199px){
   .new_design_three_col.lesson_plan_fig .col_wrap{
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
   }
}
@media(max-width: 991px){
   .new_design_three_col.lesson_plan_fig .col_wrap{
      -ms-flex: 0 0 50%;
      flex: 0 0 50%;
      max-width: 50%;
   }
}
@media(max-width: 767px){
   .new_design_three_col.lesson_plan_fig .col_wrap{
      -ms-flex: 0 0 100%;
      flex: 0 0 100%;
      max-width: 100%;
   }
}

/* calender pager design start */
.fc-daygrid-day-frame {
   position: relative;
}
.fc-daygrid-day-frame .fc-daygrid-day-events{
   position: absolute;
   left: 0;
   top: 0;
}
.fc-event .fc-event-main {
   position: relative;
   z-index: 2;
   display: inline-grid;
   gap: 8px;
}
.fc .fc-daygrid-day-number {
    margin-left: auto;
    padding: 12px 15px;
    font-family: Jost;
    font-weight: 700;
    font-size: 24px;
    text-transform: uppercase;
}
.fc-event .fc-event-main {
    position: relative;
    z-index: 2;
    display: inline-grid;
    gap: 8px;
    padding: 15px 0 15px 10px;
    width: 100%;
}
.fc-timegrid-event-harness .fc-timegrid-event .fc-event-main{
   padding: 7px 0 6px 6px;
}
.fc-timegrid-col .fc-timegrid-col-frame .fc-timegrid-col-events {
  margin: 0;
}
.fc-timegrid-event-harness .fc-timegrid-event .fc-event-main .fc-event-title img {
    width: 45px;
}
.fc-timegrid-event-harness .fc-timegrid-event .fc-event-main .fc-event-desc {
    gap: 7px;
    padding: 3px 9px;
}
.fc-timegrid-event-harness .fc-timegrid-event .fc-event-main .fc-event-desc img{
   width: 11px;
}
.fc-timegrid-event-harness .fc-timegrid-event .fc-event-main .fc-event-desc span{
   font-size: 10px;
}

.fc-event-desc {
   background: rgba(255, 255, 255, 0.50);
   display: inline-flex;
   align-items: center;
   width: auto;
   gap: 7px;
   padding: 8px 14px;
   border-radius: 35px;
}
.fc-event-desc span{
   font-family: Jost;
   font-weight: 500;
   font-size: 16px;
   line-height: 122%;
   letter-spacing: 0;
   color: rgba(0, 0, 0, 1);
}
.fc .fc-daygrid-event, .fc-timegrid-event-harness > .fc-timegrid-event {
    padding: 0 !important;
    background: transparent !important;
    border-color: transparent !important; 
    border-radius: 0 !important;
    position: relative;
    border: 0 !important;
}
.fc-event-title img{
   width: 63px;
}
.fc-event-desc img {
    width: 12px;
}
.fc .fc-daygrid-event:after{
   display: none;
}
.fc .fc-daygrid-day.fc-day .fc-daygrid-day-frame::after
/* .fc-day .fc-daygrid-day-frame .fc-event-main .selected */ {
    content: '';
    width: calc(100% + 100px);
    height: calc(100% + 100px);
    position: absolute;
    top: -50px;
    left: -50px;
    right: 0;
    bottom: 0;
    background: linear-gradient(129.08deg, #FFE167 21.84%, rgba(255, 251, 173, 0.46) 57.33%);
    border-radius: 50%;
    transition: 0.5s;
    transform: translate(100%, 100%);
}

.fc .fc-daygrid-body-balanced .fc-daygrid-day-events {
    position: absolute;
    left: 0;
    right: 0;
    width: 100%;
    height: 100%;
}
.fc-daygrid-day-events .fc-daygrid-event-harness {
    height: 100%;
}
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event{
   height: 100%;
}
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event{
   width: 100%;
   height: 100%;
}
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event .has-meeting .fc-event-title{
   display: block;
   margin-bottom: 10px;
}
.fc-daygrid-day-events .fc-daygrid-event-harness .fc-event .fc-event-main,
.fc-timegrid-event-harness .fc-timegrid-event {
    width: 100%;
    height: 100%;
}
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event .has-meeting{
   width: 100%;
   height: 100%;
}
.fc-timegrid-event-harness .fc-event-main .has-meeting .fc-event-title{
   display: flex;
   align-items: center;
   margin-bottom: 5px;
}
.fc-timegrid-event .fc-event-main .has-meeting{
   /* display: flex;
   align-items: center;
   gap: 8px; */
}
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event .has-meeting:before,
.fc-timegrid-event-harness .fc-timegrid-event .has-meeting:before {
    content: '';
    position: absolute;
    left: -25%;
    right: 0;
    top: -25%;
    bottom: 0;
    background-color: #FFF7D6;
    width: calc(100% + 50%);
    height: calc(100% + 50%);
    z-index: 0;
    border-radius: 0;
}
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event .has-meeting:after,
.fc-timegrid-event-harness .fc-timegrid-event .has-meeting:after {
    content: '';
    position: absolute;
    left: -25%;
    right: 0;
    top: -25%;
    bottom: 0;
    width: calc(100% + 50%);
    height: calc(100% + 50%);
    z-index: 0;
    border-radius: 0;
    background: linear-gradient(133.9deg, #FFE066 38.91%, #FFFFFF 74.29%);
    transform: translate(90%, 90%);
    transition: 0.5s;
}
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event .has-meeting .fc-event-title,
.fc-daygrid-day-events .fc-daygrid-event-harness a.fc-daygrid-event .has-meeting .fc-event-desc,
.fc-timegrid-event-harness .fc-timegrid-event .has-meeting .fc-event-title,
.fc-timegrid-event-harness .fc-timegrid-event .has-meeting .fc-event-desc{
   position: relative;
   z-index: 2;
}
.fc-timegrid-event-harness {
    overflow: hidden;
}
.fc-daygrid-day-events:hover .fc-daygrid-event-harness a.fc-daygrid-event .has-meeting:after,
.fc-timegrid-event-harness:hover .fc-event-main .has-meeting:after{
   transform: translate(0, 0);
   border-radius: 0;
}
.fc-daygrid-day .fc-daygrid-day-frame .fc-daygrid-day-top {
    position: relative;
    z-index: 8;
}
/* .fc .fc-daygrid-day.fc-day:hover .fc-daygrid-day-frame::after{
   transform: translate(0%, 0%);
} */
/* .fc-day .fc-daygrid-day-frame:hover .fc-event-main .selected{
   border-radius: 0;
   transform: translate(0%, 0%);
   z-index: -1;
} */
.fc .fc-daygrid-day.fc-day-today .fc-daygrid-day-frame{
   /* background: linear-gradient(133.56deg, #FFD119 22.23%, #FFFBAD 76.97%); */
   border: 2px solid #FF7D00;
   background-color: #fff;
}
.fc .fc-daygrid-body-natural .fc-daygrid-day-events{
   margin-bottom: 10px;
}

.wing {
    position: absolute;
    right: 3px;
    bottom: 8px;
    background-color: #FFFBDA;
    z-index: 1;
    border-radius: 50%;
    width: 40px;
    height: 40px;
    align-items: center;
    justify-content: center;
    display: flex;
}
.wing img{
   width: 28px;
}
.fc-event-button-join{
   margin-top: 12px;
   text-align: left;
   z-index: 2;
   position: relative;
}
.fc-event-button-join a{
   padding: 4px 8px;
   font-size: 13px;
   line-height: 1.2;
   background: rgba(255, 255, 255, 0.50);
   color: rgba(0, 0, 0, 1);
   border-radius: 4px;
   text-decoration: none;
   display: inline-block;
   transition: background 0.3s, color 0.3s;
}
.fc-event-button-join a.join-now-active {
   background-color: #e36e00; /* Brand orange */
   color: #fff;
}
.fc-event-button-join a.join-now-active:hover {
   background-color: #fd7e14;
}
.fc-event-button-join a.join-now-disabled {
   background-color: #e0e0e0;
   color: #888;
   pointer-events: none;
   cursor: not-allowed;
}
.fc-timegrid-event-harness .fc-timegrid-event .fc-event-main .wing{
   width: 30px;
   height: 30px;
}
.fc-timegrid-event-harness .fc-timegrid-event .fc-event-main .wing img{
   width: 16px;
}
@media(max-width: 1399px){
   .fc-event-title img {
      width: 54px;
   }
   .fc-event-desc {
    gap: 5px;
    padding: 6px 11px;
   }
   .fc-event-desc span {
    font-size: 13px;
   }
   .fc .fc-daygrid-day-number {
    padding: 6px 10px;
    font-size: 18px;
   }
   .fc-event .fc-event-main {
      gap: 6px;
      padding: 5px 0 0 5px;
   }
}
@media(max-width: 1199px){
   .fc-event .fc-event-main {
        gap: 6px;
        padding: 2px 0 0 0px;
   }
   .fc-event-desc span {
        font-size: 10px;
   }
   .fc .fc-daygrid-day-number {
        font-size: 14px;
   }
   .fc-event-desc {
      gap: 4px;
      padding: 5px 10px;
   }
   .fc-event-desc img {
      width: 9px;
   }
}
@media(max-width: 767px){
   .fc-event-title img {
      width: 40px;
   }
   .fc .fc-daygrid-day-number {
      padding: 5px 6px 0 0;
      font-size: 10px;
   }
   .fc-event-desc {
      gap: 2px;
      padding: 4px 6px;
   }
   .fc .fc-daygrid-more-link {
      font-size: 11px;
      width: 30px;
      display: block;
   }
   .fc .fc-daygrid-day-bottom {
      font-size: .85em;
      padding: 5px 3px 0;
   }
   .fc .fc-daygrid-day-bottom {
      font-size: .85em;
      padding: 4px 2px 0;
   }

}

.calendar-session-popup .background-light-yellow {
    background-color: #FFF7D6;
}

.calendar-session-popup .session-info p {
    padding: 0 0 10px 0;
    margin: 0 0 10px 0;
    border-bottom: 1px solid rgba(0, 0, 0, 0.065);
}

.topics-scroll-tab .scroll-tab-container {
   position: relative;
   display: flex;
   align-items: center;
   max-width: 100%;
}

.topics-scroll-tab .scroll-arrow {
   background: #EF7429;
   border: 1px solid #dee2e6;
   color: #fff;
   padding: 8px 12px;
   cursor: pointer;
   transition: all 0.3s ease;
   z-index: 10;
   flex-shrink: 0;
}

.topics-scroll-tab .scroll-arrow:hover {
   background: #e9ecef;
   color: #495057;
}

.topics-scroll-tab .scroll-arrow:disabled {
   opacity: 0.5;
   cursor: not-allowed;
}

.topics-scroll-tab .scroll-arrow.left {
   border-radius: 4px 0 0 4px;
}

.topics-scroll-tab .scroll-arrow.right {
   border-radius: 0 4px 4px 0;
}

.topics-scroll-tab .tabs-wrapper {
   overflow: hidden;
   flex: 1;
   position: relative;
}

.topics-scroll-tab .scroll-tab {
   display: flex;
   overflow-x: auto;
   scroll-behavior: smooth;
   scrollbar-width: none;
   -ms-overflow-style: none;
   border-bottom: 1px solid #dee2e6;
   flex-wrap: nowrap;
}

.topics-scroll-tab .scroll-tab::-webkit-scrollbar {
   display: none;
}

.topics-scroll-tab .scroll-tab .nav-item {
   flex-shrink: 0;
   white-space: nowrap;
   min-width: max-content;
}

.topics-scroll-tab .scroll-tab .nav-link {
   border-radius: 0;
   border-bottom: 2px solid transparent;
   transition: all 0.3s ease;
   padding: 8px 16px;
   text-align: center;
   display: block;
   width: auto;
}

/* Fade indicators for scroll availability */
.topics-scroll-tab .tabs-wrapper::before,
.topics-scroll-tab .tabs-wrapper::after {
   content: '';
   position: absolute;
   top: 0;
   bottom: 0;
   width: 20px;
   pointer-events: none;
   z-index: 5;
   transition: opacity 0.3s ease;
}

.topics-scroll-tab .tabs-wrapper::before {
   left: 0;
   background: linear-gradient(to right, rgba(248,249,250,0.8), transparent);
   opacity: 0;
}

.topics-scroll-tab .tabs-wrapper::after {
   right: 0;
   background: linear-gradient(to left, rgba(248,249,250,0.8), transparent);
   opacity: 0;
}

.topics-scroll-tab .tabs-wrapper.can-scroll-left::before {
   opacity: 1;
}

.topics-scroll-tab .tabs-wrapper.can-scroll-right::after {
   opacity: 1;
}

.topics-scroll-tab .tab-content {
   margin-top: 20px;
}

.topics-scroll-tab .tab-pane {
   padding: 20px;
   background: #f8f9fa;
   border-radius: 4px;
}

.topics-scroll-tab .topics-header {
   width: 100%;
   margin-bottom: 0;
}

.topics-scroll-tab .scroll-container-wrapper {
   width: 100%;
}

.topics-scroll-tab .scroll-tab.nav-tabs .nav-item.show .nav-link, .scroll-tab.nav-tabs .nav-link.active {
   color: #fff;
   background-color: #EF7429;
}

.stud-dashboard-leader-board .leader-board-avtar {
  width: 32px;
  height: 32px;
  border-radius: 50%;
  background-color: #e1e1e1;
  overflow: hidden;
}
.stud-dashboard-leader-board  .leader-board-avtar img {
  height: 100%;
  width: 100%;
  object-fit: cover;
}
.button-wrao a {
  background-color: #e67834;
  color: #fff;
  border-radius: 50px;
  padding: 12px 60px 12px 25px;
  display: inline-block;
  position: relative;
  font-size: 18px;
  font-weight: 600;
}
.button-wrao a i {
  width: 40px;
  height: 40px;
  border-radius: 50%;
  background-color: #fff;
  color: #e67834;
  line-height: 40px;
  text-align: center;
  font-size: 24px;
  position: absolute;
  right: 5px;
  top: 0;
  bottom: 0;
  margin: auto;
}
.speak-up-wrap {
    height: calc(100% - 99px);
}
.speak-up-wrap .form-control {
  background: #fff;
  border-radius: 15px;
  box-shadow: 0px 5px 15px rgb(0 0 0 / 10%);
  border: 0;
  height: 100%;
}

.stud-dashboard-leader-board .speak-up {
   resize: none;        /* Prevents resizing */
   pointer-events: none; /* Disables interaction */
   background-color: #f5f5f5; /* Visual indication it's disabled */
   color: #666;         /* Grayed out text */
}

.stud-dashboard-leader-board .card .card-body.p-0{
   padding:0 !important;
}

.stud-dashboard-name-text {
   width: calc(100% - 130px);
}

.hover-success:hover {
  background-color: #198754 !important;  /* Bootstrap success green */
  border-color: #198754 !important;
  color: #fff !important;
}

/* 12-Aug - colors and shapes card design */
:root{
  --c1: #FFC800; /* red-ish */
  --c2: #35BFFF; /* yellow-ish */
  --c3: #FD9000; /* green-ish */
  --c4: #B787FF; /* blue-ish */
}
.malti-color-list .box{
  color: #fff;
  font-weight: 600;
  border-radius: 8px;
  box-shadow: 0 4px 10px rgba(0,0,0,0.08);
}
.malti-color-list .box {
    color: #000;
    overflow: hidden;
    position: relative;
}
/* repeat every 4 */
.malti-color-list .color-box:nth-child(4n+1) .box{ background-color: var(--c1); }
.malti-color-list .color-box:nth-child(4n+2) .box{ background-color: var(--c2); } 
.malti-color-list .color-box:nth-child(4n+3) .box{ background-color: var(--c3); }
.malti-color-list .color-box:nth-child(4n+4) .box{ background-color: var(--c4); }

.malti-color-list .box .img-shape {
   position: relative;
   overflow: hidden;
   transition: box-shadow 0.3s ease;
}
.malti-color-list .box .img-shape img {
   width: 100%;
   aspect-ratio: 9 / 6;
   height: 100%;
   object-fit: cover;
   object-position: center;
}
.malti-color-list .color-box:nth-child(4n+1) .box .img-shape{
  clip-path: polygon( 0.652% 14.442%,0.652% 14.442%,0.251% 12.378%,0.123% 10.318%,0.249% 8.311%,0.608% 6.408%,1.18% 4.66%,1.944% 3.117%,2.88% 1.829%,3.967% 0.846%,5.185% 0.22%,6.513% 0%,93.435% 0%,93.435% 0%,94.814% 0.236%,96.07% 0.907%,97.182% 1.956%,98.127% 3.325%,98.885% 4.958%,99.434% 6.798%,99.752% 8.786%,99.819% 10.868%,99.612% 12.985%,99.111% 15.08%,89.666% 44.812%,89.666% 44.812%,89.413% 45.711%,89.216% 46.636%,89.074% 47.581%,88.988% 48.54%,88.958% 49.505%,88.984% 50.471%,89.065% 51.43%,89.202% 52.377%,89.394% 53.305%,89.643% 54.207%,99.229% 84.995%,99.229% 84.995%,99.718% 87.087%,99.915% 89.197%,99.841% 91.27%,99.518% 93.249%,98.966% 95.078%,98.207% 96.7%,97.263% 98.059%,96.154% 99.1%,94.903% 99.766%,93.53% 100%,6.437% 100%,6.437% 100%,5.114% 99.782%,3.9% 99.16%,2.816% 98.184%,1.881% 96.905%,1.117% 95.371%,0.543% 93.632%,0.18% 91.739%,0.048% 89.74%,0.167% 87.686%,0.558% 85.626%,8.921% 53.569%,8.921% 53.569%,9.104% 52.78%,9.246% 51.975%,9.346% 51.157%,9.406% 50.332%,9.425% 49.503%,9.402% 48.674%,9.339% 47.85%,9.235% 47.034%,9.089% 46.23%,8.903% 45.443%);
}
.malti-color-list .color-box:nth-child(4n+2) .box .img-shape{
	clip-path: polygon( 0% 22.989%,0% 22.989%,0.173% 19.26%,0.673% 15.722%,1.474% 12.424%,2.547% 9.412%,3.867% 6.733%,5.405% 4.435%,7.135% 2.566%,9.029% 1.172%,11.06% 0.301%,13.201% 0%,86.799% 0%,86.799% 0%,88.94% 0.301%,90.971% 1.172%,92.865% 2.566%,94.595% 4.435%,96.133% 6.733%,97.453% 9.412%,98.526% 12.424%,99.327% 15.722%,99.827% 19.26%,100% 22.989%,100% 49.5%,100% 77.011%,100% 77.011%,99.827% 80.74%,99.327% 84.278%,98.526% 87.576%,97.453% 90.588%,96.133% 93.267%,94.595% 95.564%,92.865% 97.434%,90.971% 98.828%,88.94% 99.699%,86.799% 100%,13.201% 100%,13.201% 100%,11.06% 99.699%,9.029% 98.828%,7.135% 97.434%,5.405% 95.564%,3.867% 93.267%,2.547% 90.588%,1.474% 87.576%,0.673% 84.278%,0.173% 80.74%,0% 77.011%,0% 49.5%,0% 22.989% );
}
.malti-color-list .color-box:nth-child(4n+3) .box .img-shape{
	clip-path: polygon( 0% 49.5%,0% 49.5%,0.373% 41.471%,1.454% 33.854%,3.183% 26.752%,5.503% 20.266%,8.353% 14.498%,11.676% 9.551%,15.413% 5.525%,19.505% 2.524%,23.894% 0.648%,28.52% 0%,71.48% 0%,71.48% 0%,76.106% 0.648%,80.495% 2.524%,84.587% 5.525%,88.324% 9.551%,91.647% 14.498%,94.497% 20.266%,96.817% 26.752%,98.546% 33.854%,99.627% 41.471%,100% 49.5%,100% 49.5%,99.619% 57.691%,98.517% 65.462%,96.752% 72.708%,94.386% 79.325%,91.478% 85.209%,88.088% 90.256%,84.275% 94.363%,80.101% 97.425%,75.623% 99.339%,70.904% 100%,29.096% 100%,29.096% 100%,24.377% 99.339%,19.899% 97.425%,15.725% 94.363%,11.912% 90.256%,8.522% 85.209%,5.614% 79.325%,3.248% 72.708%,1.483% 65.462%,0.381% 57.691%,0% 49.5% );
}
.malti-color-list .color-box:nth-child(4n+4) .box .img-shape{
	clip-path: polygon( 90.264% 66.667%,90.264% 66.667%,91.843% 66.885%,93.341% 67.516%,94.738% 68.527%,96.014% 69.882%,97.148% 71.548%,98.121% 73.49%,98.913% 75.674%,99.504% 78.065%,99.873% 80.63%,100% 83.333%,100% 83.333%,99.873% 86.037%,99.504% 88.601%,98.913% 90.993%,98.121% 93.176%,97.148% 95.118%,96.014% 96.784%,94.738% 98.14%,93.341% 99.15%,91.843% 99.782%,90.264% 100%,9.736% 100%,9.736% 100%,8.157% 99.782%,6.659% 99.15%,5.262% 98.14%,3.986% 96.784%,2.852% 95.118%,1.878% 93.176%,1.087% 90.993%,0.496% 88.601%,0.127% 86.037%,0% 83.333%,0% 83.333%,0.127% 80.63%,0.496% 78.065%,1.087% 75.674%,1.878% 73.49%,2.852% 71.548%,3.986% 69.882%,5.262% 68.527%,6.659% 67.516%,8.157% 66.885%,9.736% 66.667%,9.736% 66.667%,8.157% 66.449%,6.659% 65.817%,5.262% 64.806%,3.986% 63.451%,2.852% 61.785%,1.878% 59.843%,1.087% 57.659%,0.496% 55.268%,0.127% 52.703%,0% 50%,0% 50%,0.127% 47.297%,0.496% 44.732%,1.087% 42.341%,1.878% 40.157%,2.852% 38.215%,3.986% 36.549%,5.262% 35.194%,6.659% 34.183%,8.157% 33.551%,9.736% 33.333%,9.736% 33.333%,8.157% 33.115%,6.659% 32.484%,5.262% 31.473%,3.986% 30.118%,2.852% 28.452%,1.878% 26.51%,1.087% 24.326%,0.496% 21.935%,0.127% 19.37%,0% 16.667%,0% 16.667%,0.127% 13.963%,0.496% 11.399%,1.087% 9.007%,1.878% 6.824%,2.852% 4.882%,3.986% 3.216%,5.262% 1.86%,6.659% 0.85%,8.157% 0.218%,9.736% 0%,90.264% 0%,90.264% 0%,91.843% 0.218%,93.341% 0.85%,94.738% 1.86%,96.014% 3.216%,97.148% 4.882%,98.121% 6.824%,98.913% 9.007%,99.504% 11.399%,99.873% 13.963%,100% 16.667%,100% 16.667%,99.873% 19.37%,99.504% 21.935%,98.913% 24.326%,98.121% 26.51%,97.148% 28.452%,96.014% 30.118%,94.738% 31.473%,93.341% 32.484%,91.843% 33.115%,90.264% 33.333%,90.264% 33.333%,91.843% 33.551%,93.341% 34.183%,94.738% 35.194%,96.014% 36.549%,97.148% 38.215%,98.121% 40.157%,98.913% 42.341%,99.504% 44.732%,99.873% 47.297%,100% 50%,100% 50%,99.873% 52.703%,99.504% 55.268%,98.913% 57.659%,98.121% 59.843%,97.148% 61.785%,96.014% 63.451%,94.738% 64.806%,93.341% 65.817%,91.843% 66.449%,90.264% 66.667% );
}
.malti-color-list .box {
   width: 100%;
   border-radius: 36px;
   padding: 24px;
}
.malti-color-list.boxes .sub-cate-name{
   font-weight: 600;
   font-size: 18px;
   line-height: 122%;
   letter-spacing: 0%;
}
.malti-color-list.boxes .sub-cate-des{
   font-weight: 400;
   font-size: 14px;
   line-height: 150%;
   letter-spacing: 0%;
}
.malti-color-button-box {
   border: 1px solid #000;
   transition: all 0.3s ease-in-out;
   font-weight: 500;
   position: relative;
}
.malti-color-button-box i {
   color: #000;
   transition: all 0.3s ease-in-out;
   opacity: 0;
   position: absolute;
   right: 0px;
}
.malti-color-list .box:hover .malti-color-button-box{
   color: #fff;
   background-color: #000;
   transition: all 0.3s ease-in-out;
}
.malti-color-button-box:hover i,
.malti-color-list .box:hover .malti-color-button-box i{
   color: #fff;
   opacity: 1;
   position: relative;
   transition: all 0.3s ease-in-out;
}
.malti-color-list .box .img-shape img{
   transition: all 0.3s ease-in-out;
}
.malti-color-list .box:hover .img-shape img{
   transform: scale(1.1);
}
.malti-color-list .box.stream-list-lock:after {
    content: '';
    position: absolute;
    left: 0;
    right: 0;
    bottom: 0;
    top: 0;
    background-color: rgba(0, 0, 0, 0.50);
    opacity: 1;
    color: #eca761;
    text-align: center;
    display: flex;
    align-items: end;
    font-size: 20px;
    background-repeat: no-repeat;
    background-position: calc(100% - 22px) calc(100% - 34px);
    width: 100%;
    height: 100%;
}

.eventsList.past-event.stream-list-lock:after {
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   top: 0;
   background-color: rgba(0, 0, 0, 0.50);
   opacity: 1;
   /* font-family: 'PhpDebugbarFontAwesome'; */
   color: #eca761;
   text-align: center;
   display: flex;
   align-items: end;
   /* justify-content: center; */
   font-size: 20px;
   /* padding: 20px 15px; */
   background-image: url(../img/Lock.svg);
   background-repeat: no-repeat;
   background-position: calc(100% - 10px) calc(100% - 25px);
}

.daily-quiz-title {
   display: -webkit-box !important;
  -webkit-line-clamp: 1;
  -webkit-box-orient: vertical;
  overflow: hidden;
}

.weekly-loader,.industry-loader {
    color: #F48020;
}

.assessment-card {
   border-radius: 15px;
   box-shadow: 0 2px 8px rgba(0,0,0,0.1);
   overflow: hidden;
   margin-bottom: 20px;
   display: flex;
   flex-wrap: wrap;
   align-items: center;
   justify-content: space-between;
   background-color: #fff;
   padding: 0;
}
.assessment-card img {
   width: 310px;
   min-height: 140px;
   border-radius: 100px 0 0 100px;
   object-fit: cover;
}
@media(max-width:640px){
   .assessment-card img {
      width: 100%;
      min-height: inherit;
      border-radius: 10px;
   }
}
.assessment-info {
   flex: 1;
   padding: 20px;
}
.assessment-title {
   font-size: 1.2rem;
   font-weight: 600;
   margin-bottom: 10px;
}
.btn-start {
   background-color: #ffe6cc;
   color: #ff8c00;
   border: none;
   border-radius: 20px;
   padding: 6px 18px;
   font-weight: 500;
   transition: all 0.3s ease;
}
.btn-start:hover {
   background-color: #ff8c00;
   color: #fff;
}
.assessment-card {
   border-radius: 10px;
}
.grade-dropdown-btn {
   border-radius: 50px;
   font-weight: 500;
   color: #333;
   padding: 5px 15px;
   border: 1px solid #ddd;
   background-color: #f8f9fa;
   transition: all 0.3s ease;
}
.grade-dropdown-btn:hover,
.grade-dropdown-btn:focus {
   background-color: #e9ecef;
   color: #000;
}
.assessment-title {
   font-weight: 700;
   color: #000;
   margin-bottom: 20px;
}
.assessment-title .highlight {
   color: #ff6600;
}
.assessment-tab .pageTitle {
   background-color: white; 
   padding-top: 0.5rem;     
   padding-bottom: 0.5rem; 
}

.content .content-ninja-verified {
   color:#00ff66; 
   font-size:16px;   
}

.student-badges-section .badge-box-height h6 span, .student-badges-section .badge-box-height h6 p {
    font-size: 14px;
    margin-bottom: 0;
}
.student-badges-section .bg_brick_orange .badge-box-height .badge img {
   max-height: 50px;
}

.assignment-worksheet-lock {
   position: relative;
   overflow: hidden;
}
.assignment-worksheet-lock:after {
   content: '';
   position: absolute;
   left: 0;
   right: 0;
   bottom: 0;
   top: 0;
   background-color: rgba(0, 0, 0, 0.50);
   opacity: 1;
   /* font-family: 'PhpDebugbarFontAwesome'; */
   color: #eca761;
   text-align: center;
   display: flex;
   align-items: end;
   /* justify-content: center; */
   font-size: 20px;
   /* padding: 20px 15px; */
   background-image: url(../img/Lock.svg);
   background-repeat: no-repeat;
   background-position: calc(100% - 10px) calc(100% - 25px);
}

.how-works-btn:hover {
    color: #fff
}

/* 28 Oct */
.project_theme_badge{
   gap: 15px;
}
.project_theme_badge .btn {
   width: calc(20% - 12px);
   border: 2px solid #E5E7EB;
   border-radius: 16px;
   padding: 12px 17px;
   font-size: 16px;
   letter-spacing: 0px;
   text-align: center;
   color: #364153;
   position: relative;
   transition: 0.5s;
}
@media(max-width: 1399px){
   .project_theme_badge .btn {
      width: calc(25% - 12px);
   }
}
@media(max-width: 1199px){
   .project_theme_badge .btn {
      width: calc(33.33% - 12px);
   }
}
@media(max-width: 767px){
   .project_theme_badge .btn {
      width: calc(50% - 12px);
   }
}
@media(max-width: 460px){
   .project_theme_badge .btn {
      width: calc(100%);
   }
}
.project_theme_badge .btn:after{
   content: "\f058";
   font-family: "Font Awesome 5 Free";
   position: absolute;
   top: 2px;
   right: 2px;
   font-size: 16px;
   transition: 0.5s;
   width: 26px;
   height: 26px;
   line-height: 26px;
   background-color: #fff;
   border-radius: 50%;
   transform: scale(0);
}
.project_theme_badge .btn.active:after{
   transform: scale(1);
}

.project_theme_badge .btn.active:nth-child(1n+1), 
.project_theme_badge .btn:nth-child(1n+1):hover{
   border-color: #00A6F4;
   background-color: #F0F9FF;
   color: #0069A8;
   box-shadow: 0px 13.17px 19.75px -3.95px #0000001A;

}
.project_theme_badge .btn.active:nth-child(2n+2), 
.project_theme_badge .btn:nth-child(2n+2):hover{
   border-color: #FF6900;
   background-color: #FFF7ED;
   color: #CA3500;
   box-shadow: 0px 13.17px 19.75px -3.95px #0000001A;
}
.project_theme_badge .btn.active:nth-child(3n+3),
.project_theme_badge .btn:nth-child(3n+3):hover{
   border-color: #00C950;
   background-color: #F0FDF4;
   color: #008236;
   box-shadow: 0px 13.17px 19.75px -3.95px #0000001A;
}
.project_theme_badge .btn.active:nth-child(4n+4),
.project_theme_badge .btn:nth-child(4n+4):hover{
   border-color: #F0B100;
   background-color: #FEFCE8;
   color: #A65F00;
   box-shadow: 0px 13.17px 19.75px -3.95px #0000001A;
}

.add_project_heading .icon {
    width: 52px;
    height: 52px;
    display: flex;
    align-items: center;
    justify-content: center;
    border-radius: 50%;
    background-color: #f1f1f1;
}
.add_project_heading .icon img{
   width: 28px;
}

.add_project_heading .icon.project_details{
   background-color: #DBEAFE;
}
.add_project_heading .icon.project_overview{
   background-color: #F3E8FF;
}
.add_project_heading .icon.step_by_step_process{
   background-color: #DCFCE7;
}
.add_project_heading .icon.reflections_challenges{
   background-color: #FFEDD4;
}

.icon_text h4 {
    font-weight: 500;
    font-size: 20px;
    line-height: 20px;
    letter-spacing: -0.41px;
    margin: 0;
    color: #0A0A0A;
}
.icon_text p {
    font-weight: 400;
    font-size: 20px;
    line-height: 31.55px;
    letter-spacing: -0.41px;
    color: #717182;
    margin-bottom: 0;
}
.card .add_project_heading {
    width: 100%;
    display: flex;
    gap: 15px;
    align-items: center;
}
.icon_text {
    width: calc(100% - 70px);
}
.font-medium{
   font-weight: 500 !important;
}
.new-text .form-control{
   background-color: #F3F3F5;
   border: 0;
}
.upload-section h4 {
  font-weight: 600;
  font-size: 16px;
  margin-bottom: 10px;
  color: #111;
}

.upload-section .upload-box {
  border: 2px solid #e1e4e8;
  border-radius: 8px;
  background-color: #fafbfc;
  height: 200px;
  display: flex;
  align-items: center;
  justify-content: center;
  text-align: center;
  transition: border-color 0.3s ease;
}

.upload-section .upload-box:hover {
  border-color: #0078d4;
}

.upload-section .upload-content {
  color: #444;
}

.upload-section .upload-icon {
  font-size: 28px;
  color: #0078d4;
  margin-bottom: 8px;
}

.upload-section .choose-file {
  color: #0078d4;
  font-weight: 500;
  cursor: pointer;
}

.upload-section small {
  color: #6b6b6b;
  display: block;
  margin-top: 4px;
  font-size: 13px;
}

.btn-gradiant{
   background: linear-gradient(100.76deg, #FFC800 7.3%, #FF7D00 29.91%);
}
.swiper.about_project_slider {
    height: 300px;
}
.about_project_slider .image {
   width: 100%;
   height: 100%;
   border-radius: 16px;
}
.about_project_slider .image img{
   width: 100%;
   height: 100%;
   object-fit: cover;
   border-radius: 16px;
}
.discription p{
   color: #4A5565;
}
.add_project_heading .icon.project_details.green{
   background-color: #DCFCE7;
}
.light-gradiant{
   background: linear-gradient(130.32deg, #FFECDB 6.24%, #FFCFA8 91.11%) !important;
}
.success-badge img {
   width: 16px;
}
.card .success-badge span.text-success {
    background-color: #fff;
    display: inline-flex;
    align-items: center;
    margin-left: auto;
    width: auto;
    gap: 5px;
    padding: 5px 15px;
    border-radius: 20px;
    font-size: 13px;
}
.prj_detail_img {
   position: absolute;
   top: auto;
   z-index: -1;
   bottom: -20px;
}
.light-gradiant-card {
   text-align: center;
   margin-top: 22px;
}
.success-badge {
   position: relative;
   z-index: 4;
}
.light-gradiant-card {
   text-align: center;
   margin-top: 22px;
   position: relative;
   z-index: 1;
}

.light-gradiant-card h2 {
   font-weight: 700;
   font-size: 40px;
   line-height: 50px;
   letter-spacing: 0px;
   text-align: center;
   margin-bottom: 0;
}
.light-gradiant-card span {
    font-weight: 400;
    font-size: 20px;
    line-height: 20px;
    letter-spacing: 0px;
    text-align: center;
    color: #FF7D00;
}
/* feedback form */
:root {
  --bg-light: #fff;
  --bg-soft: #f8f8fc;
  --border: #e5e6ef;
  --text-dark: #222;
  --text-muted: #666;
  --accent-blue: #DBEAFE;
  --accent-sky-blue: #DFF2FE;
  --accent-red: #FFEDD4;
  --accent-yellow: #FEF3C6;
  --radius: 14px;
}

.feedback-modal {
    background: linear-gradient(180deg, #fff 0%, #fff8f3 100%);
    width: 100%;
    border-radius: var(--radius);
    box-shadow: 0 4px 20px rgba(0, 0, 0, 0.1);
    padding: 0;
    display: flex;
    flex-direction: column;
    gap: 24px;
}

/* Header */
.feedback-header h2 {
  margin: 0;
  font-size: 1.6rem;
}
.feedback-header p {
  margin: 4px 0 0;
  color: var(--text-muted);
}

/* Teacher info */
.teacher-info {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 14px 20px;
    background-color: #fff;
    border-radius: 10px;
    box-shadow: 0px 1.34px 2.68px -1.34px #0000001A;

}
.teacher-name {
  display: flex;
  align-items: center;
  gap: 12px;
}
.avatar {
    background: #FCECE1;
    color: #FF7D00;
    font-weight: 600;
    font-size: 1rem;
    width: 42px;
    height: 42px;
    display: flex;
    justify-content: center;
    align-items: center;
    border-radius: 50%;
}
.name {
  font-weight: 600;
  margin: 0;
}
.date {
    font-size: 0.85rem;
    color: var(--text-muted);
    margin: 0;
    display: flex;
    align-items: center;
    gap: 3px;
}
.date svg {
    width: 18px;
}
.score-box {
  background: #FDC700;
  box-shadow: 0px 2.68px 5.35px -2.68px #0000001A;
  box-shadow: 0px 5.35px 8.03px -1.34px #0000001A;
  border-radius: 10px;
  padding: 10px 20px;
  font-weight: bold;
  font-size: 1.2rem;
}

/* Feedback sections */

.light-orange-gradiant{
   background: linear-gradient(135deg, #FDF7F0 0%, #FCE6DC 50%, #FDF6EC 100%);
}
.feedback-section {
    background: var(--bg-light);
    border: 1px solid var(--border);
    border-radius: var(--radius);
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 40px;
    margin-bottom: 30px;
}
.feedback-section:last-child{
   margin-bottom: 0;
}


.feedback-section .section-header {
  display: flex;
  align-items: center;
  justify-content: space-between;
}
.feedback-header {
    display: flex;
    align-items: center;
    gap: 15px;
}
.feedback-section .section-header h3 {
  margin: 0;
  flex: 1;
  font-size: 1.1rem;
}
.feedback-section .section-header .icon {
    width: 72px;
    height: 72px;
    border-radius: 16px;
    box-shadow: 0px 5.21px 7.82px -1.3px #0000001A;
    display: flex;
    align-items: center;
    justify-content: center;
}
.icon.blue { background: var(--accent-blue); }
.icon.sky-blue { background: var(--accent-sky-blue); }
.icon.red { background: var(--accent-red); }
.icon.yellow { background: var(--accent-yellow); }


.level-tag {
    background: #ffeedd;
    padding: 8px 17px;
    border-radius: 10px;
    font-weight: 600;
}
.feedback-section.blue-box .level-tag{
   background: #DBEAFE;
   color: #1447E6;
}
.feedback-section.sky-blue-box .level-tag{
   background: #DFF2FE;
   color: #0069A8;
}
.feedback-section.orange-box .level-tag{
   background: #FFEDD4;
   color: #CA3500;
}

.feedback-section .rating {
  display: flex;
  flex-wrap: wrap;
  gap: 15px;
}
.rating button {
    border: 1px solid var(--border);
    background: var(--bg-soft);
    cursor: pointer;
    font-size: 0.85rem;
    color: #99A1AF;
    width: calc(25% - 12px);
    border-radius: 22px;
    border-width: 2.61px;
    padding: 20px 45px 20px 20px;
    text-align: left;
    position: relative;
}
@media(max-width: 767px){
   .rating button {
      width: calc(50% - 12px);
   }
}
@media(max-width: 475px){
   .rating button {
      width: calc(100% - 0px);
   }
}
.rating button.active {
    background: #DCFCE7;
    border-color: #7BF1A8;
    color: #008236;
    font-weight: 600;
    box-shadow: 0px 5.21px 7.82px -5.21px #0000001A;
    background-image: url("../img/check-icon.svg");
    background-repeat: no-repeat;
    background-position: calc(100% - 22px) center;
    background-size: 20px;
}
.rating button.active:after {
    content: '';
    width: 32px;
    height: 32px;
    background-color: #00C950;
    border-radius: 50%;
    position: absolute;
    top: -10px;
    right: -10px;
    background-image: url(../img/star.svg);
    background-position: center;
    background-size: 18px;
    background-repeat: no-repeat;
}
.graph-title {
    display: flex;
    align-items: center;
    gap: 13px;
}
.graph-title h5 {
    margin: 0;
}
.graph-title img {
    width: 23px;
}
.chart-box {
    border: 2px solid #E5E7EB;
    background: #fff;
    border-radius: 10px;
    padding: 20px;
}
.feedback-header .icon img {
    height: 36px;
}
@media(max-width: 767px){
   .section-header .icon {
      width: 50px;
      height: 50px;
   }
   .feedback-header .icon img {
      height: 20px;
   }
}
.comment {
  background: #f8faff;
  padding: 20px;
  border-radius: 8px;
  color: #364153;

}
.feedback-section.blue-box .comment{
   border: 2.61px solid #DBEAFE;
   background: linear-gradient(135deg, #EFF6FF 0%, #EEF2FF 100%);
}
.feedback-section.sky-blue-box .comment{
   border: 2.61px solid #DFF2FE;
   background: linear-gradient(135deg, #F0F9FF 0%, #ECFEFF 100%);
}
.feedback-section.orange-box .comment{
   border: 2.61px solid #FFEDD4;
   background: linear-gradient(135deg, #FFF7ED 0%, #FFFBEB 100%);

}

.teacher-note .feedback-section {
   background: linear-gradient(135deg, #FFFBEB 0%, #FEFCE8 50%, #FFF7ED 100%);

}
.teacher-note .feedback-section  p.comment {
    border: 2.61px solid #FEE685;
    font-style: Italic;
}

/* Teacher’s Note */
.teacher-note h4 {
  margin-bottom: 8px;
}

.project-file-upload .choose-file {
    font-weight: 600;
    margin: 0;
}

.project-file-upload .selected-file-info {
    padding: 10px;
    background-color: #e9ecef;
    border-radius: 5px;
}

.project-file-upload .file-name {
    font-size: 14px;
    color: #495057;
    font-weight: 500;
}

.project-file-upload .upload-item {
    position: relative;
}

.project-file-upload .file-type-badge {
    position: absolute;
    top: 10px;
    right: 10px;
    padding: 4px 8px;
    border-radius: 4px;
    font-size: 12px;
    font-weight: 600;
    z-index: 10;
}

.project-file-upload .badge-image {
    background-color: #007bff;
    color: white;
}

.project-file-upload .badge-video {
    background-color: #dc3545;
    color: white;
}

.project-file-upload .badge-pdf {
    background-color: #28a745;
    color: white;
}

.spider-chart-container {
    position: relative;
    height: 300px;
    width: 100%;
}

.spider-chart-container canvas {
    max-height: 300px !important;
}

/* Responsive adjustments */
@media (max-width: 991px) {
    .spider-chart-container {
        height: 250px;
    }
    
    .spider-chart-container canvas {
        max-height: 250px !important;
    }
}

@media (max-width: 767px) {
    .spider-chart-container {
        height: 200px;
    }
    
    .spider-chart-container canvas {
        max-height: 200px !important;
    }
}

.existing-file-item {
    background-color: #f8f9fa;
    transition: all 0.3s ease;
}
.existing-file-item:hover {
    background-color: #e9ecef;
}
.existing-file-item .badge {
    font-size: 0.75rem;
    padding: 0.35rem 0.65rem;
}
.existing-file-item .file-name {
    font-size: 0.9rem;
    color: #495057;
    font-weight: 500;
}
#filePreviewModal .modal-body img {
    max-width: 100%;
    height: auto;
}
#filePreviewModal .modal-body embed {
    width: 100%;
    height: 600px;
}
#filePreviewModal .modal-body iframe {
    width: 100%;
    height: 600px;
    border: none;
}

.btn-draft-active {
    border: 2px solid green !important;
    color: green !important;
    font-weight: 600;
}

.project-status {
   display: flex;
   flex-wrap: wrap;
   gap: 10px;
   width: 100%;
}

.project-status a,
.project-status .btn {
   font-size: 12px;
   text-decoration: none;
}