.color-neutral-0{
  color:#fff
}

.color-neutral-600{
  color:#5e5e5e
}

.color-neutral-800{
  color:#303030
}

.color-neutral-900{
  color:#1c1c1c
}

.color-supporting-success-500{
  color:#318246
}

.global-color-supporting-success-200-bg{
  background-color:#88d991
}

.global-color-supporting-critical-300-bg{
  background-color:#ff897d
}

.global-color-neutral-200-bg{
  background-color:#c6c6c6
}

.global-color-supporting-warning-200-bg{
  background-color:#ffb86d
}

.global-color-neutral-100-bg{
  background-color:#e0e0e0
}

.global-color-neutral-50-bg{
  background-color:#f7f7f7
}

.boxshadow{
  box-shadow:0 0 0 4px #428fed
}

.boxshadowNone{
  box-shadow:none !important
}

.checkboxcollapse{
  height:56px
}

.checkboxexpand{
  height:294px
}

.studentexpand{
  height:382px !important
}

.studentcollapse{
  height:50px !important
}

.checkboxcollapse-mobile{
  height:100px
}

.checkboxexpand-mobile{
  height:450px
}

.checkboxexpand-disabled{
  height:230px
}

.global-check .essui-card__header-pritext{
  min-width:-webkit-max-content !important;
  min-width:max-content !important
}

.global-check .essui-card__header-addflex{
  display:none !important
}

.first-student{
  border-top-left-radius:8px !important
}

.last-student{
  border-bottom-left-radius:8px !important
}

.gap-zero{
  gap:0 !important
}

.studentListHeight{
  height:auto !important
}

@media screen and (min-width: 375px){
  .textarea-min-width{
    width:260px !important;
    min-width:100% !important
  }
}

@media screen and (min-width: 790px){
  .textarea-min-width{
    width:300px !important;
    min-width:100% !important
  }
}

@media screen and (min-width: 1024px){
  .textarea-min-width{
    width:420px !important;
    min-width:100% !important
  }
}

@media screen and (min-width: 1100px){
  .textarea-min-width{
    width:461px !important;
    min-width:100% !important
  }
}

.textAreaComment{
  min-height:initial;
  width:100%;
  min-width:100px !important;
  margin-left:0
}

.noResize{
  resize:none
}

.mobileViewButton{
  min-height:initial;
  margin-top:2%;
  width:98%;
  display:flex;
  flex-direction:column-reverse
}

.sectionTimelineheader{
  gap:42px;
  display:flex;
  justify-content:center;
  padding-left:48px;
  padding-right:48px
}

.timeLineNarrative{
  gap:42px
}

.container{
  overflow-x:scroll;
  max-width:98%
}

.container::-webkit-scrollbar{
  display:none
}

.width-full{
  width:100% !important
}

.addPupil-errorBanner{
  margin-top:24px;
  width:calc(100% - 32px) !important;
  margin-bottom:32px
}

.essui-side-panel-content{
  text-align:inherit !important
}

.divider{
  box-sizing:border-box;
  width:1px;
  background:#c6c6c6;
  border-left:1px solid #c6c6c6;
  flex:none;
  order:0;
  align-self:stretch;
  flex-grow:0;
  margin:0 24px
}

.meal-choice-expand-container{
  width:260px;
  margin:8px 0
}

@media screen and (min-width: 365px){
  .note-textarea-container{
    display:inline-grid
  }
}

@media screen and (min-width: 768px){
  .note-textarea-container{
    display:flex
  }

  .meal-choice-expand-container{
    display:none
  }
}

.dialog-width{
  width:0px !important
}

@media screen and (max-width: 767.5px){
  .list-header-mobile{
    display:none
  }
}

@media screen and (max-width: 400px){
  .confirm-btn-space{
    margin-top:16px
  }
}

.added-pupils{
  background-color:#fff
}

.essui-loader-area-overlay{
  position:absolute;
  top:0;
  right:0;
  max-width:720px !important
}

.essui-side-panel{
  z-index:10 !important
}

.card-name{
  width:33%
}

li .essui-avatar--small{
  display:inline-block !important
}

.suggestion-box li{
  display:flex;
  align-items:center;
  justify-content:flex-start
}

@media screen and (min-width: 375px)and (max-width: 851px){
  .card-name{
    width:50%
  }
}

.single-line-text{
  white-space:nowrap;
  overflow:hidden;
  text-overflow:ellipsis
}
.oI3FPkP7mERcC3dR4rJb{
  overflow:auto !important
}

.MPvX6jvAic7mzFxyigUm{
  height:calc(var(--vh, 1vh)*100 - 425px) !important;
  overflow-y:auto !important
}

.ufdpPZIesfLjyNCdjTVp{
  height:3.75rem !important
}

.O5BPbhKqbuMc7irXYRf5{
  height:calc(var(--vh, 1vh)*100 - 426px) !important;
  overflow-y:auto !important
}

.QnrtsakfOj8LpfkLqgwy{
  height:3.75rem !important
}

.xy6TBTv2oZtZS6vzI0Uj{
  align-items:center !important;
  display:flex !important;
  font-style:normal !important;
  font-size:30px !important;
  font-family:"Segoe UI" !important;
  font-weight:400 !important;
  line-height:36px !important;
  margin-top:8px !important;
  margin-bottom:16px !important
}

._jtxt_yQS8WFux8IWPYv{
  align-items:center !important;
  display:flex !important;
  font-style:normal !important;
  font-size:24px !important;
  font-family:"Segoe UI" !important;
  font-weight:400 !important;
  line-height:32px !important;
  color:#303030
}

.JyllyVYbZeUwe3Aio9J_{
  width:175px !important;
  height:64px !important;
  margin-top:2px !important;
  margin-bottom:16px !important
}

.KI8mkq251RTtn9BzyEmM{
  width:313px !important;
  height:36px !important;
  margin-top:16px !important;
  margin-bottom:16px !important
}

@media screen and (min-width: 375px)and (max-width: 449.5px){
  .MPvX6jvAic7mzFxyigUm{
    height:calc(var(--vh, 1vh)*100 - 590px) !important;
    overflow-y:auto !important
  }

  .O5BPbhKqbuMc7irXYRf5{
    height:calc(var(--vh, 1vh)*100 - 530px) !important;
    overflow-y:auto !important
  }
}

@media screen and (min-width: 374.5px)and (max-width: 389.5px){
  .O5BPbhKqbuMc7irXYRf5{
    height:calc(var(--vh, 1vh)*100 - 565px) !important;
    overflow-y:auto !important
  }
}

@media screen and (min-width: 450px)and (max-width: 520.5px){
  .MPvX6jvAic7mzFxyigUm{
    height:calc(var(--vh, 1vh)*100 - 530px) !important;
    overflow-y:auto !important
  }

  .O5BPbhKqbuMc7irXYRf5{
    height:calc(var(--vh, 1vh)*100 - 530px) !important;
    overflow-y:auto !important
  }
}

@media screen and (min-width: 521px)and (max-width: 767.5px){
  .MPvX6jvAic7mzFxyigUm{
    height:calc(var(--vh, 1vh)*100 - 490px) !important;
    overflow-y:auto !important
  }

  .O5BPbhKqbuMc7irXYRf5{
    height:calc(var(--vh, 1vh)*100 - 490px) !important;
    overflow-y:auto !important
  }
}

textarea::placeholder{
  color:#5e5e5e !important
}
.JKe4XHdgkUmlL0mm6WOu{
  column-gap:6px;
  margin-bottom:16px !important
}

.qUDETABWP5EaVcv6Ckdi{
  margin-top:16px !important
}

.jWHwwK3dGIjcHzm8IMF6{
  margin-top:16px !important
}
.t4Pm7IZ34VB4ceal28uL{
  background-color:#88d991 !important;
  border:0px !important;
  color:#000 !important
}

.t4Pm7IZ34VB4ceal28uL:hover{
  background-color:#6dbc77 !important
}

.t4Pm7IZ34VB4ceal28uL:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.t4Pm7IZ34VB4ceal28uL:active{
  background-color:#6dbc77 !important;
  color:#000 !important
}

.ovPHPFhqBgzpNnSmHI19{
  background-color:#ffb86d !important;
  border:0px !important;
  color:#000 !important
}

.ovPHPFhqBgzpNnSmHI19:hover{
  background-color:#ea9a3d !important
}

.ovPHPFhqBgzpNnSmHI19:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.ovPHPFhqBgzpNnSmHI19:active{
  background-color:#ea9a3d !important;
  color:#000 !important
}

.palmYObQ0fI6775Zvqnf{
  background-color:#ff897d !important;
  border:0px !important;
  color:#000 !important
}

.palmYObQ0fI6775Zvqnf:hover{
  background-color:#fc584c !important
}

.palmYObQ0fI6775Zvqnf:hover:active{
  background-color:#ff897d !important;
  color:#000 !important
}

.palmYObQ0fI6775Zvqnf:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.ZOiHC6aYqQZR8kfaqCGo{
  border:0px !important
}

.ZOiHC6aYqQZR8kfaqCGo:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.QDvNvsn5TPGw3URC8bg6{
  width:55.33px !important;
  height:56px !important
}
.buttonContainerRevamp{
  position:fixed !important;
  bottom:0 !important;
  width:88%;
  animation:force-repaint .1s
}

.buttonContainerRevamp button:not(:disabled) .essui-icon{
  fill:#000 !important;
  width:32px;
  height:32px
}

.buttonContainerRevamp button:disabled .essui-icon{
  width:32px;
  height:32px
}

@keyframes force-repaint{
  from{
    opacity:.99
  }

  to{
    opacity:1
  }
}

@media only screen and (min-width: 374px)and (max-width: 480px){
  .buttonContainerRevamp{
    width:92% !important
  }
}

@media only screen and (min-width: 480px)and (max-width: 767px){
  .buttonContainerRevamp{
    width:96% !important
  }
}

@media only screen and (min-width: 767px)and (max-width: 1024px){
  .buttonContainerRevamp{
    width:97% !important
  }
}

@media only screen and (min-width: 1025px)and (max-width: 1279px){
  .buttonContainerRevamp{
    width:97% !important
  }
}

@media only screen and (min-width: 1279px)and (max-width: 1450px){
  .buttonContainerRevamp{
    width:89% !important
  }
}

@media screen and (min-width: 1440px)and (max-width: 1919px){
  .buttonContainerRevamp{
    width:85% !important
  }
}

@media only screen and (min-width: 374px)and (max-width: 767.5px){
  .btn-margin-top{
    margin-top:5px
  }
}

@media only screen and (min-width: 1025px)and (max-width: 1440px){
  .dropuppadding{
    padding-right:40px
  }
}

@media screen and (min-width: 375px)and (max-width: 850px){
  .buttonContainerRevamp{
    margin-bottom:8px
  }
}

.mealdrop-up .essui-textinput{
  width:104px;
  height:56px;
  margin:0;
  padding:20px,12px,20px,12px
}

.essui-overflow-menu__direction-top{
  top:auto !important;
  bottom:100% !important;
  position:absolute !important;
  width:184px !important;
  margin-bottom:8px !important
}

@media only screen and (min-width: 375px){
  .mealdrop-up .essui-textinput{
    width:81px;
    height:56px;
    margin:0;
    padding:20px,12px,20px,12px
  }
}

.dropupwidth{
  width:184px
}

.mealdrop-up .essui-icon--16{
  margin-top:20px
}
body{
  margin:0;
  padding:0;
  height:100%;
  box-sizing:border-box;
  font-family:"Segoe UI",sans-serif;
  -webkit-font-smoothing:antialiased;
  -moz-osx-font-smoothing:grayscale;
  overflow:hidden
}

:root{
  --vh: 1vh
}

code{
  font-family:source-code-pro,Menlo,Monaco,Consolas,"Courier New",monospace
}

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

.vertical-scroll{
  overflow:hidden;
  overflow-y:auto
}

.container-height-gh{
  height:calc(var(--vh, 1vh)*100 - .01px - 61px);
  margin-top:0px
}

.container-height-fr{
  height:calc(var(--vh, 1vh)*100 - .01px - 225px);
  margin-top:0px
}

.container-height-fr-sm{
  height:calc(var(--vh, 1vh)*100 - .01px - 208px);
  margin-top:0px
}

.container-height-takeregister-gh{
  margin-top:-25px
}

.h-custom-screen{
  height:calc(var(--vh, 1vh)*100 - 60px)
}

.no-collapse{
  padding:.05px
}

.visually-hidden{
  border:0;
  clip:rect(0, 0, 0, 0);
  height:1px;
  margin:-1px;
  overflow:hidden;
  padding:0;
  position:absolute;
  white-space:nowrap;
  width:1px
}

.arrow-up{
  width:0;
  height:0;
  border-left:5px solid rgba(0,0,0,0);
  border-right:5px solid rgba(0,0,0,0);
  border-bottom:5px solid #fff
}

.checkbox-tick:checked{
  background-image:url("data:image/svg+xml,%3Csvg width=%2712%27 height=%279%27 viewBox=%270 0 12 9%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M4.5 8.99997L0 4.49997L0.707 3.79297L4.5 7.58547L11.293 0.792969L12 1.49997L4.5 8.99997Z%27 fill=%27white%27/%3E%3C/svg%3E%0A");
  border-color:rgba(0,0,0,0);
  background-size:90% 80%;
  background-position:50%;
  background-repeat:no-repeat
}

.search-icon{
  background-image:url("data:image/svg+xml, %3Csvg width=%2720%27 height=%2720%27 viewBox=%270 0 20 20%27 fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M20 18.954L14.4133 13.3673C15.7558 11.7556 16.4253 9.68835 16.2825 7.59562C16.1396 5.50288 15.1954 3.54579 13.6464 2.13146C12.0973 0.717125 10.0626 -0.0455437 7.96554 0.00210549C5.86847 0.0497547 3.87051 0.904053 2.38728 2.38728C0.904053 3.87051 0.0497547 5.86847 0.00210549 7.96554C-0.0455437 10.0626 0.717125 12.0973 2.13146 13.6464C3.54579 15.1954 5.50288 16.1396 7.59562 16.2825C9.68835 16.4253 11.7556 15.7558 13.3673 14.4133L18.954 20L20 18.954ZM1.50598 8.16382C1.50598 6.84703 1.89645 5.5598 2.62803 4.46492C3.3596 3.37004 4.39941 2.51669 5.61598 2.01277C6.83254 1.50886 8.17121 1.37701 9.46271 1.6339C10.7542 1.8908 11.9405 2.5249 12.8716 3.45601C13.8028 4.38713 14.4369 5.57345 14.6937 6.86494C14.9506 8.15644 14.8188 9.49511 14.3149 10.7117C13.811 11.9282 12.9576 12.9681 11.8627 13.6996C10.7678 14.4312 9.48062 14.8217 8.16382 14.8217C6.39865 14.8197 4.70634 14.1176 3.45818 12.8695C2.21001 11.6213 1.50793 9.92899 1.50598 8.16382Z%27 fill=%27%23797C7E%27/%3E%3C/svg%3E");
  background-repeat:no-repeat
}

.search-teacher-session-icon{
  background-image:url("data:image/svg+xml, %3Csvg width=%2715.5%27 height=%2715.5%27 viewBox=%270 0 20 20%27  fill=%27none%27 xmlns=%27http://www.w3.org/2000/svg%27%3E%3Cpath d=%27M20 18.954L14.4133 13.3673C15.7558 11.7556 16.4253 9.68835 16.2825 7.59562C16.1396 5.50288 15.1954 3.54579 13.6464 2.13146C12.0973 0.717125 10.0626 -0.0455437 7.96554 0.00210549C5.86847 0.0497547 3.87051 0.904053 2.38728 2.38728C0.904053 3.87051 0.0497547 5.86847 0.00210549 7.96554C-0.0455437 10.0626 0.717125 12.0973 2.13146 13.6464C3.54579 15.1954 5.50288 16.1396 7.59562 16.2825C9.68835 16.4253 11.7556 15.7558 13.3673 14.4133L18.954 20L20 18.954ZM1.50598 8.16382C1.50598 6.84703 1.89645 5.5598 2.62803 4.46492C3.3596 3.37004 4.39941 2.51669 5.61598 2.01277C6.83254 1.50886 8.17121 1.37701 9.46271 1.6339C10.7542 1.8908 11.9405 2.5249 12.8716 3.45601C13.8028 4.38713 14.4369 5.57345 14.6937 6.86494C14.9506 8.15644 14.8188 9.49511 14.3149 10.7117C13.811 11.9282 12.9576 12.9681 11.8627 13.6996C10.7678 14.4312 9.48062 14.8217 8.16382 14.8217C6.39865 14.8197 4.70634 14.1176 3.45818 12.8695C2.21001 11.6213 1.50793 9.92899 1.50598 8.16382Z%27 fill=%27%23797C7E%27/%3E%3C/svg%3E");
  background-repeat:no-repeat;
  background-position:left center;
  background-position-x:1%
}

.settings-container{
  width:100%;
  display:inline;
  padding-left:24px;
  margin-right:auto
}

.settings-wrapper{
  display:flex;
  flex-direction:row;
  background-color:#f7f7f7
}

#delete-attendance-code-error-banner{
  scroll-margin-top:64px
}

@media screen and (min-width: 1025px){
  .essui-error-page-container{
    height:calc(100% - 64px) !important
  }
}

@media screen and (min-width: 375px)and (max-width: 601px){
  .essui-error-page-container{
    position:relative !important;
    height:100vh !important
  }
}
#add-late-minutes-modal-wrapper .essui-dialog__content{
  max-height:450px
}

#add-late-minutes-modal-wrapper .late-minutes-reaction-button-validation-error{
  background-color:#ffedea;
  border-color:#d9372b
}

#add-late-minutes-modal-wrapper .late-minute-radio-buttons-wrapper{
  padding-top:5px;
  display:flex;
  gap:16px;
  flex-direction:row;
  flex-wrap:wrap
}

#add-late-minutes-modal-wrapper .late-minute-radio-buttons-wrapper button{
  width:101px
}

#add-late-minutes-modal-wrapper .late-minutes-number-input-wrapper{
  margin-top:5px
}

#add-late-minutes-modal-wrapper .late-minutes-number-input-wrapper .late-minutes-number-input{
  box-shadow:0 0 0 4px rgba(0,0,0,0);
  transition:box-shadow .1s ease
}

#add-late-minutes-modal-wrapper .late-minutes-number-input-wrapper .late-minutes-number-input:focus{
  box-shadow:0 0 0 4px #428fed;
  outline:none;
  margin-left:4px
}

#add-late-minutes-modal-wrapper .late-minutes-comment-input-wrapper{
  margin-top:15px
}

#add-late-minutes-modal-wrapper .late-minutes-comment-input-wrapper .late-minute-comment-input{
  box-shadow:0 0 0 4px rgba(0,0,0,0);
  transition:box-shadow .1s ease
}

#add-late-minutes-modal-wrapper .late-minutes-comment-input-wrapper .late-minute-comment-input:focus{
  box-shadow:0 0 0 4px #428fed;
  outline:none;
  margin-left:4px
}

#add-late-minutes-modal-wrapper .late-minutes-input-footer-wrapper{
  display:flex;
  flex-direction:row;
  gap:16px;
  justify-content:flex-end
}
#breadcrumbs-wrapper{
  display:flex;
  width:100%;
  line-height:24px;
  margin-bottom:0px !important
}

#breadcrumbs-wrapper span{
  display:flex
}

#breadcrumbs-wrapper svg{
  vertical-align:middle;
  margin-top:5px !important
}

.bread-crumb-wrapper{
  display:flex;
  padding-top:16px;
  padding-bottom:16px;
  width:100%
}
.fireRegisterWrapper{
  background-color:#f7f7f7;
  height:100vh;
  width:100%;
  overflow-y:hidden
}

.btnbg{
  background-color:#f7f7f7
}

.rtPadding{
  padding-right:0px !important
}

.ltPadding{
  padding-left:0px !important
}

.ellipsis{
  white-space:nowrap;
  width:100%;
  overflow:hidden;
  text-overflow:ellipsis
}

.marginLeft-auto{
  margin-left:auto !important
}

.fireHeader .essui-grid-col--sm-2{
  max-width:59% !important
}

.fireHeader .essui-button-icon-only--small{
  margin-right:0 !important
}

.font-Weight-500{
  font-weight:500
}

.pupilListWrapper{
  height:calc(var(--vh, 1vh)*100 - .01px - 155px)
}

.pupilListWrapper-mfe{
  height:calc(var(--vh, 1vh)*100 - .01px - 215px)
}

.pupilListWrapperSaveErr{
  height:calc(var(--vh, 1vh)*100 - .01px - 291px)
}

.pupilListWrapperSaveErr-mfe{
  height:calc(var(--vh, 1vh)*100 - .01px - 351px)
}

.save-errorBanner{
  width:100% !important;
  margin-top:16px !important;
  margin-bottom:4px !important
}

.padding-0{
  padding:0 !important
}

.bg-color-supporting-success-200{
  background-color:#88d991
}

.global-color-supporting-critical-300-bg{
  background-color:#ff897d
}

.global-color-neutral-100-bg{
  background-color:#e0e0e0
}

.rowbasedtableCustom{
  width:auto !important
}

.width-full{
  width:100% !important
}

.tableHead{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:0 !important;
  box-shadow:0px -10px 0px #f7f7f7
}

.selected{
  border:4px solid #428fed
}

@media screen and (max-width: 767.5px){
  .pupilListWrapper{
    height:calc(var(--vh, 1vh)*100 - .01px - 225px)
  }

  .pupilListWrapperSaveErr{
    height:calc(var(--vh, 1vh)*100 - .01px - 341px)
  }

  .save-errorBanner{
    margin-bottom:0px !important
  }
}

@media only screen and (min-width: 374px)and (max-width: 766px){
  .pupilListWrapper-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 375px) !important
  }

  .pupilListWrapperSaveErr-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 511px)
  }
}

@media only screen and (min-width: 1024px)and (max-width: 1366px){
  .pupilListWrapper-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 280px) !important
  }

  .pupilListWrapperSaveErr-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 616px) !important
  }
}

@media only screen and (min-width: 1024px)and (max-width: 1292px){
  .pupilListWrapper-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 280px) !important
  }

  .pupilListWrapperSaveErr-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 616px) !important
  }
}

@media only screen and (min-width: 1367px)and (max-width: 1921px){
  .pupilListWrapper-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 215px) !important
  }

  .pupilListWrapperSaveErr-mfe{
    height:calc(var(--vh, 1vh)*100 - .01px - 401px)
  }
}

.fireRegisterWrapper .tr-missing-color{
  background-color:#ff897d
}

.fireRegisterWrapper .tr-present-color{
  background-color:#88d991
}

.fireRegisterWrapper .tc-anr-color{
  background-color:#1c1c1c
}

.fireRegisterWrapper .tr-absent-color{
  background-color:#ff897d
}
.UR0xzwQuypJVz7dVj0o4{
  background-color:#88d991 !important;
  border:0px !important
}

.UR0xzwQuypJVz7dVj0o4:hover{
  background-color:#6dbc77 !important
}

.UR0xzwQuypJVz7dVj0o4:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.UR0xzwQuypJVz7dVj0o4:active{
  background-color:#6dbc77 !important;
  color:#303030 !important
}

.nzFts4JDbxsnAqqVJ5WP{
  border:0px !important
}

.nzFts4JDbxsnAqqVJ5WP:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.VTDbbTfnR4OWNbb_oPAD{
  background-color:#ff897d !important;
  border:0px !important
}

.VTDbbTfnR4OWNbb_oPAD:hover{
  background-color:#fc584c !important
}

.VTDbbTfnR4OWNbb_oPAD:hover:active{
  background-color:#ff897d !important;
  color:#303030 !important
}

.VTDbbTfnR4OWNbb_oPAD:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}
.buttonContainer button:not(:disabled) .essui-icon{
  fill:#000 !important;
  width:32px;
  height:32px
}

.buttonContainer button:disabled .essui-icon{
  width:32px;
  height:32px
}

.margin-left-auto{
  margin-left:auto
}

@media only screen and (min-width: 374px)and (max-width: 767.5px){
  .btn-margin-top{
    margin-top:5px
  }
}

@media screen and (min-width: 375px)and (max-width: 850px){
  .buttonContainer{
    margin-bottom:8px
  }
}
.attcritical{
  background-color:#ff897d !important;
  border:0px !important
}

.attcritical:hover{
  background-color:#fc584c !important
}

.attcritical:hover:active{
  background-color:#ff897d !important;
  color:#303030 !important
}

.attsuccess{
  background-color:#6dbc77 !important;
  border:0px !important
}

.attsuccess:hover{
  background-color:#52a15f !important
}

.attsuccess:hover:active{
  background-color:#6dbc77 !important;
  color:#303030 !important
}

.justifycontent{
  display:flex !important;
  justify-content:space-between !important
}

@media only screen and (min-width: 375px){
  .btn-margin-top{
    margin-top:5px
  }
}
.incompleteRegister{
  border-radius:8px;
  display:flex;
  padding:8px;
  flex-direction:column;
  justify-content:center;
  gap:16px;
  flex:1 0 0;
  align-self:stretch;
  background-color:#fff !important
}

.incompleteRegisterWrapper{
  margin-top:16px;
  height:calc(var(--vh, 1vh)*100 - .01px - 300px);
  overflow-y:auto
}

.incompleteRegisterWrapperMobile{
  margin-top:16px;
  height:calc(var(--vh, 1vh)*100 - .01px - 275px);
  overflow-y:auto
}
.IncompleteRegisterList{
  margin-bottom:16px
}

.load-errorBanner{
  width:100% !important;
  margin-top:16px !important
}

.resetWrapper{
  display:flex;
  justify-content:flex-end;
  margin-bottom:32px
}

.resetTablet{
  margin-right:24px;
  margin-top:16px
}

.resetDesktop{
  margin-right:36px;
  margin-top:16px
}
.global-color-neutral-50-bg{
  background-color:#f7f7f7
}
.missingPupilsWrapper{
  background-color:#f7f7f7;
  height:100vh;
  width:100%;
  overflow-y:hidden
}

.missingPupilsListWrapper{
  height:calc(var(--vh, 1vh)*100 - .01px - 146px);
  overflow-x:hidden
}

.missingPupilsListWrapper-mfe{
  height:calc(var(--vh, 1vh)*100 - .01px - 196px);
  overflow-x:hidden
}

.missingPupilsListFooter{
  display:flex;
  padding:8px 16px;
  justify-content:flex-end;
  align-items:center;
  background-color:#fff;
  border-radius:0 0 8px 8px;
  border:1px solid #e0e0e0;
  border-width:1px 1px 1px 1px;
  height:56px !important;
  color:#5e5e5e
}

.essui-rowbasedtable-wrapper{
  border-radius:8px 8px 0 0 !important
}

.buttonbg{
  background-color:#f7f7f7
}

.rightPadding{
  padding-right:0px !important
}

.leftPadding{
  padding-left:0px !important
}

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

.tableHead{
  position:-webkit-sticky !important;
  position:sticky !important;
  top:0 !important;
  box-shadow:0px -10px 0px #f7f7f7
}

.color-neutral-600{
  color:#5e5e5e
}

#rowbasedsort-id div{
  display:flex !important;
  align-items:center !important;
  text-transform:capitalize !important
}

.marginLeft-auto{
  margin-left:auto !important
}

.fireHeader .essui-grid-col--sm-2{
  max-width:59% !important
}

.fireHeader .essui-button-icon-only--small{
  margin-right:0 !important
}

.padding-0{
  padding:0 !important
}

.global-color-supporting-critical-300-bg{
  background-color:#ff897d !important
}

.color-neutral-800{
  color:#303030
}

.global-color-neutral-100-bg{
  background-color:#e0e0e0 !important
}

.global-color-neutral-50-bg{
  background-color:#f7f7f7
}

.essui-rowbasedtable{
  width:auto !important
}

.width-full{
  width:100% !important
}

.rounded-border{
  border-radius:8px 0 0 8px
}

.essui-loader-area-overlay{
  position:absolute;
  top:0;
  right:0;
  max-width:720px !important;
  animation:slide-in .4s linear
}

.MissingPupilCardWrapper{
  display:flex;
  justify-content:flex-start !important;
  background-color:#fff;
  height:96px;
  width:100%;
  border-radius:8px
}

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

.essui-textarea-content{
  width:100% !important
}

.no-missing-pupils-page .essui-empty-data{
  height:100%
}

.nomissingPupilsListWrapper{
  height:calc(var(--vh, 1vh)*100 - .01px - 88px);
  overflow-x:hidden
}

.nomissingPupilsListWrapper-mfe{
  height:calc(var(--vh, 1vh)*100 - .01px - 138px);
  overflow-x:hidden
}

.button-width .essui-empty-data .essui-button{
  width:auto !important
}

.min-width-127{
  min-width:127px;
  width:50%
}

.timeLineNarrative{
  gap:42px
}

.timelineWrapper{
  overflow-x:auto;
  max-width:100%
}

.sectionTimelineheader{
  gap:42px;
  display:flex;
  justify-content:center;
  padding-left:48px;
  padding-right:48px;
  text-wrap:nowrap
}

.parentContactWrapper{
  display:flex;
  justify-content:space-between;
  align-items:center;
  background-color:#fff;
  height:76px;
  padding:8px;
  width:100%;
  border-radius:8px;
  margin-top:16px
}

.errorWrapper{
  color:#a86500 !important;
  margin-bottom:0 !important
}

.contactWrapper{
  width:100%
}

.mobilNumWrapper{
  display:flex;
  width:100%;
  justify-content:flex-end;
  color:#2177c2;
  -webkit-text-decoration-line:underline;
          text-decoration-line:underline
}

@keyframes slide-in{
  0%{
    transform:translateX(100%)
  }

  100%{
    transform:translateX(0%)
  }
}

.success{
  background-color:#88d991 !important;
  border:0px !important;
  color:#303030 !important
}

.success:hover{
  background-color:#6dbc77 !important
}

.success:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.success:active{
  background-color:#6dbc77 !important;
  color:#303030 !important
}

.warning{
  background-color:#ffb86d !important;
  border:0px !important;
  color:#303030 !important
}

.warning:hover{
  background-color:#ea9a3d !important
}

.warning:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.warning:active{
  background-color:#ea9a3d !important;
  color:#303030 !important
}

.attcritical{
  background-color:#ff897d !important;
  border:0px !important;
  color:#303030 !important
}

.attcritical:hover{
  background-color:#fc584c !important
}

.attcritical:hover:active{
  background-color:#ff897d !important;
  color:#303030 !important
}

.attcritical:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.submission{
  border:0px !important
}

.submission:disabled{
  background-color:#e0e0e0 !important;
  color:#c6c6c6 !important;
  pointer-events:none !important
}

.panel-footer{
  padding-left:12px !important;
  padding-right:12px !important;
  padding-top:24px !important;
  padding-bottom:32px !important
}

.panel-footer-bottom{
  margin-bottom:0px !important
}

.panel-footer-mobile{
  margin-bottom:80px !important
}

.full-width{
  width:100%
}

.reg-grp-wrap{
  white-space:normal;
  overflow-wrap:anywhere
}

.rowbasedtableCustom{
  width:auto !important
}

.emptyRowfullWidth{
  width:100% !important
}

.load-errorBanner{
  margin-top:16px !important;
  width:100% !important
}

.save-errorBanner{
  width:100% !important;
  margin-top:-6px !important;
  margin-bottom:16px !important
}

.bg-color-supporting-success-200{
  background-color:#88d991
}

.missingPupilsWrapper .tr-missing-color{
  background-color:#ff897d
}

.missingPupilsWrapper .tr-present-color{
  background-color:#88d991
}

.missingPupilsWrapper .tr-absent-color{
  background-color:#ff897d
}
#action-card-settings{
  margin-left:2px;
  width:365px;
  height:109px
}

.essui-activity-card-center{
  width:-webkit-fit-content !important;
  width:-moz-fit-content !important;
  width:fit-content !important
}
.width-full{
  width:98% !important
}

.errorWrapper{
  max-width:578px
}

.color-supporting-critical-500{
  color:#d9372b
}

#ng-calendar-wrapper div#ng-calendar-content{
  z-index:9 !important
}

.discard-footer{
  display:flex;
  justify-content:flex-end;
  gap:20px
}

.ml{
  margin-left:auto
}

.Side-Panel .essui-side-panel-heading{
  align-items:center;
  display:flex;
  padding:37px 14px 20px
}

.Side-Panel .essui-help-text{
  white-space:nowrap
}

.Side-Panel .mt{
  margin-top:32px
}

.Side-Panel .mb{
  margin-bottom:32px
}

.Side-Panel .essui-side-panel-content{
  padding:24px !important
}

.Side-Panel .association-dropdown input{
  text-overflow:ellipsis;
  overflow:hidden;
  white-space:nowrap;
  padding-right:35px
}

.pupilsTablePagination{
  justify-content:right;
  display:grid
}

.pupilsTablePagination .essui-pagination{
  margin-right:15px
}

.association-side-panel-loader{
  height:80%;
  display:flex;
  align-items:center;
  justify-content:center
}

.attendance-code-table-international-wrapper .essui-table__cell--header{
  text-transform:none !important
}
.color-neutral-0{
  color:#fff
}

.color-primary-200{
  color:#a3c9ff
}

.color-neutral-200{
  color:#c6c6c6
}

.color-neutral-600{
  color:#5e5e5e
}

.color-neutral-800{
  color:#303030
}

.color-neutral-900{
  color:#1c1c1c
}

.color-supporting-critical-500{
  color:#d9372b
}

.bg-color-primary-200{
  background-color:#a3c9ff
}

.bg-color-neutral-0{
  background-color:#fff
}

.bg-color-supporting-success-200{
  background-color:#88d991
}

.divider{
  box-sizing:border-box;
  width:1px;
  background:#c6c6c6;
  border-left:1px solid #c6c6c6;
  flex:none;
  order:0;
  align-self:stretch;
  flex-grow:0
}

.sessionContainerBox{
  height:h-24;
  background-color:#fff;
  padding-left:1rem;
  padding-top:1rem;
  padding-bottom:1rem;
  padding-right:1rem
}

.isMultipleLesson{
  border:2px;
  border-color:#c6c6c6;
  border-style:inherit;
  border-radius:8px;
  margin-bottom:20px
}

.isLessonOrSession{
  border:2px;
  border-color:#e0e0e0;
  border-style:inherit;
  border-radius:10px
}

.isMultipleCurrentLesson{
  border:2px;
  border-color:#a3c9ff;
  border-style:inherit;
  border-radius:8px;
  margin-bottom:20px
}

.inlineBlockText{
  width:250px;
  writing-mode:horizontal-tb
}

.divider-border{
  border:2px;
  border-color:#e0e0e0;
  border-style:inherit
}
.color-neutral-0{
  color:#fff
}

.color-primary-200{
  color:#a3c9ff
}

.color-primary-300{
  color:#72adff
}

.color-primary-500{
  color:#2177c2
}

.color-neutral-200{
  color:#c6c6c6
}

.border-color-neutral-200{
  border-color:#c6c6c6
}

.color-neutral-600{
  color:#5e5e5e
}

.color-neutral-800{
  color:#303030
}

.color-neutral-900{
  color:#1c1c1c
}

.color-neutral-1000{
  color:#000
}

.color-supporting-success-400{
  color:#52a15f
}

.bg-color-primary-200{
  background-color:#a3c9ff
}

.bg-color-primary-500{
  background-color:#2177c2
}

.bg-color-supporting-success-200{
  background-color:#88d991
}

.bg-color-supporting-success-300{
  background-color:#6dbc77
}
.bRKXxSspcOEsdjvRhbTS{
  border-collapse:separate;
  border-spacing:0 4px;
  background-color:#ececec;
  padding-left:8px;
  padding-right:8px;
  padding-bottom:2px;
  padding-top:14px
}

.g2NUP0eHqwX9tLJi5UFQ{
  width:100%;
  position:absolute;
  background:#ececec;
  box-shadow:2px 2px 2px #bdc3c7,-2px 2px 2px #bdc3c7,2px 2px 2px #bdc3c7;
  z-index:9999
}
.MittA7INVRVgkOYJcDjJ::-webkit-search-cancel-button{
  position:relative;
  right:2%;
  color:#111;
  cursor:pointer
}

.JJrvsDSXSLMCIFWc2i7u:focus{
  box-shadow:2px 2px 2px #bdc3c7,-2px 2px 2px #bdc3c7,2px 2px 2px #bdc3c7
}

.Zx_IoSDHXQgdKsYhtOkH{
  box-shadow:2px 2px 2px #bdc3c7,-2px 2px 2px #bdc3c7,2px 2px 2px #bdc3c7
}

input::placeholder{
  font-family:"Segoe UI";
  font-style:normal;
  font-weight:400;
  font-size:14px;
  line-height:16px;
  color:#5e5e5e
}
.tab-container-group .essui-tablist .essui-tab .child-span{
  margin-left:0 !important
}

.global-color-neutral-50-bg{
  background-color:#f7f7f7
}
.wgWIxxwIiUmuSgE03Gpg::-webkit-search-cancel-button{
  position:relative;
  right:2%;
  color:#111
}

.g3bR503uj_0W31hPMZBg:focus{
  box-shadow:2px 2px 2px #bdc3c7,-2px 2px 2px #bdc3c7,2px 2px 2px #bdc3c7
}

.AQg5P1R05l8Um8AuYwCe{
  box-shadow:2px 2px 2px #bdc3c7,-2px 2px 2px #bdc3c7,2px 2px 2px #bdc3c7
}

input::placeholder{
  font-family:"Segoe UI";
  font-style:normal;
  font-weight:400;
  font-size:14px;
  line-height:16px;
  color:#5e5e5e
}
.color-neutral-0{
  color:#fff
}

.color-primary-200{
  color:#a3c9ff
}

.color-primary-300{
  color:#72adff
}

.color-primary-500{
  color:#2177c2
}

.color-neutral-200{
  color:#c6c6c6
}

.border-color-neutral-200{
  border-color:#c6c6c6
}

.color-neutral-600{
  color:#5e5e5e
}

.color-neutral-800{
  color:#303030
}

.color-neutral-900{
  color:#1c1c1c
}

.color-neutral-1000{
  color:#000
}

.color-supporting-success-400{
  color:#52a15f
}

.bg-color-primary-200{
  background-color:#a3c9ff
}

.bg-color-primary-500{
  background-color:#2177c2
}

.bg-color-supporting-success-200{
  background-color:#88d991
}

.bg-color-supporting-success-300{
  background-color:#6dbc77
}
.ItCL3tnydJWbEE04dbqu{
  border-collapse:separate;
  border-spacing:0 4px;
  background-color:#ececec;
  padding-left:8px;
  padding-right:8px;
  padding-bottom:2px;
  padding-top:14px
}

.hKYVY23gBUHdTruNx430{
  width:100%;
  position:absolute;
  background:#ececec;
  box-shadow:2px 2px 2px #bdc3c7,-2px 2px 2px #bdc3c7,2px 2px 2px #bdc3c7;
  z-index:9999
}
.regGroupContainerBox{
  height:h-24;
  background-color:#fff;
  padding-left:1rem;
  padding-top:1rem;
  padding-bottom:1rem;
  padding-right:1rem;
  border:2px;
  border-color:#e0e0e0;
  border-style:inherit;
  border-radius:10px;
  margin-bottom:20px
}

.load-errorBanner{
  width:100% !important
}

@media screen and (max-width: 767px){
  .tag-height{
    margin-top:8px
  }

  .load-errorBanner{
    min-width:308px !important
  }
}

@media screen and (min-width: 767.5px){
  .positionabsolute{
    justify-content:center;
    align-items:center;
    white-space:nowrap
  }

  .load-errorBanner{
    min-width:308px !important
  }
}

.bg-color-neutral-0{
  background-color:#fff
}
.table-utility-container{
  display:flex;
  align-items:center;
  justify-content:space-between
}

.tableHead-container [data-testid=columnheader]{
  display:flex;
  align-items:center;
  text-transform:capitalize
}

.checkbox-table-head{
  width:56px;
  height:56px
}
.dialog-wrapper .dialog-content{
  display:flex;
  flex-direction:column;
  overflow-y:auto;
  overflow-x:hidden;
  height:-webkit-max-content;
  height:max-content;
  padding:0 12px;
  gap:2rem
}

.dialog-wrapper .essui-dialog__footer{
  display:flex;
  justify-content:flex-end;
  gap:20px
}

.date-filter{
  display:flex;
  align-items:center;
  margin-top:20px
}

.group-filters{
  display:flex;
  flex-direction:column;
  gap:1rem
}

.group-dropdown{
  display:flex;
  flex-direction:column
}

.search-wrapper{
  display:flex;
  flex-direction:column;
  width:90%;
  gap:5px
}

.ml-32{
  margin-left:32px
}

.subgroup-dropdown{
  display:flex;
  flex-direction:column
}

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

@media screen and (min-width: 375px)and (max-width: 601px){
  .ml-32{
    margin-left:0px
  }
}