@import url('https://fonts.googleapis.com/css2?family=Kumbh+Sans:wght@100..900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Lexend+Deca:wght@100..900&display=swap');

:root {
  /*SEARCH_BAR*/
  --color-black: hsl(0, 0%, 10%);
  --color-darks: hsl(0, 0%, 20%);
  --color-greys: hsl(0, 0%, 80%);
  --color-light: hsl(0, 0%, 96%);
  --color-white: hsl(0, 0%, 100%);
  --color-blues: hsl(217, 91%, 60%);

  --shadow-small: 0 1px 3px 0 rgba(0, 0, 0, 0.1),
     0 1px 2px 0 rgba(0, 0, 0, 0.06);
  --shadow-medium: 0 4px 6px -1px rgba(0, 0, 0, 0.1),
     0 2px 4px -1px rgba(0, 0, 0, 1);
  --shadow-large: 0 10px 15px -3px rgba(0, 0, 0, 0.1),
     0 4px 6px -2px rgba(0, 0, 0, 0.05);

  /*TABLE*/
  --bg-color: #f2f6f9;
  --active-color: #25be64;
  --inactive-color: #dadde4;
  --new-color: #febf02;
  --text-color: #141a4e;
  --table-bg-color: #fefefe;
  --table-head-bg-color: #4ecdc4; /*#e1e8f2;*/
  --table-border-color: #edeef2;
  --hover-bg-color: #c3f1ff;
  --hover-text-color: #545454;

  /*SUBJECT_SELECT*/
  --gray: #34495e;
  --darkgray: #2c3e50;
}

/*https://codepen.io/nelledejones/pen/gOOPWrK*/
.bounce-in {
    animation: bounce-in 2s ease 1;
}
@keyframes bounce-in {
    0% {
        opacity: 0;
        transform: scale(.3);
    }
    50% {
        opacity: 1;
        transform: scale(1.11);
    }
    70% { transform: scale(.9); }
    100% { transform: scale(1); }
}

/*
PROGRESS BARS
*/
/*https://codepen.io/chriscoyier/pen/eYBOvJB*/
.meter {
    box-sizing: content-box;
    height: 50px; /* Can be anything */
    position: relative;
    margin: 1% 2%; /* Just for demo spacing */
    background: #555;
    border-radius: 25px;
    padding: 10px;
    box-shadow: inset 0 -1px 1px rgba(255, 255, 255, 0.3);
  }
  .meter > span {
    display: block;
    height: 100%;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    background-color: rgb(43, 194, 83);
    background-image: linear-gradient(
      center bottom,
      rgb(43, 194, 83) 37%,
      rgb(84, 240, 84) 69%
    );
    box-shadow: inset 0 2px 9px rgba(255, 255, 255, 0.3),
      inset 0 -2px 6px rgba(0, 0, 0, 0.4);
    position: relative;
    overflow: hidden;
    /*MINE*/
    font-weight: bold;
    font-family: 'Shantell Sans', cursive;
    font-size:1.5rem;
  }
  .meter > span:after,
  .animate > span > span {
    content: "";
    position: absolute;
    top: 0;
    left: 0;
    bottom: 0;
    right: 0;
    background-image: linear-gradient(
      -45deg,
      rgba(255, 255, 255, 0.2) 25%,
      transparent 25%,
      transparent 50%,
      rgba(255, 255, 255, 0.2) 50%,
      rgba(255, 255, 255, 0.2) 75%,
      transparent 75%,
      transparent
    );
    z-index: 1;
    background-size: 50px 50px;
    animation: move 2s linear infinite;
    border-top-right-radius: 8px;
    border-bottom-right-radius: 8px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
    overflow: hidden;
  }
  
  .animate > span:after {
    display: none;
  }
  
  @keyframes move {
    0% {
      background-position: 0 0;
    }
    100% {
      background-position: 50px 50px;
    }
  }
  
  .orange > span {
    background-image: linear-gradient(#f1a165, #fb791c);
  }
  
  .red > span {
    background-image: linear-gradient(#f0a3a3, #f42323);
  }

  .loading-mtr > span {
    background-color: rgb(1 188 229);
  }
  
  
  .nostripes > span > span,
  .nostripes > span::after {
    background-image: none;
  }


  /* MODAL CONTROLLER*/
  /*https://codepen.io/Mosalev/pen/JZqNNx*/
  .blur{
    -webkit-filter: blur(2px);
    -moz-filter: blur(2px);
    -o-filter: blur(2px);
    -ms-filter: blur(2px);
    filter: blur(2px);
  }
  body .esmk-modal-wrapper{
    width:100%;
    height:100%;
    position:fixed;
    top:0; left:0;
    background:rgba(255,257,153,0.35);
    visibility:hidden;
    opacity:0;
    -webkit-transition: all 0.25s ease-in-out;
    -moz-transition: all 0.25s ease-in-out;
    -o-transition: all 0.25s ease-in-out;
    transition: all 0.25s ease-in-out;
    z-index:1000;
  }
  
  .esmk-modal-wrapper.open{
    opacity:1;
    visibility:visible;
  }
  
  .esmk-modal{
    width:600px;
    height:500px;
    display:block;
    margin:50% 0 0 -300px;
    position:relative;
    top:50%; left:50%;
    background:#fff;
    opacity:0;
    -webkit-transition: all 0.5s ease-in-out;
    -moz-transition: all 0.5s ease-in-out;
    -o-transition: all 0.5s ease-in-out;
    transition: all 0.5s ease-in-out;
    z-index:1000;
  }
  
  .esmk-modal-wrapper.open .esmk-modal{
    margin-top:-300px;
    opacity:1;
  }
  
  .esmk-head{
    width:100%;
    height: 57px;
    padding: 2% 0%;
    overflow:hidden;
    background:#01bce5;
  }
  
  .esmk-btn-close{
    width:32px;
    height:32px;
    display:block;
    float:right;
    margin-right: 5%;
  }
  
  .esmk-btn-close::before, .esmk-btn-close::after{
    content:'';
    width:32px;
    height:6px;
    display:block;
    background:#fff;
  }
  
  .esmk-btn-close::before{
    margin-top:12px;
    -webkit-transform:rotate(45deg);
    -moz-transform:rotate(45deg);
    -o-transform:rotate(45deg);
    transform:rotate(45deg);
  }
  
  .esmk-btn-close::after{
    margin-top:-6px;
    -webkit-transform:rotate(-45deg);
    -moz-transform:rotate(-45deg);
    -o-transform:rotate(-45deg);
    transform:rotate(-45deg);
  }
  
  .esmk-content{
    padding:5%;
  }

  /*TEAM MODAL*/
  .blur-tm{
    -webkit-filter: blur(0px);
    -moz-filter: blur(0px);
    -o-filter: blur(0px);
    -ms-filter: blur(0px);
    filter: blur(0px);
  }

  .esmk-content .mdl-not-cntr.team-disp-ovrd{
    font-family: 'Work Sans', sans-serif;
    font-size: 1.1rem;
  }
  .esmk-content .esmk-cncl-btn.ovrd-team{
    font-family: 'Work Sans', sans-serif;
    font-size: 1.1rem;
  }

  .team-modal_def_values {
    height: 672px;
    width: 1110px;
    left: 38%;
    top:41%;
  }

  /*audio visualizer*/
  .visual-loader {
    margin: 0 0 2em;
    width: 35%;
    text-align: center;
    padding: 1em;
    margin: 0 auto 1em;
    vertical-align: top;
  }
  /*
    Set the color of the icon
  */
  .visual-loader svg path,
  .visual-loader svg rect {
    fill: #FF6700;
  }

  /*LOADER CIRCLE*/
  .loading-loader {
    margin: 0 0 2em;
    width: 70%;
    text-align: center;
    padding: 1em;
    margin: 0 auto 1em;
    vertical-align: top;
    display: none;
  }


  /* ANIMATED COUNTER FOR COMPETENCY SCORE*/
  #pointdisplay {
    font-size: 5rem; /*100px;*/
    /*height: 300px;
    width: 300px;
    */
    height: 215px;
    width: 215px;
    margin-left: 10px;/*-150px;*/
    margin-top: 25px;
    /*left: 50%;*/
    border-radius: 50%;
    overflow: hidden;
    position: relative;
    z-index: 1;
  }
  
  #pointdisplay .pointer {
    width: 150px;
    height: 150px;
    position: absolute;
    transform-origin: 100% 100%;
  }
  
  #pointdisplay .cover {
    position: absolute;
    width: 166px; /*290px;*/
    height: 171px; /*290px;*/
    border-radius: 50%;
    top: 21px; /*5px;*/
    left: 27px; /*5px;*/
    background-color: #e8e8e8;
  }
  
  #pointdisplay p {
    background: linear-gradient(to right, #21304D 20%, #00858e 80%), #222;
    -webkit-background-clip: text;
    background-clip: text;
    -webkit-text-fill-color: transparent;
    /*line-height: 200px;*/
    text-align: center;
    font-family: 'Roboto Condensed', sans-serif;
    /*width: 200px;
    height: 200px;*/
    margin: 41px 0 0 6px;
    border-radius: 50%;
    position: relative;
  }

  .modal-mplt-btn-main{
    width: 98%;
    padding: 4% 0%;
    color: #2c2c2c !important;
  }

  /*MODAL*/
.modal_def_values{
	height:500px;
	width:600px;
	left:50%
}
.modal_large_values{
	height:600px;
	width:900px;
	left:44%
}
.modal_def_values_zoo_mgr{
	height: 600px;
	width: 900px;
	left: 44%;
}

.modal_def_values_zoo_mgr_btn{
	font-size: 2.5rem;
	padding: 3% 9%;
	color: #000;
}

.sch-ovr-cls-mrg{
  margin-top: 0;
}
.sch-ovr-cls-mrg .bba-content-body-container>div {
  float: none;
}
.sch-ovr-cls-mrg .sch-dsb-mn-cntr{
  display: flex;
}
.sch-ovr-cls-mrg .bba-left-nav {
  width: 20%;
  margin-top: 0%;
  padding-left: 0%;
  border: none;
}
.sch-ovr-cls-mrg .bba-left-nav .ui-2-nav-bar-left{
  padding-left: 3%;
  border: solid thin #dfdede;
}
.sch-ovr-cls-mrg .bba-usr-dashboard-body {
  margin-left: 0%;
  margin-top: 0%;
  padding: 0% 5%;
  width: 72%;
  background-color: #9797970f;
  border: none;
}
.sch-lg-cntr{
  display: flex;
  justify-content: center;
  margin: 6% 0%;
}
.sch-ovr-cls-mrg .lc-banner-text{
  font-family: 'Source Sans Pro', sans-serif;
  line-height: 1.8;
}
.sch-ovr-cls-mrg .bba-usr-itm.bba-usr-mcrs {
  background-color: #97979700;
}
.sch-dsb-mn-bdy{
  margin: 3% 0%;
  border-radius: 15px;
  padding: 3% 1%;
}
.cls-ovr-vw-cntr{
  display: flex;
  justify-content: space-between;
  flex-wrap: wrap;
}
.cls-ovr-vw-cntr>div{
  background-color: #ffffff;
  width: 25%;
  border-radius: 15px;
  display: flex;
  align-items: center;
  padding: 1% 2%;
}
.cls-ovr-vw-cntr>div>div{
  display: flex;
  flex-direction: column;
}
.sch-std-img{
  width: 40%;
}
.sch-std-img img{
  max-width: 100%;
  height: auto;
}
.sch-std-counter-cntr{
  width: 60%;
}
.sch-std-cnt{
  display: block;
  text-align: center;
  font-weight: bold;
  font-size: 2.5rem;
}
.sch-std-tag{
  font-size: 0.9rem;
  display: block;
  text-align: center;
  color: #626262;
}

.cls-ovr-pfr-cntr{
  margin-top: 5%;
  background-color: #ffffff;
  border-radius: 15px;
}
.cls-ovr-pfr-bdy{
  display: flex;
  padding: 1% 2%;
  align-items: center;
}
.pfm-hdr-cntr{
  width: 30%;
}
.pfm-hdr-cntr span{
  font-weight: bold;
  color: #2c2c2c;
}
.pfm-sel-cntr{
  width: 70%;
  display: flex;
  justify-content: flex-end;
  align-items: center;
}
/* dropdown*/
.months-wrapper-dropdown, .years-wrapper-dropdown {
  position: relative;
  
  display: inline-block; 
  min-width: 145px;
  padding: 0 5px 0 15px;
  
  border-radius: 10px;
  background: rgba(255, 255, 255, 0.8);
  box-shadow: 0 2px 2px 0 rgba(0 ,0 , 0, .14), 0 3px 1px -2px rgba(0, 0, 0, .12), 0 1px 5px 0 rgba(0, 0, 0, .2);
  
  text-align: left;
  line-height: 45px;
  color: #444;
  
  cursor: pointer;
  
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  margin: 0% 2%;
}

.months-wrapper-dropdown::before, .years-wrapper-dropdown::before {
  content: '';
  position: absolute;
  top: 50%;
  right: 16px;
  
  margin-top: -2px;
  width: 0;
  height: 0;
  
  border-width: 6px 6px 0 6px;
  border-style: solid;
  border-color: #a0a0a0 transparent;
}

.months-wrapper-dropdown.active::before, .years-wrapper-dropdown.active::before {
  border-width: 0 6px 6px 6px;
}

.months-wrapper-dropdown .dropdown, .years-wrapper-dropdown .dropdown {
  position: absolute;
  top: 140%;
  right: 0;
  left: 0;
  
  margin: 0;
  padding: 0;
  
  list-style: none;
  
  border-radius: inherit;
  box-shadow: inherit;
  background: #ffffff; /*inherit;*/
  
  -webkit-transition: .5s ease;
  -moz-transition: .5s ease;
  -ms-transition: .5s ease;
  transition: .5s ease;
  
  -webkit-transform: scaleY(0);
  -moz-transform: scaleY(0);
  -ms-transform: scaleY(0);
  transform: scaleY(0);
  
  -webkit-transform-origin: top;
  -moz-transform-origin: top;
  -ms-transform-origin: top;
  transform-origin: top;
  
  -webkit-user-select: none;
  -moz-user-select: none;
  -ms-user-select: none;
  user-select: none;
  
  opacity: 0;
  visibility: hidden;
}

.months-wrapper-dropdown .dropdown li, .years-wrapper-dropdown .dropdown li {
  padding: 0 15px;
  border-bottom: 1px solid rgba(255, 255, 255, .2);
  overflow: hidden;
  
  -webkit-transition: .5s ease;
  -moz-transition: .5s ease;
  -ms-transition: .5s ease;
  transition: .5s ease;
}

.months-wrapper-dropdown .dropdown li:last-child, .years-wrapper-dropdown .dropdown li:last-child {
  border-bottom: none;
}

.months-wrapper-dropdown .dropdown li:hover, .years-wrapper-dropdown .dropdown li:hover {
  background: rgba(197, 239, 247, .55);
}

.months-wrapper-dropdown.active .dropdown, .years-wrapper-dropdown.active .dropdown {
  opacity: 1;
  visibility: visible;
  
  -webkit-transform: scaleY(1);
  -moz-transform: scaleY(1);
  -ms-transform: scaleY(1);
  transform: scaleY(1);
  z-index: 1000;
}

.day-sel-cntr{
  line-height: 45px;
  border-radius: 10px;
  padding: 0 15px;
}
.month-sel-cntr{
  line-height: 45px;
  border-radius: 10px;
  padding: 0 15px;
}

.selector-active{
  border: solid thin #D30B0B;
}
#chart_class_performance{
  padding: 1%;
}
.graph-pfm-cntr{
  display: flex;
  justify-content: space-between;
  margin-top: 5%;
  flex-wrap: wrap;
}
.graph-pfm-cntr>div{
  width: 45%;
}

.sch-std-mn-bdy-ctr{
  margin-top: 2%;
  background-color: #ffffff;
  padding: 2% 1%;
  border-radius: 15px;
}
.cntr-std-hdr-cntrl{
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.add-std-mn-cntr{
  display: flex;
  justify-content: flex-end;
  width: 70%;
}
.add-std-mn-cntr>div{
  padding: 2% 4%;
  border-radius: 15px;
}
.std-db-hdr-cntr{
  width: 30%;
  font-family: "Kumbh Sans", serif;
}
.add-std-ndl-cntr{
  border: solid thin #21304D;
  margin-right: 5%;
  display: flex;
  justify-content: space-between;
  align-items: center;
}
.add-std-blk-cntr{
  background-color: #21304D;
  color: #ffffff;
  display: flex;
  justify-content: space-between;
  align-items: center;
  cursor: pointer;
}
.add-std-ndl-cntr>span{
  display: inline-block;
  font-family: "Kumbh Sans", serif;
}

/* Student search bar */
.search-box-cntr *,
.search-box-cntr *::before,
.search-box-cntr *::after {
  padding: 0;
  margin: 0;
  box-sizing: border-box;
  list-style: none;
  list-style-type: none;
  text-decoration: none;
  -webkit-font-smoothing: antialiased;
  -moz-osx-font-smoothing: grayscale;
  text-rendering: optimizeLegibility;
}
.std-search-section {
  margin: 0 auto;
  padding: 2rem 0 2rem;
}

.std-search-container {
  max-width: 40rem;
  height: auto;
  /*margin: 0 auto;
  padding: 0 1.25rem;*/
}

.std-search-centered {
  margin-bottom: 1rem;
  text-align: center;
  vertical-align: middle;
}

.std-search-form-group {
  position: relative;
}

.std-search-form-arrow {
  position: absolute;
  top: 0.65rem;
  right: 0.5rem;
  z-index: 10;
  font-size: 1.35rem;
  line-height: inherit;
  color: var(--color-darks);
  pointer-events: none;
}

.std-search-form .std-search-dropdown {
  position: relative;
}

.std-search-form .std-search-dropdown-select {
  position: relative;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  cursor: pointer;
  user-select: none;
  width: 100%;
  height: auto;
  padding: 0.75rem 1.25rem;
  border: none;
  outline: none;
  border-radius: 0.25rem;
  color: var(--color-black);
  background-clip: padding-box;
  background-color: var(--color-white);
  box-shadow: var(--shadow-medium);
  transition: all 0.3s ease-in-out;
}

.std-search-form .std-search-dropdown-menu {
  position: absolute;
  display: none;
  top: 100%;
  left: 0;
  width: 100%;
  z-index: 10;
  border-radius: 0.25rem;
  background-color: var(--color-white);
  box-shadow: var(--shadow-large);
  transition: all 0.3s ease-in-out;
}

.std-search-form .std-search-dropdown-menu-inner {
  max-height: 16rem;
  overflow-y: scroll;
  overflow-x: hidden;
}

.std-search-form .std-search-dropdown-menu-inner::-webkit-scrollbar {
  width: 5px;
  height: auto;
}

.std-search-form .std-search-dropdown-menu-inner::-webkit-scrollbar-thumb {
  border-radius: 0.25rem;
  background-color: var(--color-greys);
  box-shadow: var(--shadow-small);
}

.std-search-form .std-search-dropdown-menu-item {
  font-family: inherit;
  font-size: 1rem;
  font-weight: normal;
  line-height: inherit;
  cursor: pointer;
  user-select: none;
  padding: 0.65rem 1.25rem;
  background-color: var(--color-white);
  transition: all 0.2s ease-in-out;
}

.std-search-form .std-search-dropdown-menu-item:hover {
  color: var(--color-black);
  background-color: var(--color-greys);
}

.std-search-form .std-search-dropdown-menu-item.std-search-is-select,
.std-search-form .std-search-dropdown-menu-item.std-search-is-select:hover {
  color: var(--color-white);
  background-color: var(--color-blues);
}

.std-search-form .std-search-dropdown-menu-search {
  display: block;
  font-family: inherit;
  font-size: 1rem;
  font-weight: 400;
  line-height: 1.5;
  width: 100%;
  height: auto;
  padding: 0.65rem 1.25rem;
  border: none;
  outline: none;
  color: var(--color-black);
  background-clip: padding-box;
  background-color: var(--color-light);
}

.std-search-wrapper-column {
  /*max-width: 40rem;*/
  height: auto;
  /*margin: 0 auto;*/
  /*padding: 5rem 3rem;
  border-radius: 0.25rem;
  background-color: var(--color-white);
  box-shadow: var(--shadow-medium);*/
}

.std-search-dropdown-menu-inner .no-results-message {
  color: #666;
  background-color: var(--color-light);
}




/*End student search bar */

/*school table*/
/*reset values*/
.std-mn-container-list table  td {
    border: none;
}
table tr:nth-of-type(even) td {
  background-color: transparent;
}



.std-mn-container-list {
  width: 100%;
  /*max-width: 1140px;*/
  margin: 0 auto;
  /*padding: 0 15px;*/
}

/* Responsive Table Style */
.responsive-table {
  background-color: var(--table-bg-color);
  border-collapse: collapse;
  border-radius: 10px;
  box-shadow: 0 0 10px rgba(0, 0, 0, 0.02);
  width: 100%;
  margin: 2rem 0;
  overflow: hidden;
}

.responsive-table__row {
  display: grid;
  border-bottom: 1px solid var(--table-border-color);
  padding: 0 1.5rem;
}

.responsive-table__row th,
.responsive-table__row td {
	padding: 1rem;
}

.responsive-table__head {
  background-color: var(--table-head-bg-color);
}

.responsive-table__head__title {
  display: flex;
  align-items: center;
  font-weight: 500;
  text-transform: capitalize;
  font-weight: bold;
}

.responsive-table__body .responsive-table__row {
  transition: 0.1s linear;
  transition-property: color, background;
}

.responsive-table__body .responsive-table__row:last-child {
  border-bottom: none;
}

.responsive-table__body .responsive-table__row:hover {
  color: var(--hover-text-color);
  background-color: var(--hover-bg-color);
}

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

.responsive-table__body__text::before {
  margin-right: 1rem;
  font-weight: 600;
  text-transform: capitalize;
}

.responsive-table__body__text--name {
  font-weight: 600;
}

/* SVG Up Arrow Style */
.up-arrow {
  height: 100%;
  max-height: 1.8rem;
  margin-left: 1rem;
}

/* SVG User Icon Style */
.user-icon {
  width: 100%;
  max-width: 4rem;
  height: auto;
  margin-right: 1rem;
}

/* Status Indicator Style */
.status-indicator {
  display: inline-block;
  width: 1rem;
  height: 1rem;
  border-radius: 50%;
  background: #222222;
  margin-right: 0.5rem;
}

.status-indicator--active {
  background: var(--active-color);
}

.status-indicator--inactive {
  background: var(--inactive-color);
}

.status-indicator--new {
  background: var(--new-color);
}
.responsive-table__body__text img{
  opacity: .8;
  max-width: 14%;
  margin-right: 6%;
}
.responsive-table__body__text--update .fa-check-circle{
  color: green;
}
.responsive-table__body__text--update .fa-hourglass-half{
  color: #007ff9;
}

.std-edt-btns{
  display: flex;
  width: 100%;
  justify-content: space-between;
}
.std-edt-btns span{
  display: inline-block;
  border: solid thin #2c2c2c;
  padding: .8rem;
  border-radius: 4px;
  margin-right: 2%;
}
.std-edt-btns .trs-itm-cntr{
  border: solid thin #ff3333;
}
.std-edt-btns .trs-itm-cntr i{
  color: #ff3333;
}
.fa-redo-alt{
  color: #DA5D09;
  margin-left: 5%;
  display: inline-block;
  transform: scaleX(-1);
}



/* Media Queries */
@media (min-width: 768px) {
  .responsive-table__row {
    grid-template-columns: 2fr 1fr 2fr 1fr 1.5fr;
  }
  .ovr-sgn-tbl{
    grid-template-columns: 2fr 1fr 1fr 1.5fr 1.5fr;
  }
  .ovr-4-fld{
    grid-template-columns: 3fr 1fr 1fr 1.5fr;
  }
  .org-tbl-tbd-cntr{
    grid-template-columns: 3fr 2fr 1fr 2fr;
  }
  .org-tbl-tbd-cntr--ovrd-colspan-4 {
    padding-top: 5%;
    grid-template-columns: 8fr !important;
  }
  .org-tbl-tbd-cntr--ovrd-colspan-4 .responsive-table__body__text{
    justify-content: center;
    font-weight: 400;
    color: #606060;
  }
  .responsive-table__body__text--name::before {
    display: none;
  }
  .ovr-3-columns .responsive-table__row{
    grid-template-columns: 2fr 2fr 1fr;
  }
  .ovr-3-columns .responsive-table__row.ovr-all-columns{
    grid-template-columns: 5fr;
  }
  .ovr-1-1-1-columns .responsive-table__row{
    grid-template-columns: 1fr 1fr 1fr;

  }
  .ovr-2-1-1-columns .responsive-table__row{
    grid-template-columns: 2fr 1fr 1fr;
  }
  .ovr-2-1-1-1-columns .responsive-table__row{
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }
}

@media (max-width: 991px) {
  .responsive-table__head {
    display: none;
  }
  
  .responsive-table__body__text::before {
    content: attr(data-title) " :";
  }
}

@media (min-width: 768px) and (max-width: 991px) {
  .responsive-table__row {
    grid-template-columns: 1fr 2fr 1fr;
  }
  
  .responsive-table__body__text--name {
    grid-column: 1 / 2;
    flex-direction: column;
  }
  
  .responsive-table__body__text--status,
  .responsive-table__body__text--types,
  .responsive-table__body__text--update {
    grid-column: 2 / 3;
  }
  
  .responsive-table__body__text--country {
    grid-column: 3 / -1;
  }
  
  .responsive-table__body__text--name,
  .responsive-table__body__text--country {
    grid-row: 2;
  }
  .ovr-1-1-1-columns .responsive-table__row{
    grid-template-columns: 1fr 1fr 1fr;
  }
  .ovr-2-1-1-1-columns .responsive-table__row{
    grid-template-columns: 2fr 1fr 1fr 1fr;
  }
}

@media (max-width: 400px) {
  .responsive-table__body__text::before {
    width: 100%;
    margin-bottom: 1rem;
  }
}

/*subject select box*/
.sel-bx-sbt-cntr select {
  /* Reset Select */
  appearance: none;
  outline: 0;
  border: 0;
  box-shadow: none;
  /* Personalize */
  flex: 1;
  padding: 0 1em;
  color: #fff;
  background-color: var(--darkgray);
  background-image: none;
  cursor: pointer;
  font-family: "Kumbh Sans", serif;
  font-size: 1rem;
}
.sel-bx-sbt-cntr select option:first-child{
  color: #c9c9c9;
}
/* Remove IE arrow */
.sel-bx-sbt-cntr select::-ms-expand {
  display: none;
}
/* Custom Select wrapper */
.sel-bx-sbt-cntr .select {
  position: relative;
  display: flex;
  width: 30em;
  height: 4em;
  border-radius: .25em;
  overflow: hidden;
}
/* Arrow */
.sel-bx-sbt-cntr .select::after {
  content: '\25BC';
  position: absolute;
  top: 0;
  right: 0;
  padding: 1.5em 1em;
  background-color: #34495e;
  transition: .25s all ease;
  pointer-events: none;
  color: #ffffff;
  height: 4em;
}
/* Transition */
.sel-bx-sbt-cntr .select:hover::after {
  color: #f39c12;
}
.sel-bx-sbt-cntr{
  margin-top: 5%;
}

.sgn-mn-bdy-cntr{
  display: flex;
  flex-wrap: wrap;
  margin-top: 2%;
  justify-content: space-evenly;
}
.sgn-card-body {
    width: 42%;
    display: flex;
    box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;
    padding: 1% 2%;
    border-radius: 15px;
    align-items: center;
    margin-bottom: 5%;
}
.sgn-crd-img-cntr{
  width: 34%;
  text-align: center;
  padding: 0% 3%;
}
.sgn-crd-det-cntr{
  width: 65%; 
}
.sgn-ttl-elem{
  font-weight: bold;
  border-bottom: solid thin #cccccc;
  padding-bottom: 2%;
  margin-bottom: 2%;
}
.sgn-crd-det-info-bdy{
  font-size: 0.9rem;
  line-height: 2.5;
}
.sgn-crd-det-info-bdy span{
  color: #5a5a5a;
}
.sgn-btn-cntr{
  border-top: solid thin #cccccc;
  margin-top: 2%;
}
.sgn-btn-vw-cntr a{
  display: block;
  background-color: #377db5;
  color: #ffffff !important;
  padding: 4% 0%;
  font-weight: bold;
  cursor: pointer;
  border-radius: 30px;
  -webkit-user-select: none;
  user-select: none;
  text-align: center;
  margin-top: 5%;
  font-size: 1rem;
}
.sgn-crd-img-cntr img{
  width: 94%;
  height: auto;
}

.vw-sgn-mn-bdy-cntr{
  border-top: solid thin rgb(211, 211, 211);
  margin-top: 3%;
  padding: 3% 2%;
}
.vw-ad-gn-det-cntr{
  width: 70%;
}
.vw-ad-gn-det-cntr>div{
  color: #494949;
  border-bottom: solid thin #f8f2f2;
  padding: 2% 0%;
}
.vw-ad-gn-det-cntr>div span{
  font-weight: bold;
  display: inline-block;
  width: 30%;
}
/*.vw-ad-gn-det-cntr>div:last-child span{
  /*display: block;
}*/

/*VIEW ASSIGNMENTS OVERWRITE CODE */
.sgn-vw-mn-cntr-html .aud-cntr {
  width: 4%;
}
.sgn-vw-mn-cntr-html .lnr-qstn-box label {
  font-size: 1.1rem;
}
.sgn-vw-mn-cntr-html .nmbr-syl-wrd-item {
  font-size: 2rem;
}
.sgn-vw-mn-cntr-html .lnr-img-cntr {
  min-height: auto;
}
.sgn-vw-mn-cntr-html .lnr-ans-bx-sel a {
  padding: 1% 1%;
  font-size: 1.5rem;
}
.sgn-vw-mn-cntr-html .ui2-lnr-qstn-cntr .text-input-bx .lrn-usr-input-box input[type=text] {
  height: 51px;
}
.sgn-vw-mn-cntr-html .lnr-sub-ans-btn {
  font-size: 1.1rem;
}
.sgn-vw-mn-cntr-html .ui2-lnr-qstn-cntr .lnr-qstn-box {
  margin-top: 7%;
}
.sgn-vw-mn-cntr-html .nmbr-syl-wrd-cntr {
  margin-top: 1%;
}
.sgn-vw-mn-cntr-html .lnr-img-cntr {
  margin-top: 0%;
}
.sgn-vw-mn-cntr-html .bx-itm-3 span, .sgn-vw-mn-cntr-html .bx-itm-4 span {
  font-size: 1rem;
}
.sgn-vw-mn-cntr-html .tka-cntr span {
  font-size: 0.8rem;
}
.sgn-vw-mn-cntr-html .num-cntr-mng-ptrn label span, .sgn-vw-mn-cntr-html .num-cntr-mng-ptrn .missing-lbl-bdy span{
  font-size: 2rem;
}
.sgn-vw-mn-cntr-html .ui2-lnr-qstn-cntr .worded-problem-cntr {
  font-size: 1.2rem;
}
.sgn-vw-mn-cntr-html .lrn-usr-input-box input[type=text], .sgn-vw-mn-cntr-html .lrn-usr-input-box input[type=number] {
  font-size: 1.5rem;
}
.sgn-vw-mn-cntr-html .pt-tg-qstn-cntr > div {
  padding: 0% 2%;
}
.sgn-vw-mn-cntr-html .ui2-diag-test-mn .lnr-sub-ans-btn {
  margin-top: 1%;
}
.sch-usr-stt-prl-cntr{
  margin-top: 2%;
  background-color: #ffffff;
  border-radius: 15px;
  padding: 1% 1% 3%;
  margin-bottom: 4%;
}

.sch-usr-stt-prl-cntr .stt-pfl-det-bdy{
  color: #606060;
}
.sch-usr-stt-prl-cntr .stt-pfl-det-bdy span{
  font-weight: bold;
  display: inline-block;
  width: 50%;
}
.sch-usr-stt-prl-cntr .pfm-hdr-cntr{
  margin-bottom: 2%;
}
.stt-pfl-det-bdy{
  display: flex;
  align-items: center;
}
.stt-pfl-img-cntr{
  width: 30%;
  display: flex;
  justify-content: center;
}
.elm-cntr{
  width: 50%;
  line-height: 2.5;
}
.cls-sgn-ovr-pfr-cntr{
  margin-top: 5%;
  background-color: #ffffff;
  border-radius: 15px;
  padding: 1% 2%;
}
.add-std-blk-cntr a{
  color: #ffffff;
  font-family: "Kumbh Sans", serif;
  font-size: 1rem;
}

/*upload onboarding xlsx file*/
.stt-blk-upl-bdy .upload-container {
  margin: 20px auto;
  text-align: center;
}

.stt-blk-upl-bdy .upload-btn-wrapper {
  position: relative;
  overflow: hidden;
  display: inline-block;
}

.stt-blk-upl-bdy .btn {
  border: 2px solid #3498db;
  color: #3498db;
  background-color: white;
  padding: 8px 20px;
  border-radius: 8px;
  font-size: 16px;
  font-weight: bold;
  cursor: pointer;
  transition: all 0.3s ease;
  margin: 5px;
}

.stt-blk-upl-bdy .btn:hover {
  background-color: #3498db;
  color: white;
}

.stt-blk-upl-bdy .btn.upload {
  background-color: #b4b4b4;
  border-color: #b4b4b4;
  color: white;
}

.stt-blk-upl-bdy .btn.upload:hover {
  background-color: #b4b4b4;
  border-color: #b4b4b4;
}

.stt-blk-upl-bdy .upload-btn-wrapper input[type=file] {
  font-size: 100px;
  position: absolute;
  left: 0;
  top: 0;
  opacity: 0;
  cursor: pointer;
}

.stt-blk-upl-bdy .file-name {
  margin-top: 10px;
  color: #666;
  font-size: 14px;
  min-height: 20px;
}

.stt-blk-upl-bdy .drag-area {
  border: 2px dashed #3498db;
  border-radius: 8px;
  padding: 20px;
  margin-top: 20px;
  transition: all 0.3s ease;
}

.stt-blk-upl-bdy .drag-area.dragover {
  background-color: #ebf5fb;
  border-color: #2980b9;
}

.stt-blk-upl-bdy .progress {
  display: none;
  margin-top: 10px;
  height: 10px;
  background-color: #f0f0f0;
  border-radius: 5px;
  overflow: hidden;
}

.stt-blk-upl-bdy .progress-bar {
  width: 0%;
  height: 100%;
  background-color: #2ecc71;
  transition: width 0.3s ease;
}
.upl-btn-cntr{
  margin-top: 3%;
}
.upl-btn-cntr .upload{
  padding: 1% 6%;
  border-radius: 8px;
  font-size: 1.5rem;
}
.upl-btn-cntr .upload.activeBtn{
  background-color: #2ecc71;
  border-color: #2ecc71;
}
.upl-btn-cntr .upload.activeBtn:hover{
  background-color: #2ecc71;
  border-color: #2ecc71;
}

.smt-det-cntr{
  margin: 5% 0% 10%;
}
.std-edt-btns .ast-img-cntr span{
  padding: 0;
  border: none;
}
.responsive-table__body__text .ast-img-cntr img {
  max-width: 90%;
}

.std-edt-btns a{
  width: 25%;
}
.sch-nav-cntr-min-nav.usr-pfl-cntr {
  justify-content: flex-end;
}
.sch-nav-cntr-min-nav .usr-lnr-nav-pfl-cntr {
  justify-content: flex-end;
}
.sch-nav-cntr-min-nav .usr-profile-avatar-cntr {
  justify-content: flex-end;
}
.lnr-ans-bx-sel .sel-opt-btn{
  background-color: #44a8ff;
  box-shadow: #0035ff 0px 2px 8px 0px;
}
.lnr-ans-bx-sel a.sel-opt-btn:hover {
  background-color: #44a8ff;
}
.lnr-qstn-box .txt-instr-cntr label,
.lnr-qstn-box .txt-instr-cntr span{
  font-size: 1.3rem;
}
.scr-cat-cntr{
  border-bottom: solid thin #999999;
}

/* Base button styles */
.btn-slc-elem {
  padding: 10px 20px;
  border: none;
  border-radius: 6px;
  font-weight: 600;
  font-size: 14px;
  cursor: pointer;
  transition: all 0.3s ease;
  box-shadow: 0 2px 4px rgba(0, 0, 0, 0.1);
}

/* Correct button */
.lnr-ans-bx-sel a.btn-correct {
  background-color: #22c55e; /* Green */
  color: white;
  border: 2px solid #16a34a;
}

.lnr-ans-bx-sel a.btn-correct:hover {
  background-color: #16a34a;
  box-shadow: 0 4px 8px rgba(34, 197, 94, 0.2);
  transform: translateY(-1px);
}

.lnr-ans-bx-sel a.btn-correct:active {
  transform: translateY(1px);
  box-shadow: 0 1px 2px rgba(34, 197, 94, 0.2);
}

/* Incorrect button */
.lnr-ans-bx-sel a.btn-incorrect {
  background-color: #ef4444; /* Red */
  color: white;
  border: 2px solid #dc2626;
}

.lnr-ans-bx-sel a.btn-incorrect:hover {
  background-color: #dc2626;
  box-shadow: 0 4px 8px rgba(239, 68, 68, 0.2);
  transform: translateY(-1px);
}

.lnr-ans-bx-sel a.btn-incorrect:active {
  transform: translateY(1px);
  box-shadow: 0 1px 2px rgba(239, 68, 68, 0.2);
}
.mrn-tp-btm-5 {
  margin: 0% 0%;
}
.responsive-table__body__text--name a{
  font-size: 1rem;
}
.std-edt-btns .inactive-span-i{
  background-color: #b4b4b4;
  cursor: not-allowed;
  color: #6a6a6a;
  border: none;
}
.sgn-pfm-cnt-cntr{
  margin: 6% 0% 8%;
}
.sch-lg-cntr{
  width: 100%;
}
.sch-lg-cntr img{
  width: 80%;
}
.pld-mn-ntf-cntr{
  padding-top: 4%;
  display: none;
}
.swn-det-info-cntr{
  display: flex;
  justify-content: center;
}
.pld-mn-ntf-cntr .status-container {
  background: white;
  border-radius: 12px;
  padding: 1.5rem;
  max-width: 500px;
  box-shadow: 0 4px 6px -1px rgba(0, 0, 0, 0.1), 
              0 2px 4px -2px rgba(0, 0, 0, 0.05);
  border: 1px solid #f0f0f0;
}

.pld-mn-ntf-cntr .status-item {
  display: flex;
  align-items: center;
  padding: 0.75rem;
  margin: 0.5rem 0;
  border-radius: 8px;
  font-size: 0.95rem;
  font-weight: 500;
  transition: transform 0.2s ease;
}

.pld-mn-ntf-cntr .status-item:hover {
  transform: translateX(4px);
}

.pld-mn-ntf-cntr .status-success {
  background-color: #ECFDF5;
  color: #065F46;
  border-left: 4px solid #10B981;
}

.pld-mn-ntf-cntr .status-warning {
  background-color: #FFFBEB;
  color: #92400E;
  border-left: 4px solid #F59E0B;
}

.pld-mn-ntf-cntr .status-error {
  background-color: #FEF2F2;
  color: #991B1B;
  border-left: 4px solid #EF4444;
}

.pld-mn-ntf-cntr .status-icon {
  width: 20px;
  height: 20px;
  margin-right: 12px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.pld-mn-ntf-cntr .status-text {
  flex-grow: 1;
  text-align: left;
}

.pld-mn-ntf-cntr .status-count {
  font-weight: 700;
  margin-right: 8px;
}

@media (max-width: 480px) {
  .pld-mn-ntf-cntr .status-container {
      margin: 1rem;
      padding: 1rem;
  }

  .pld-mn-ntf-cntr .status-item {
      font-size: 0.875rem;
  }
}


.min-itm-ww .sgn-card-body {
  width: 40%;
  margin-bottom: 5%;
}
.hdr-elem-bdy{
  font-weight: bold;
}
.cntr-std-hdr-nd-dsp-flx{
  font-family: "Kumbh Sans", serif;
  border-bottom: solid 2px #c1c1c1;
  padding-bottom: 1%;
}
.hdr-cntr-hgl-bdy{
  background-color: #73e6ff;
  border-radius: 15px;
  margin-top: 5%;
  padding: 1%;
}
.ww-vrd-mg-tp.graph-pfm-cntr {
  margin-top: 1%;
}
.graph-pfm-cntr.lck-cntr{
  text-align: center;
  display: block;
  color: #6d6d6d;
}
.dnl-cntr{
  margin-top: 8%;
  -webkit-user-select: none;
  user-select: none;
}
.dnl-elem{
  display: inline-block;
  padding: .7% 3%;
  background-color: #033c59;
  color: #ffffff;
  border-radius: 10px;
  font-family: "Poppins", sans-serif;
  font-size: 1rem;
}
.lnr-qstn-box .dnl-elem i{
  font-size: 1.7rem;
  color: #ffffff;
}
.brk-dwm-cntr.ww-vrd-fnt{
  font-size: 1.5rem;
}
body.ui2-bdy-elem-cntr.togglePointer {
  pointer-events: none; /* Enable blocking of clicks */
}
.graph-pfm-cntr.ww-ovd-100>div {
  width: 70%;
}
.graph-pfm-cntr.ww-ovd-100 {
  justify-content: center;
}
.ww-vby-cntr{
  display: flex;
  justify-content: space-between;
  flex-wrap: nowrap;
}
.ww-vby-cntr>div{
  width: 20%;
  text-align: center;
  padding: 1% 1%;
  border-radius: 15px;
  background-color: #a1a1a1;
}
.ww-vby-cntr .vw-act-by-btn{
  background-color: #4ecdc4;
  font-weight: bold;
}

.vw-mn-std-in-hm-cntr{
  margin-top: 2%;
  border-top: solid thin rgb(195, 195, 195);
  padding-top: 2%;
}

.vw-by-hdr-bdy{ 
  font-weight: bold;
  margin-bottom: 2%;
}
.no-rec-mtc-tr{
  display: none;
}
#no-results-row{
  text-align: center;
}
#no-results-row>td{
  padding-top: 5%;
}
.stg-sts-tag-cntr{
  display: block;
  text-align: center;
  padding: 4% 0%;
  background-color: #22c55e;
  color: white;
  font-family: system-ui, -apple-system, sans-serif;
  font-weight: 500;
  border-radius: 0.5rem;
  box-shadow: 0 1px 2px rgba(0, 0, 0, 0.05);
  margin-bottom: 7%;
  letter-spacing: 1px;
}
.graph-pfm-cntr .lck-cntr{
  width: 100%;
  text-align: center;
  display: block;
  color: #6d6d6d;
}
.sgn-grp-mn-cntr{
  width: 100%;
  display: flex;
  flex-wrap: wrap;
  justify-content: flex-start;
  margin-bottom: 5%;
}
.sgn-grp-mn-cntr>div{
  margin-right: 2%;
}
.mn-cntr-ttl-elem{
  background-color: rgb(237, 237, 237);
  width: 100%;
  padding: 1% 2%;
  font-weight: bold;
  margin-bottom: 2%;
}

.schl-edt-cld-profile .gender-inp-cntr, .schl-edt-cld-profile .grade-inp-cntr, .schl-edt-cld-profile .esk-cnty-slt {
  width: 50%;
}
.mod-det-btn-cntr a {
  background-color: var(--primary-color-orange);
  color: #FFF !important;
  font-weight: bold;
  font-size: 1.1rem;
  padding: 3% 10%;
}
.esmk-cncl-btn {
  padding: 2% 5%;
}
.ovrd-to-100>div{
  width: 100%;
}
.prf-key-cntr{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  justify-content: center;
}
.prf-key-cntr>span{
  display: block;
  width: 30%;
  font-size: 0.9rem;
  padding: .5% 2%;
  margin-bottom: 2%;
  margin-right: 2%;
  border-radius: 15px;
}
.span--elem-1, .span--elem-2{
  border: solid 4px #f69542;
}
.span--elem-3, .span--elem-4{
  border: solid 4px #754d43;
}
.span--elem-5, .span--elem-6{
  border: solid 4px #262626;
}

.graph-pfm-cntr.ovrd-width-100--scl>div{
  width: 100%;
}
.scl-pfm-asm-mn-cntr{
  margin: 5% 0%;
}
.scl-pfm-asm-mn-cntr .sub-cntr-hdr,
.scl-pfm-all-asm-mn-cntr .sub-cntr-hdr,
.std-db-hdr-cntr{
  font-weight: bold;
}
.asgn-list-tag-cntr{
  margin: 2% 0% 1%;
}
.elem-tag-sub-nm{
  font-size: 1rem;
}
.sgn-dpy-rsl-notif-cntr{
  font-size: 1rem;
  margin: 2% 0%;
  background-color: #00d3ff45;
  border-radius: 15px;
  padding: .5% 3%;
  text-align: center;
}
.sgn-dpy-rsl-notif-cntr a{
  font-size: 1.1rem;
  background-color: #039bbb;
  padding: 1% 3%;
  cursor: pointer;
  border-radius: 30px;
  font-weight: 400;
  font-style: normal;
  -webkit-user-select: none;
  user-select: none;
  font-weight: bold;
  color: #ffffff;
  width: 40%;
  text-align: center;
}
.sgn-not-gt-rst-cntr{
  padding: 2% 0%;
}

.vsl-prm-mn-cntr{
  display:flex;
  justify-content:center;
  align-items:center;
}
.vsl-prm-mn-cntr>div{
  width: 30%;
}
.score-vsl-cntr{
  display:flex;
  justify-content:center;
  align-items:center;
  flex-direction: column;
}

.avg-asg-prm-mn-cntr .score-cntr{
  display:flex;
  justify-content:center;
  align-items:center;
}

.avg-asg-prm-mn-cntr .circle {
  position: relative;
  width: min(80vw, 250px); /* Responsive width with maximum of 250px */
  height: auto;
  aspect-ratio: 1;
  margin-left: auto;
  margin-right: auto;
  text-align: center;
}

.avg-asg-prm-mn-cntr .circle svg {
  position: relative;
  width: 100%;
  height: 100%;
  display: block;
}

.avg-asg-prm-mn-cntr .circle svg circle {
  fill: none;
  stroke: #000;
  stroke-width: calc(12 * var(--circle-scale, 1)); /* Scaled stroke width */
  stroke-dasharray: 628;
  stroke-dashoffset: 628;
}

.avg-asg-prm-mn-cntr .circle svg circle:nth-child(1) {
  stroke-dashoffset: 0;
  stroke: #e4e4e4;
}

.avg-asg-prm-mn-cntr .circle svg circle:nth-child(2) {
  stroke-linecap: round;
  box-shadow: inset 0px 0px 4px rgba(0, 0, 0, 0.25);
  transform: rotate(-90deg) translate(0px, 0px);
  transform-origin: 50% 50%;
}

.avg-asg-prm-mn-cntr .circle .number {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  font-family: "Open Sans", sans-serif;
  font-weight: 800;
  display: flex;
  justify-content: center;
  align-items: center;
  font-size: clamp(1.5rem, 6vw, 2rem); /* Responsive font size */
  background-color: #0074e0;
  background-size: 100%;
  background-repeat: repeat;
  background-clip: text;
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
  -moz-background-clip: text;
  -moz-text-fill-color: transparent;
}

/* Gradient classes remain unchanged */
.avg-asg-prm-mn-cntr .blue-grad-text {
  background-image: linear-gradient(45deg, #2dcce2 0%, #0074e0 100%);
}

.avg-asg-prm-mn-cntr .red-grad-text {
  background-image: linear-gradient(45deg, #f11111 0%, #dc00e0 100%);
}

.avg-asg-prm-mn-cntr .green-grad-text {
  background-image: linear-gradient(45deg, #51e22d 0%, #00e08f 100%);
}

.avg-asg-prm-mn-cntr .main-color-grad {
  background-image: linear-gradient(45deg, #2dcce2 0%, #010c16 100%);
}
::selection {
  color: black;
  background-color: #f3f3f3;
}
.tt-vsl-cntr, .cp-vsl-cntr{
  text-align: center;
}
.scr-tm-disp-cntr{
  display: flex;
  align-items: center;
  justify-content: center;
}
.scr-tm-disp-cntr div{
  font-size: 2rem;
  display: flex;
  align-items: center;
  justify-content: center;
  width: 60%;
  box-shadow: #02797e 0px 2px 15px 0px;
  border-radius: 25px;
}
.scp-prm-tag{
  font-weight: bold;
}
.sch-login-mn-dom-cntr{
  width: 100vw;
  height: 100vh;
}
.sch-login-elem-bdy{
  display: flex;
  align-items: center;
  justify-content: center;
  padding: 1rem;
}
.sch-login-elem-bdy .login-container {
  background: rgba(255, 255, 255, 0.95);
  border-radius: 20px;
  box-shadow: 0 15px 35px rgba(0, 0, 0, 0.2);
  overflow: hidden;
  width: 100%;
  max-width: 500px;
}

.sch-login-elem-bdy .login-image {
  width: 100%;
  height: 200px;
  /*background: url('/api/placeholder/400/200') center/cover;*/
  text-align: center;
}

.sch-login-elem-bdy .login-form {
  padding: 0rem 2rem 2rem;
}
.sch-login-elem-bdy .login-image img{
  max-width: 94%;
  margin: 1% 2% 0%;
}
.sch-login-elem-bdy .login-title {
  color: #1a1a1a;
  font-size: 1.75rem;
  font-weight: 600;
  margin-bottom: 1.5rem;
  text-align: center;
}
.sch-login-elem-bdy form{
  width: 94%;
}
.sch-login-elem-bdy .form-group {
  margin-bottom: 1.25rem;
}
.sch-login-elem-bdy .form-group:last-child {
  margin-bottom: 0.5rem;
}
.sch-login-elem-bdy .form-label {
  display: block;
  color: #4a5568;
  margin-bottom: 0.5rem;
  font-size: 0.875rem;
}

.sch-login-elem-bdy .form-input {
  width: 100%;
  padding: 0.75rem 1rem;
  border: 2px solid #e2e8f0;
  border-radius: 10px;
  font-size: 1rem;
  transition: all 0.3s ease;
}

.sch-login-elem-bdy .form-input:focus {
  outline: none;
  border-color: #667eea;
  box-shadow: 0 0 0 3px rgba(102, 126, 234, 0.1);
}

.sch-login-elem-bdy .login-button {
  display: block;
  max-width: 100%;
  padding: 0.75rem;
  background: #667eea;
  color: white;
  border: none;
  border-radius: 10px;
  font-size: 1rem;
  font-weight: 600;
  cursor: pointer;
  transition: all 0.3s ease;
  text-align: center;
  -webkit-user-select: none;
  user-select: none;
}

.sch-login-elem-bdy .login-button:hover {
  background: #5a67d8;
  transform: translateY(-1px);
}

.sch-login-elem-bdy .forgot-password {
  display: block;
  text-align: center;
  color: #667eea;
  text-decoration: none;
  margin-top: 1rem;
  font-size: 0.875rem;
}

.sch-login-elem-bdy .forgot-password:hover {
  text-decoration: underline;
}
.login-notif-grp{
  display: none;
}
.notif-dbs-cntr-mn{
  display: flex;
  justify-content: center;
}
.no-agn-avl-notif-cntr{
  font-weight: 400;
  color: #606060;
  text-align: center;
}
.cls-modal-lgd-out-notif{
  padding: 15% 2%;
}
/*logged out notificatioin for modal*/
.cls-modal-lgd-out-notif .notification-container {
  /*position: fixed;
  top: 20px;
  right: 20px;
  /*animation: slideIn 0.5s ease-in-out;*/
  text-align: center;
}

.cls-modal-lgd-out-notif .notification {
  background-color: #f8d7da;
  border: 1px solid #f5c6cb;
  border-radius: 4px;
  padding: 16px 24px;
  box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
  display: flex;
  align-items: center;
  gap: 12px;
  justify-content: center;
}

.cls-modal-lgd-out-notif .notification-icon {
  width: 24px;
  height: 24px;
  fill: #721c24;
}

.cls-modal-lgd-out-notif .notification-message {
  color: #721c24;
  font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto, sans-serif;
  font-size: 16px;
  margin: 0;
}
.mod-lgd-out-btn-cntr{
  margin-top: 15%;
  display: flex;
  justify-content: center;
}
.mod-lgd-out-btn-cntr a {
  background-color: orange;
  color: #353535 !important;
  font-weight: bold;
  font-size: 1.1rem;
  padding: 3% 10%;
  border-radius: 15px;
  cursor: pointer;
}
.no-data-message{
  display: inline-block;
  position: absolute;
  top: 30%;
  left: 50%;
  transform: translate(-50%, -50%);
  background: rgb(234 234 234);
  padding: 3rem 20px;
  border-radius: 5px;
  font-weight: bold;
  color: rgb(51, 51, 51);
  width: 50%;
  text-align: center;
  z-index: 100;
}
.graph-pfm-cntr.ovrd-width-100--scl .no-data-message{
  width: 50%;
}
.ovrd-width-100--scl{
  position: relative;
}
.add-pdn-tp{
  padding-top: 5% !important;
}
.dplyd-asg-elm{
  background-color: #038f08 !important;
}
.dply-asn-notif-cntr{
  display: none;
}
.ovrd-dsp-jst-cntr{
	justify-content: flex-start;
}
.usr-nm-tch-cntr{
  text-align: center;
  padding: 3% 0%;
}
.ww-opt-2-cntr .ltr-box-item{
    font-family: "Handlee", serif !important;
    font-weight: 600;
}
.tcr-sub-all-hrd{
  padding: 0% 0% 2% 0%;
  font-weight: bold;
}
.bba-usr-itm.bba-usr-mcrs.ovr-bg-clrm{
  background-color: #FFFFFF;
}
.tcr-sbj-notif-cntr{
  padding: 2% 5%;
}
.tcr-sbj-notif-cntr .ui2-mn-notification{
  display: flex;
}
.cls-ovr-vw-cntr .unq-sbj-item {
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  background-color: #ffffff;
  width: 25%;
  border-radius: 15px;
  display: flex;
  align-items: center;
  padding: 1% 2%;
  flex-direction: column;
  cursor: pointer;
  margin-bottom: 2%;
}
.sch-std-sbj-nm-cntr span{
  font-weight: bold;
  font-size: 1.1rem;
}
.cls-lst-mn-cntr{
  display: flex;

}
.cls-lst-mn-cntr a{
  display: block;
  padding: 2% 4%;
  width: 20%;
  box-shadow: rgb(0 0 0 / 65%) 0px 0px 6px 3px, rgb(0 0 0 / 24%) 0px 0px 0px 1px;
  border-radius: 15px;
}
.cls-lst-mn-cntr a:hover{
  box-shadow: rgb(0 228 253 / 65%) 0px 0px 6px 3px, rgb(0 0 0 / 24%) 0px 0px 0px 1px
}
.ui2-cls-hdr-banner{
  border-radius: 25px;
}
.ovr-bg-clrm{
  background-color: #FFFFFF;
}
.ui2-cls-hdr-banner span{
  font-weight: bold;
}
.ui2-cls-hdr-banner a span{
  font-size: 1.1rem;
}

.ui2-cls-hdr-banner a:hover{
  color: #007785;
}
.cls-mn-grp-flt, .cls-mn-grp-flt-sgn{
  display: flex;
  margin: 3% 0;
}
.cls-mn-grp-flt a, 
.cls-mn-grp-flt-sgn a{
  display: inline-flex;
  padding: 2% 0%;
  width: 20%;
  background-color: #cacaca;
  justify-content: center;
  border-radius: 15px;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
  margin-right: 1%;
}
.fas.hide-i-icon{
  opacity: 0;
}
.responsive-table__body__text--name a{
  display: flex;
}
.class-name-mn-cntr{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
}
.class-name-bdy{
  width: 25%;
  text-align: center;
  box-shadow: rgba(0, 0, 0, 0.24) 0px 3px 8px;
  border-radius: 15px;
  margin-right: 2%;
  margin-bottom: 2%;
}
.class-name-bdy a{
  padding: 2% 3%;
}
.class-name-bdy img{
  width: 50%;
}
.class-name-bdy span{
  display: block;
  margin-top: 5%;
  font-weight: bold;
  font-size: 0.9rem;
  font-family: 'Andika', sans-serif;
}
.ovr-all-columns .ui2-mn-notification, 
.adm-std-dist-mn-cntr .ui2-mn-notification{
  display: flex;
  width: -webkit-fill-available;
  gap: 2%;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}
.rmv-tcr-ac-sbj{
  font-size: 0.9rem;
  cursor: pointer;
  -webkit-user-select: none;
  user-select: none;
}
.snl-dgt-tr-cntr td.responsive-table__body__text{
  justify-content: center;
}
.snl-dgt-tr-cntr td a{
  display: block;
  width: 100%;
  text-align: center;
}
.snl-dgt-tr-cntr td span{
  font-weight: bold;
  font-size: 1.1rem;
}
.upld-tch-bulk-btn-cntr, .upld-tch-bulk-notif-cntr{
  display: flex;
  justify-content: center;
  margin-top: 2%;
}
.upld-tch-bulk-btn-cntr a{
  background-color: #da5d09;
	color: #FFF;
	padding:2% 2%;
  align-items: center;
	border-radius: 15px;
	cursor: pointer;
  font-size: 1.2rem;
	-webkit-user-select: none;
	user-select: none;
}
.upld-tch-bulk-notif-cntr span{
  color: #4e4e4e;
  font-size: 1.0rem;
  margin-top: 0%;
}
.pld-fl-ntf-cntr{
  margin-top: 3%;
}
.login-image{
    display: flex;
    justify-content: center;
}
.img-wdt-50 img{
  width: 50%;
}
.adm-bar-left a img{
  max-width: 9%;
}
.ocd-idn-cntr-elem{
  padding: 12% 0%;
  margin-bottom: 9%;
}
.spn-sml-wrd-cntr, .cma-itm-elem {
  font-size: 3rem;
}
.lnr-qstn-cntr .lnr-sub-ans-btn{
  cursor: no-drop;
  background-color: #c4c4c4;
}
.fnt-sz-3 {
  font-size: 2rem;
}
.ovr-wdt-cntr-15 .word-obj-cntr {
  font-size: 3rem;
}
.ui2-lnr-qstn-cntr .bx-itm-cntr.ndv-nbr-item {
  font-size: 3rem;
}
.cntr-align-center{
  text-align: center;
}
.cntr-font-bold{
  font-weight: bold;
}
.cntr-padding-left-2{
  padding-left: 10% !important;
}
.indicator-zero-str{
  color: #b5b5b5;
}
.indicator-non-zero-str{
  color: #181818;
}
.ovd-a-block a{
  display: block;
  width: 100%;
}
.ovd-width-90{
  width: 90%;
}

.cht-key-mn-cntr{
  display: flex;
  align-items: center;
  flex-wrap: wrap;
  padding: 0% 2%;
}
.key-itm-cntr{
	display: flex;
  width: 50%;
  background-color: #ddfeff;
  margin-bottom: 1.5%;
}
.key-itm-cntr label{
	display: block;
  padding: 2% 0%;
  font-size: 0.8rem;
  color: #494949;
}
.key-itm-cntr label.lbl-value{
	width: 30%;
}
.cht-key-mn-bdy{
  margin-top: 5%;
}





















































































@media screen and (min-width: 1200px) {
	.container{
		margin-left: 0px !important; /*override grid.scss*/
	}
	.lgd-in-spacer{
		width:0% !important;
	}
  .esmk-modal-wrapper.open .esmk-modal{
    margin-top:-220px;
    opacity:1;
  }
  .team-modal_def_values, .modal_def_values_zoo_mgr {
    height: 572px;
    width: 1110px;
    left: 31.5%;
    top:41%;
  }
  .team-modal_def_values .esmk-nxt-dyk-btn-cntr{
    display: none;
  }
}
@media screen and (min-width: 1900px) {
  .esmk-modal-wrapper.open .esmk-modal{
    margin-top:-300px;
    opacity:1;
  }
  .team-modal_def_values {
    height: 672px;
    width: 1110px;
    left: 38%;
    top:41%;
  }
  .profile-modal_def_values {
    height: 500px;
    width: 900px;
    left: 45%;
    top: 41%;
  }
  .lgd-in-spacer {
    width: 15% !important;
  }
}
@media only screen and (max-width: 768px){
  .modal_def_values, .modal_def_values_zoo_mgr, .profile-modal_def_values {
    height: 500px;
    width: 350px;
    left: 85%;
  }
  .esmk-content .mdl-not-cntr {
    font-family: 'Shantell Sans', cursive;
    font-size: 1.4rem;
  }
  .lrn-hdr {
		font-size: 2rem;
		letter-spacing: 3px;
    margin: 10% 0% 0% 0%;
    text-align: center;
	}
  .team-modal_def_values {
    height: 700px;
    width: 350px;
    left: 85%;
    top:48%;
    overflow-y: scroll;
  }
  .modal_def_values_zoo_mgr_btn {
    font-size: 1.3rem;
  }
  .sch-ovr-cls-mrg .bba-usr-dashboard-body {
    width: 100%;
    padding: 0% 0%;
  }
  .cls-ovr-vw-cntr {
    flex-direction: column;
  }
  .cls-ovr-vw-cntr>div {
    width: 100%;
    margin-bottom: 5%;
  }
  .sch-std-img img {
    max-width: 50%;
  }
  .avg-asg-prm-mn-cntr .circle {
    --circle-scale: 0.8; /* Reduce stroke width on medium screens */
  }
  .sgn-card-body, .min-itm-ww .sgn-card-body {
    width: 96%;
  }
  .responsive-table__row {
    padding: 0 .5rem;
    margin-bottom: 9%;
    box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
  }
  .vw-ad-gn-det-cntr {
        width: 100%;
    }
    .vw-ad-gn-det-cntr>div span {
        font-weight: bold;
        display: block;
        width: 100%;
    }
    .vsl-prm-mn-cntr {
        flex-direction: column;
    }
    .vsl-prm-mn-cntr>div {
        width: 96%;
        margin-bottom: 11%;
    }
    .std-db-hdr-cntr {
        width: 90%;
    }
    .pfm-sel-cntr {
        display: none;
    }
    .pfm-hdr-cntr {
        width: 96%;
    }
    .add-std-mn-cntr>div {
        padding: 6% 4%;
    }
     
    table tr.responsive-table__row td:not(:first-child) {
        transition: none; /* Removes transition effect */
        transform: none; /* Resets the transform */
        width: auto; /* Resets width to default */
        position: static; /* Resets position */
        z-index: auto; /* Resets z-index */
        display: block;
    }
    .stt-pfl-det-bdy {
        flex-direction: column;
    }
    .elm-cntr {
        width: 100%;
    }
    .sch-usr-stt-prl-cntr .stt-pfl-det-bdy span {
        font-weight: bold;
        display: block;
        width: 100%;
    }
    table .responsive-table__head tr th:first-child {
        width: 100%;
        display: block;
    }
    .graph-pfm-cntr.ww-ovd-100>div {
        width: 100%;
    }
    .prf-key-cntr>span {
        width: 40%;
    }
    .add-std-mn-cntr {
        width: 100%;
        margin-top: 7%;
    }
    .cntr-std-hdr-cntrl {
        flex-direction: column;
    }
    .ww-vby-cntr>div {
        width: 46%;
    }
    .ww-vby-cntr .vw-act-by-btn {
        background-color: #4ecdc4;
        font-weight: bold;
        display: flex;
        justify-content: center;
        align-items: center;
        gap: 12px;
    }
    .sgn-mn-bdy-cntr {
        flex-direction: column;
    }
    .graph-pfm-cntr {
        flex-direction: column;
    }
    .graph-pfm-cntr>div {
        width: 96%;
    }
    .ww-opt-2-cntr .ui2-lnr-qstn-cntr .lnr-ans-bx-sel a{
        width: 43%;
    }
    .ww-opt-2-cntr .ltr-box-item{
        font-family: "Handlee", serif !important;
        font-weight: 600;
    }
    .cls-ovr-vw-cntr .unq-sbj-item {
		width: 96%;
    }
    .cls-lst-mn-cntr {
        flex-wrap: wrap;
    }
    .cls-lst-mn-cntr a {
        width: 40%;
    }
    .sch-lg-cntr{
        margin-top: -5%;
    }
    .sch-lg-cntr img {
        width: 45%;
    }
    .responsive-table__body__text.no-data-in-row::before {
        display:none;
    }
    .responsive-table__body__text.no-data-in-row {
        color: #8d8d8d;
    }
    .class-name-bdy {
        width: 31%;
    }
    .ui2-lnr-qstn-cntr .lnr-ans-bx-sel a {
        width: 96%;
        font-size: 1.2rem;
        padding: 1% 2%;
    }
}

@media screen and (max-width: 480px) {
  .avg-asg-prm-mn-cntr .circle {
    --circle-scale: 0.6; /* Further reduce stroke width on small screens */
    width: min(90vw, 200px); /* Allow slightly larger relative size on mobile */
  }
  .sch-login-elem-bdy .login-container {
      border-radius: 15px;
  }

  .sch-login-elem-bdy .login-image {
      height: 150px;
  }

  .sch-login-elem-bdy .login-form {
      padding: 1.5rem;
  }

  .sch-login-elem-bdy .login-title {
      font-size: 1.5rem;
  }
  .class-name-bdy span{
      font-size: 1.0rem;
    }
}

.lexend-deca-bold {
  font-family: "Lexend Deca", serif;
  font-optical-sizing: auto;
  font-weight: 600;
  font-style: normal;
}

.ovd--andika-font{
  font-family: 'Andika', sans-serif !important;
}
.ovd--handlee-font{
  font-family: "Handlee", serif !important;
  font-weight: 600;
  font-style: normal;
}
.ovd--zedaya-font{
  font-family: "Zeyada", serif !important;
  font-weight: 600;
  font-style: normal;
}