@media screen and (max-height: 800px) {
  /*RESET CSS*/
  html,
  body,
  div,
  span,
  object,
  iframe,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  blockquote,
  pre,
  abbr,
  address,
  cite,
  code,
  del,
  dfn,
  em,
  img,
  ins,
  kbd,
  q,
  samp,
  small,
  strong,
  sub,
  sup,
  var,
  b,
  i,
  dl,
  dt,
  dd,
  ol,
  ul,
  li,
  fieldset,
  form,
  label,
  legend,
  table,
  caption,
  tbody,
  tfoot,
  thead,
  tr,
  th,
  td,
  article,
  aside,
  canvas,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  menu,
  nav,
  section,
  summary,
  time,
  mark,
  audio,
  video {
    /* font-size: 16px; */
  }

  .sunE-container {
    width: 100%;
    height: auto;
    /* max-width: 1200px; */
    margin: 0 auto;
    /* padding: 0; */
  }

  .homepage-teacher.sunE-container-box {
    padding: 10px 20px 0px;
  }

  .list-menu-i a.menu-item {
    font-size: 14px;
    color: #404041;
    line-height: 34px;
    align-items: center;
    padding: 10px 0 10px 32px;
    text-decoration: none;
    margin: 8px 0;
  }

  .list-menu-i .menu-img {
    width: 60px;
    max-height: 32px;
  }

  .list-menu-i .menu-img img {
    width: 30px;
  }

  .list-menu-i a.menu-item span {
    font-size: 14px;
    color: #404041;
  }

  .sunE-sidebar {
    width: 255px;
  }

  .plan-item-content p {
    font-size: 14px;
  }

  .btn-plan-item {
    width: 21px;
  }

  .his img {
    width: 27px;
  }

  .plan-item-content p.text-light {
    padding: 0 0 0 10px;
  }

  .slider-custom-2 .slick-arrow.slick-prev {
    left: -10px;
  }

  /* Slider for student homepage */

  .slider_homepage_student .slider-custom-student {
    /* margin-bottom: 1.1rem !important; */
  }

  .slider-custom-student .slick-arrow.slick-prev {
    left: 33px;
  }

  .slider-custom-2 .slick-next,
  .slider-custom-2 .slick-prev {
    width: 42px;
    height: auto;
  }

  .slider-custom-2 .slick-arrow {
    background: #00bbb6;
    padding: 12px 14px;
    position: absolute;
    border-radius: 12px;
    border: none;
    z-index: 9;
    text-align: center;
  }

  .item-top-title-main p {
    text-align: center;
    font-size: 17px;
    padding: 0;
    color: #fff;
    font-family: "Myriadpro-SemiBold";
  }

  .slick-dots li button:before {
    font-size: 7px;
    line-height: 17px;
    position: absolute;
    top: 0;
    left: 0;
    width: 14px;
    height: 14px;
    content: "•";
    text-align: center;
    opacity: 0.25;
    color: #000;
  }

  .slider-custom-2 .slick-dots li button:before {
    font-size: 14px;
    color: #00a79d;
  }

  .slider-item-content .img-thumb {
    margin: 12px;
    width: 237px;
    height: 210px;
    border-radius: 12px;
    overflow: hidden;
  }

  .slider-custom-2 .slider-item-content {
    margin: 12px;
    padding: 6px 13px;
  }

  /* For Student */
  .slider-custom-student .slider-item-content {
    margin: 12px;
    padding: 6px 9px;
  }

  .slider-custom-student .slider_student_wrapper .slider-item-content {
    margin-top: 0.75rem !important;
    margin-bottom: 0.6rem !important;
  }

  .slider-item-desc .item-top-title-main {
    margin: 12px 0;
    background-image: linear-gradient(to right, #00e1a0, #00b9b7);
    padding: 12px 24px;
    border-radius: 30px;
    max-height: 66px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 25px;
  }

  .edit-plan-box .btn p {
    font-size: 14px;
    line-height: 14px;
  }

  .edit-plan-box .btn img {
    width: 24px;
  }

  .sunE-right-container {
    width: 100%;
    height: 100vh;
    overflow: auto;
    padding: 36px 16px 10px 16px;
  }

  .sunE-container-box.diemdanh {
    padding: 20px 0 10px;
  }

  .sunE-container-box {
    padding: 24px 12px 12px;
  }

  .orange span,
  .red span,
  .success-text span {
    line-height: 27px;
  }

  .chart-content canvas {
    margin-left: 0;
  }

  .sunE-plan-list {
    max-height: 330px;
    overflow: auto;
    padding-right: 9px;
  }

  .no-plan img {
    width: 243px;
  }

  .no-plan h2 {
    font-family: "Myriadpro-SemiBold";
    font-size: 21px;
    padding: 0;
    margin: 0;
    color: #00a79d;
  }

  .dtb-sum-slider {
    bottom: -45px;
  }

  .dtb-sum-slider .w {
    width: 168px;
  }

  .slider-custom-2 .dtb-sum-slider .w {
    width: 194px;
  }

  .img-check-calendar {
    top: -1px;
    right: -6px;
    width: 16px;
  }

  .class-box .class-box-img {
    width: 127px;
    height: 103px;
  }

  .title-line-blue {
    font-size: 17px;
    line-height: 21px;
    padding: 7px;
    text-align: center;
    border-radius: 17px;
    background-image: linear-gradient(to right, #00e1a0, #00b9b7);
  }

  .two-line {
    max-height: 53px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .class-box-desc p,
  .class-box-desc span {
    font-size: 15px;
  }

  .class-box-desc span.class-online,
  .class-box-desc span.class-offline {
    font-size: 18px;
    font-family: "Myriadpro-SemiBold";
  }

  .sunE-main-title h1 {
    font-size: 28px;
    line-height: 38px;
    padding-left: 7px;
  }

  .sunE-main-title .line-h {
    display: block;
    width: 3px;
    height: 35px;
    background: #00bbb5;
    border-radius: 2px;
    border: none;
  }

  .sunE-class-list {
    padding-right: 17px;
    max-height: calc(100vh - 190px);
    padding-bottom: 28px;
    overflow: auto;
  }

  .class-index-box .class-index-box-img {
    width: 244px;
    height: 234px;
  }

  .class-index-box {
    box-sizing: border-box;
    padding: 13px;
    border-radius: 17px;
    background: #fff;
    display: inline-block;
    width: 100%;
  }

  .info-gr .info-img {
    width: 28px;
  }

  .info-gr {
    margin: 11px 0 0;
  }

  .info-gr img {
    height: 18px;
    cursor: pointer;
  }

  .info-gr .info-con p {
    font-size: 15px;
    font-family: "Myriadpro-Light";
    line-height: 26px;
  }

  .class-select-box {
    padding: 17px 0px 0;
    display: inline-block;
    width: 140px;
    height: 140px;
    background: #fff;
    margin: 0 6px;
    border-radius: 12px;
    border: none;
    cursor: pointer;
    box-sizing: border-box;
    overflow: hidden;
  }

  .class-select-box .select-img {
    height: 78px;
  }

  .class-select-box img {
    height: 100%;
  }

  .class-select-box p {
    font-size: 15px;
    padding: 9px 0 0;
    margin: 0;
  }

  .box-giaotrinh-gr.hei-custom.edit {
    height: 130px;
    padding: 0 13px 0 28px;
    margin: 0 0 17px 0;
  }

  .box-select-info p {
    color: #221f1f;
    font-size: 17px;
    line-height: 21px;
  }

  .box-select-info span {
    font-size: 15px;
  }

  .box-select-file-full {
    flex: 1;
  }

  .box-select-file-full p {
    flex: 1;
    text-align: left;
  }

  .gtcn-menu-gr span {
    font-size: 21px;
    margin-right: 26px;
  }

  .box-giaotrinh-gr.hei-custom {
    height: 80px;
  }

  .box-giaotrinh-gr .thumb {
    position: absolute;
    top: -5px;
    left: -26px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    border: 3px solid #fff;
    border-radius: 50%;
    width: 65px;
    height: 65px;
    box-shadow: 0 1px 8px 0 rgb(21 27 38 / 24%);
  }

  .box-giaotrinh-gr .thumb3 {
    position: absolute;
    top: -5px;
    left: -26px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ccedeb;
    border: 3px solid #fff;
    border-radius: 50%;
    width: 65px;
    height: 65px;
    box-shadow: 0 1px 8px 0 rgb(21 27 38 / 24%);
  }

  .box-giaotrinh-gr .thumb img {
    width: 45px;
    height: 45px;
    object-fit: contain;
  }

  .box-giaotrinh-gr .thumb3 img {
    width: 35px;
    height: 35px;
    object-fit: contain;
  }

  .box-giaotrinh-gr .thumb2 {
    width: 75px;
    height: 75px;
  }

  .box-giaotrinh-gr.hei-custom .thumb {
    top: 13px;
  }

  .box-giaotrinh-gr.hei-custom .thumb3 {
    top: 13px;
  }

  .gt_list_hei {
    max-height: calc(100vh - 280px);
    padding: 0 13px;
    overflow: auto;
  }

  .btn-user-add img,
  .btn-user-share img {
    width: 37px;
  }

  .sunE-title-medium {
    font-size: 18px;
    margin: 0;
    padding: 0 0 17px;
  }

  .sunE-right-container.add_student_container {
    padding: 35px 16px 0 16px;
  }

  .add_student {
    height: calc(100vh - 103px);
    width: 100%;
  }

  .sunE-no-student .add_code_student-gr {
    top: 480px;
  }

  .add_code_student-gr {
    width: 368px;
    position: absolute;
    left: 50%;
    top: 510px;
    transform: translate(-50%, -50%);
  }

  .sunE-input-border-blue-gr input {
    height: 37px;
    border: 1px solid #399098;
    border-radius: 18px;
    padding: 0 41px;
  }

  .sunE-input-border-blue-gr .ico_input {
    position: absolute;
    /* top: 7px; */
    /* left: 11px; */
    width: 28px;
  }

  .btn-filter button {
    padding: 0 30px 0 40px;
  }

  .btn-filter img {
    position: absolute;
    top: 10px;
    left: 24px;
    width: 17px;
  }

  .sunE-giaotrinh-item .img {
    width: 104px;
    height: 95px;
  }

  .sunE-giaotrinh-item .content {
    padding-left: 17px;
    padding-top: 8px;
  }

  .sunE-giaotrinh-item .content h2.title {
    font-size: 16px;
    line-height: 20px;
  }

  h2.title {
    font-family: "Myriadpro-Bold";
    font-size: 16px;
  }

  .sunE-giaotrinh-item .content h3.desc {
    font-size: 16px;
    line-height: 20px;
    margin: 0 0 8px;
  }

  .sunE-giaotrinh-item .content .easy,
  .sunE-giaotrinh-item .content .hard,
  .sunE-giaotrinh-item .content .medium,
  .sunE-giaotrinh-item .content .normal {
    padding: 3px 8px;
  }

  .lb-dc-gr .lb {
    margin-right: 8px;
  }

  .lb-dc-gr span {
    color: #fff;
    font-size: 14px;
    padding: 4px 13px;
    border-radius: 12px;
    line-height: 18px;
  }

  .topic {
    background: #fff;
    padding: 26px 18px;
    border-radius: 18px;
    margin: 0 0 13px;
  }

  .cb-score-gr p {
    font-size: 15px;
    margin: 0 0 8px;
  }

  .cb-score-gr span {
    font-size: 28px;
    font-family: "Myriadpro-Bold";
    color: #00a69c;
  }

  .item-student .item-student-img {
    width: 61px;
    height: 61px;
    border-radius: 31px;
  }

  .list-detail .item-student {
    background: #fff;
    border-radius: 18px;
    padding: 8px 8px 8px 26px;
    margin: 0 0 8px 47px;
    min-height: 90px;
  }

  .list-detail .item-student-img {
    position: absolute;
    top: 10px;
    left: -41px;
    width: 73px;
    height: 73px;
    border-radius: 37px;
    overflow: hidden;
  }

  .item-student-name h2 {
    font-size: 16px;
    line-height: 18px;
    margin: 12px 0 12px;
  }

  .list-detail .item-student .item-student-name span {
    font-size: 16px;
    line-height: 32px;
  }

  .list-detail .item-student .item-student-name img {
    width: 32px;
  }

  .box-title-bg {
    border-radius: 21px;
    height: 37px;
  }

  .box-title-bg p {
    font-size: 20px;
    /* line-height: 42px; */
  }

  .box-criteria-score-title p {
    font-size: 16px;
    padding-left: 13px;
  }

  .box-criteria-comment h2 {
    font-size: 21px;
    padding-left: 30px;
    margin: 0 0 6px;
  }

  .box-criteria-comment textarea {
    padding: 13px 13px 8px 26px;
    border-radius: 18px;
    resize: none;
    width: 100%;
    height: 200px;
  }

  .post-content {
    background: #fff;
    padding: 26px 18px;
    border-radius: 18px;
    margin: 0;
  }

  .title-post-box {
    font-size: 21px;
    line-height: 35px;
  }

  .btn-mark {
    height: 35px;
    line-height: 35px;
    padding: 0 0 0 18px;
    box-sizing: border-box;
    border-radius: 20px;
    border: none;
    cursor: pointer;
    margin: 0 8px 0 0;
  }

  .btn-mark p {
    font-size: 16px;
    padding: 0 30px;
  }

  .btn-mark img {
    width: 32px;
  }

  .btn-help {
    height: 35px;
    line-height: 35px;
    border-radius: 20px;
    border: none;
    cursor: pointer;
    padding: 0 26px;
  }

  .btn-help img {
    width: 16px;
  }

  .chambai.writing {
    margin: 0 0 13px;
  }

  .post-content .content-box-edit {
    padding: 13px 13px 8px 30px;
    border-radius: 18px;
    resize: none;
    width: 100%;
    font-size: 15px;
    height: 170px;
    overflow: auto;
  }

  .popup-tag {
    padding: 8px;
    font-size: 18px;
  }

  .sunE-giaobai-list {
    padding: 18px 26px;
    border-radius: 18px;
    max-height: calc(100vh - 190px);
    margin: 0 0 5px;
  }

  .bg_no_gb {
    width: 340px;
  }

  .sunE-giaotrinh-item .content p,
  .sunE-giaotrinh-item .content span {
    font-size: 16px;
    line-height: 21px;
    margin: 0 0 8px;
  }

  .wh27 {
    width: 23px;
    height: 23px;
  }

  .btn-setting img {
    top: 7px;
    left: 17px;
    width: 25px;
  }

  .box-info-giaobai {
    background: #fff;
    padding: 24px 18px;
    border-radius: 18px;
  }

  .box-info-giaobai h3.desc {
    font-size: 16px;
    line-height: 21px;
    margin: 0 0 26px;
  }

  .box-info-giaobai p {
    font-size: 15px;
    line-height: 21px;
    margin: 0 0 8px;
  }

  .sunE-container-box.giaobai-ganday {
    padding: 23px 18px 0;
  }

  .list-giaobai.chualam {
    max-height: calc(100vh - 260px);
  }

  .item-student .stt {
    line-height: 61px;
    font-size: 15px;
    width: 26px;
  }

  .btn-check-gr {
    padding-top: 15px;
  }

  .f20 {
    font-size: 18px !important;
  }

  .sunE-input-group label {
    display: block;
    margin: 0;
    padding: 0 0 8px;
    font-size: 18px;
    color: #000;
  }

  .select-gr select {
    width: 37px;
    height: 47px;
    border-radius: 12px;
    font-size: 15px;
  }

  .check-box-gr label {
    font-size: 15px;
  }

  .datlichnhac-input-gr .left,
  .datlichnhac-input-gr .right {
    font-size: 15px;
  }

  .datlichnhac-input-gr input.dln-mins {
    height: 37px;
    outline: none;
    border: none;
    border-radius: 18px;
    padding: 6px 18px;
    box-shadow: 0 1px 6px 0 rgb(21 27 38 / 15%);
    box-sizing: border-box;
    text-align: center;
    font-size: 15px;
  }

  input.dln-mins::-webkit-outer-spin-button,
  input.dln-mins::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .nhacnho-content .datlichnhac-input-gr input.dln-mins {
    width: 71px;
  }

  .err-nhacnho img {
    margin: 13px 0 0;
  }

  .nhacnho-content textarea {
    height: 75px;
    border-radius: 18px;
    padding: 9px 18px;
    font-size: 15px;
  }

  .check-date-time-week {
    width: 380px;
    height: 37px;
    background: #fff;
    border-radius: 18px;
    padding: 0 13px;
  }

  .check-date-time-week img {
    width: 12px;
  }

  .check-date-time-week p {
    font-size: 17px;
    line-height: 37px;
  }

  .student-list-container {
    width: 330px;
  }

  .tong-hs {
    line-height: 21px;
    font-size: 16px;
    font-family: "Myriadpro-SemiBold";
    margin: 0 0 18px;
  }

  .text-title-blue {
    font-size: 16px;
  }

  .box-chart p {
    font-size: 16px;
  }

  .dtb-sum .w {
    width: 266px;
  }

  .bdg-sum .w {
    width: 248px;
  }

  .f-24 {
    font-size: 21px;
  }

  .sunE-title-medium-p {
    font-size: 16px;
    line-height: 16px;
    margin: 0 0 13px;
  }

  .custom-list-student {
    padding: 18px;
    border-radius: 18px;
  }

  .bcht .list-student {
    max-height: calc(100vh - 260px);
  }

  .student-info {
    width: 300px;
    margin-right: 18px;
  }

  .student-info .avt-i {
    width: 156px;
    height: 156px;
    border-radius: 78px;
    border: 2px solid #e7ae38;
    margin: 0 auto 18px;
  }

  .student-info .name {
    font-size: 21px;
    margin: 0 0 12px;
  }

  .email-gr img {
    width: 20px;
  }

  .email-gr p {
    font-size: 16px;
    line-height: 22px;
    max-width: 200px;
  }

  .box-bcht-top h2 {
    font-size: 16px;
    line-height: 37px;
  }

  .btn-history-bcht {
    border: 2px solid #00b9b7;
    line-height: 33px;
    height: 37px;
    border-radius: 18px;
    padding: 0 30px;
    font-size: 16px;
  }

  .title-info {
    border-radius: 18px;
    height: 37px;
    padding-left: 18px;
  }

  .title-info p {
    line-height: 37px;
    font-size: 16px;
  }

  .score-info {
    border-radius: 18px;
    height: 37px;
    width: 73px;
  }

  .score-info p {
    line-height: 37px;
    font-size: 16px;
  }

  .title-info.dtb-title p {
    line-height: 18px;
    font-size: 16px;
  }

  .bcht {
    padding: 20px 0 0;
  }

  .box-bcht-date-custom-hei.box-bcht {
    padding: 0;
    width: 436px;
  }

  .box-bcht-date-custom-hei .calendar .week-cell,
  .box-bcht-date-custom-hei .calendar .day-cell {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% / 7 - 22px);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 35px;
    width: 35px;
    cursor: pointer;
    margin: 5px 0px;
  }

  .box-bcht.box-bcht-date-custom-hei .calendar .week-cell,
  .box-bcht.box-bcht-date-custom-hei .calendar .day-cell {
    flex-basis: calc(100% / 7 - 27px);
    margin: 5px 0px;
  }

  .collapse.showMonth .calendar {
    height: 160px;
  }

  .fullHeight.showMonth .calendar {
    height: auto;
  }

  .item-student-name p {
    font-size: 15px;
  }

  .item-student-name.max-w-1 p {
    max-width: 160px;
  }

  .score-tb-student span {
    width: 75px;
    height: 40px;
    line-height: 40px;
    font-size: 21px;
  }

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

  .vinhdanh-item img.vinhdanh-bg {
    width: 168px;
  }

  .avt-vd {
    width: 94px;
    height: 94px;
    border-radius: 47px;
    border: 2px solid #e9af38;
    margin: 18px auto 0;
  }

  .name-vd {
    padding: 0 18px;
    line-height: 32px;
    font-size: 16px;
    color: #fff;
    border-radius: 18px;
    position: absolute;
    top: 94px;
    left: 50%;
    transform: translate(-50%, 0);
  }

  .vd-info {
    bottom: 9px;
    font-size: 16px;
  }

  .vinhdanh-content {
    padding: 24px 0 0;
  }

  .diemdanh-no-item img {
    width: 363px;
  }

  .diemdanh-no-item p {
    font-size: 21px;
  }

  .btn-create-diemdanh img {
    width: 18px;
    top: 10px;
  }

  .btn-create-diemdanh button {
    padding: 0 18px 0 47px;
  }

  .medium-title {
    font-size: 16px;
  }

  .menu-gr-right input[type="text"].btn {
    height: 42px;
    border-radius: 21px;
    font-size: 16px;
    line-height: 42px;
    padding: 0 28px;
  }

  .btn-ob.select {
    font-size: 16px;
    height: 42px;
    line-height: 42px;
    border-radius: 21px;
  }

  .btn-ob .select-styled {
    border-radius: 21px;
    font-size: 16px;
    line-height: 42px;
    height: 42px;
    padding: 0 28px;
  }

  .btn-ob .select-styled:after {
    content: "";
    width: 21px;
    height: 12px;
    top: 16px;
    right: 9px;
    background: url(./../images/teacher/diemdanh/ico_dropdown_blue.png) 90% /
      21px no-repeat transparent;
  }

  .btn-ob .select-styled.active:after {
    background: url(./../images/teacher/diemdanh/ico_dropup_blue.png) 90% / 21px
      no-repeat transparent;
  }

  .btn-ob .select-options {
    padding: 21px 22px 0;
  }

  .btn-ob .select-options li {
    text-indent: 21px;
  }

  .menu-gr-right .react-datepicker-wrapper input[type="text"] {
    height: 42px;
    border-radius: 21px;
    font-size: 16px;
    line-height: 42px;
    padding: 0 28px;
  }

  .box-select-gr {
    border-radius: 18px;
    padding: 26px 0 26px 30px;
    margin: 0 0 13px 18px;
  }

  .box-select-gr .thumb {
    position: absolute;
    top: -3px;
    left: -26px;
    border: 5px solid #fff;
    width: 92px;
    height: 92px;
  }

  .box-select-info h2 {
    font-size: 16px;
    line-height: 18px;
  }

  .box-giaotrinh-gr {
    border-radius: 18px;
    height: 56px;
    margin: 0 0 26px 18px;
    padding: 0 13px 0 56px;
  }

  .custom-select-no-bg .select-styled {
    padding-left: 56px;
  }

  .custom-select-no-bg .select-styled {
    height: 37px;
    border-radius: 18px;
    font-size: 15px;
    padding-right: 37px;
    line-height: 37px;
    /* background: url(./../images/icon/ico_dropdown_s.png) 96% / 18px no-repeat
      #fff; */
  }

  .custom-select-no-bg .select {
    font-size: 15px;
    width: 100%;
    height: 37px;
    line-height: 37px;
    border-radius: 19px;
  }

  .btn-bar img {
    height: 37px;
  }

  .sunE-container-box.giaotrinh.unit {
    padding: 0 18px;
  }

  .sunE-unit-item h2 {
    font-size: 20px;
  }

  .sunE-unit-item p {
    font-size: 15px;
  }

  .img-bg-x {
    width: 163px;
    height: 250px;
    background-size: 100%;
    margin: auto;
  }

  .img-bg-x .__avt_unit {
    margin-top: 35px;
    margin-left: -5px;
  }

  .__way_map {
    position: absolute;
    transform: translate(75%, 115%);
  }

  .__way_map_down {
    position: absolute;
    transform: translate(65%, 190%);
  }

  .border-dash-map-down {
    top: 238px;
  }

  .border-dash-map-up {
    top: 250px;
  }

  .sunE-unit-item .h-287 {
    height: 250px;
  }

  .giaotrinh.unit .unit-list .box-giaotrinh-gr {
    border-radius: 30px;
    height: 47px;
  }

  .btn-more-info {
    width: 37px;
    height: 37px;
    border-radius: 19px;
    right: 7px;
    top: 5px;
  }

  .btn-more-info img {
    width: 13px;
  }

  .btn-more-info .show_ {
    margin: 16px 0 0 1px;
    width: 9px;
  }

  .info-item-desc h2 {
    font-size: 15px;
    line-height: 18px;
  }

  .sunE-giaotrinh-resuft-filter {
    padding: 18px 28px;
    border-radius: 18px;
    max-height: calc(100vh - 250px);
  }

  .chk-custom-gr label:before {
    padding: 10px;
    margin-right: 9px;
    border-radius: 2px;
    margin-top: -1px;
  }

  .chk-custom-gr input:checked + label:after {
    top: -8px;
    left: 10px;
    width: 6px;
    height: 18px;
  }

  .sunE-giaotrinh-item .chk-gr .chk-custom-gr label:before {
    margin-top: -10px;
  }

  .sunE-giaotrinh-resuft-filter.box-shadow.scrollbar-custom.flex-1
    .sunE-giaotrinh-item
    .chk-gr
    .chk-custom-gr
    label:before {
    margin-top: -5px;
  }

  .select-all .wh20.chk-custom-gr input:checked + label:after {
    top: -5px;
  }

  /* Check box select all */
  .checbox-right .wh20.check-select-student input:checked + label:after {
    top: -8px;
  }

  .btn-create-taomoi button,
  .btn-create-datlai button {
    padding: 0 30px 0 56px;
  }

  .btn-create-taomoi img {
    left: 13px;
    top: 9px;
    width: 21px;
  }

  .class-box-desc .title-line-blue {
    margin: 0 0 12px;
  }

  .box-btn {
    width: 28px;
    height: 28px;
  }

  .ico_ring-res-7 {
    width: 16px;
  }

  .ico_message-res-7 {
    width: 17px;
  }

  .reng {
    width: 9px;
    height: 9px;
    border-radius: 5px;
    bottom: 0;
    right: 0;
  }

  .tn-menu-item p {
    font-size: 16px;
  }

  .tinnhan-item h2 {
    font-size: 16px;
    line-height: 16px;
    margin: 0 0 7px;
  }

  .tinnhan-item span {
    font-size: 12px;
  }

  .tinnhan-item p.mes-info {
    font-size: 16px;
    line-height: 21px;
    max-height: 64px;
  }

  .mex-info-box p {
    font-size: 16px;
  }

  .mes-box-send {
    height: 46px;
    line-height: 25px;
    font-size: 15px;
    padding: 9px 18px 9px 18px;
    border-top-left-radius: 23px;
    border-bottom-left-radius: 23px;
  }

  .box-btn-send {
    height: 46px;
    width: 46px;
    border-top-right-radius: 23px;
    border-bottom-right-radius: 23px;
  }

  .send-mes img {
    width: 23px;
  }

  .search-gr-p {
    height: 46px;
    box-sizing: border-box;
    margin: 17px 0 7px;
  }

  .select-message.select {
    font-size: 16px;
    width: 175px;
    height: 42px;
    line-height: 42px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .select-message .select-styled {
    font-size: 16px;
    width: 175px;
    height: 42px;
    line-height: 42px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .search-custom {
    width: 350px;
    height: 42px;
    line-height: 42px;
    padding: 0 40px 0 21px;
    font-size: 18px;
    font-family: "Myriadpro-Regular";
    box-sizing: border-box;
    border: none;
    text-align: center;
    border-top-right-radius: 21px;
    border-bottom-right-radius: 21px;
    outline: none;
  }

  .icon_search {
    position: absolute;
    right: 13px;
    top: 12px;
    width: 21px;
  }

  ._line_box {
    padding: 6px 0;
    height: 42px;
  }

  ._line {
    height: 30px;
    top: 6px;
  }

  .select-message .select-styled:after {
    content: "";
    width: 16px;
    height: 9px;
    background: url(./../images/tinnhan/ico_dropdown.png) 97% / 16px no-repeat
      transparent;
    top: 16px;
    right: 28px;
  }

  .class_student_list_box {
    padding: 18px;
    border-radius: 18px;
    height: calc(100vh - 180px);
  }

  .box-shadow.custom-list-student.class_student_list_box.review {
    height: calc(100vh - 220px);
  }

  .list-student {
    max-height: calc(100vh - 220px);
  }

  .mex-box.cus-hei-2 {
    height: calc(100vh - 180px);
  }

  .tinnhan-item .dot-active {
    width: 12px;
    height: 12px;
    top: 12px;
    left: 12px;
  }

  .box-detail-hs .avt-ab {
    width: 178px;
    height: 178px;
    border-radius: 50%;
    overflow: hidden;
  }

  .box-detail-hs .avt-ab {
    position: absolute;
    top: -94px;
    left: calc(50% - 94px);
  }

  .box-detail-ab {
    top: 130px;
    padding: 0 71px;
  }

  .box-detail-ab .box-detail-hs {
    border-radius: 18px;
    padding: 80px 18px 13px;
    width: 368px;
  }

  .box-detail-hs h2.name {
    font-size: 28px;
  }

  .detail-info {
    padding: 0 35px 13px;
  }

  .info-sum h3 {
    font-size: 47px;
  }

  .sunE-container-box.hoso {
    min-height: auto;
  }

  .info-sum {
    margin: 47px 0 0;
  }

  .avatar-edit {
    margin: 20px 0 0;
  }

  .avatar-edit-box {
    background: #fff;
    width: 185px;
    height: 185px;
    border-radius: 93px;
    margin: 0 auto 30px;
    padding: 4px;
  }

  .hoso .btn-save button {
    padding: 0 40px;
    height: 46px;
    line-height: 46px;
    border-radius: 23px;
    border: none;
    font-size: 18px;
    color: #fff;
    transition: 0.8s;
    font-family: "Myriadpro-SemiBold";
    min-width: 166px;
  }

  .avatar-edit-box .img-edit-avt {
    position: absolute;
    bottom: 0;
    background: #fff;
    height: 46px;
    width: 100%;
    text-align: center;
  }

  .avatar-edit-box .img-edit-avt img {
    width: 34px;
    height: 26px;
    border-radius: 0;
    margin-top: 9px;
  }

  .list-menu-custom {
    width: 285px;
  }

  .btn-gr-text p {
    font-size: 16px;
    font-family: "Myriadpro-Bold";
    color: #00a79d;
    line-height: 54px;
  }

  .btn-gr {
    margin: 0 0 12px;
    border-radius: 13px;
    height: 54px;
  }

  .apdung label {
    margin: 13px 0;
    font-size: 16px;
    padding: 0 0 9px 12px;
  }

  .apdung.tp-k label {
    margin: 15px 0 11px;
    font-size: 14px;
    padding: 0 0 8px 10px;
  }

  .apdung.apdung-custom label {
    margin: 12px 0 12px 12px;
    padding: 0;
  }

  .thoikhoabieu.tb .apdung .valid_to_input .react-datepicker-wrapper {
    width: 118px;
  }

  .valid_to_input input {
    font-size: 16px;
    width: 80px;
    margin-right: 0;
    text-align: center;
  }

  .thoikhoabieu.tb .valid_to_input {
    margin: 12px 0 0 17px;
  }

  .btn-create-datlai img {
    left: 13px;
    top: 7px;
    width: 21px;
  }

  .orange span,
  .red span,
  .success-text span {
    font-size: 14px;
    line-height: 23px;
  }

  .his {
    margin-top: -6px;
    width: 115px;
  }

  .btn-select-year button {
    padding: 0 53px;
  }

  .btn-select-year .ico_right,
  .btn-select-year .ico_left {
    top: 8px;
    width: 13px;
  }

  .title-list-lichnam h2 {
    font-size: 21px;
  }

  .btn-remove-item {
    width: 46px;
    height: 46px;
  }

  .btn-remove-item img {
    width: 18px;
  }

  .popup-filter-option .wh20.chk-custom-gr input:checked + label:after {
    top: -5px;
  }

  .ql-bt-dg.sunE-giaotrinh-resuft-filter {
    max-height: calc(100vh - 160px);
  }

  .box-setting-custom {
    border-radius: 18px;
    padding: 18px;
    margin: 0 0 9px;
  }

  .setting-title-blue {
    font-size: 21px;
    line-height: 28px;
    margin: 0 0 9px;
  }

  .w80 {
    width: 70px;
  }

  /*CUSTOM ON OFF BUTTON*/
  .toggle-button-cover {
    position: relative;
    width: 45px;
  }

  .knobs,
  .layer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .button {
    top: calc(50% - 10px);
    width: 45px;
    height: 17px;
  }

  .button.r,
  .button.r .layer {
    border-radius: 102px;
  }

  /* Button 1 */
  .btn-on-off .knobs:before {
    top: -6px;
    left: -5px;
    width: 28px;
    height: 28px;
    font-size: 10px;
  }

  .btn-on-off.active .checkbox:checked + .knobs:before {
    left: 21px;
  }

  /*END CUSTOM ON OFF BUTTON*/
  .setting-on-off-box p {
    font-size: 16px;
    line-height: 21px;
  }

  .setting-on-off-box {
    margin: 0 0 1rem;
  }

  .select-language .select-styled {
    height: 21px;
    line-height: 21px;
    font-size: 15px;
  }

  .setting-on-off-box .center-flex img {
    width: 12px;
  }

  .btn-gr-img {
    width: 102px;
    padding: 12px 0;
  }

  .list-menu-custom .btn-gr-img.ico_ma img {
    width: 33px;
  }

  .list-menu-custom .btn-gr-img.ico_buy img {
    width: 37px;
  }

  .list-menu-custom .btn-gr-img.ico_time img {
    width: 32px;
  }

  .slider-custom {
    max-width: 450px;
  }

  .item-top-title p {
    font-size: 18px;
  }

  .item-price p {
    font-size: 26px;
  }

  .slider-custom .slider-item-content img.details-ig {
    margin: auto;
    width: 265px;
  }

  .slider-custom .slick-arrow.slick-next {
    left: calc(100% - 20px);
  }

  .slider-custom .slick-arrow.slick-prev {
    left: -10px;
  }

  .custom-select-w {
    width: 380px;
  }

  .input-nm {
    height: 36px;
    line-height: 36px;
    border-radius: 18px;
    padding-left: 18px;
    margin: 0 0 17px;
    font-size: 16px;
  }

  .box-white-content p,
  .btn_click_link {
    font-size: 16px;
  }

  .student-index {
    padding: 6vh 20px 10px;
  }

  .map-skill span {
    width: 212px;
    height: 36px;
    line-height: 36px;
    border-radius: 18px;
    font-size: 16px;
  }

  .map-skill img {
    top: -22px;
    left: -5px;
    width: 52px;
  }

  .star img {
    width: 36px;
    height: 36px;
  }

  .pink-ab {
    bottom: 18px;
    right: 65px;
  }

  .pink-ab img {
    width: 45px;
  }

  .box-unit-info p,
  .box-unit-info p span {
    font-size: 16px;
  }

  .giaotrinh.unit .box-giaotrinh-gr {
    padding: 0 16px 0 40px;
    margin: 0 0 18px 18px;
  }

  .list-menu-custom.student {
    width: 280px;
  }

  .bg_top_tt {
    width: 100%;
  }

  .mte-gr .mte-thumb {
    width: 56px;
    height: 56px;
    border: 4px solid #fff;
    top: -6px;
    left: -17px;
  }

  .mte-gr {
    background: #fff;
    height: 45px;
    width: 130px;
    border-radius: 23px;
    text-align: center;
    padding-left: 24px;
  }

  .mte-gr h2 {
    line-height: 26px;
    font-size: 26px;
  }

  .circle-k {
    width: 24px;
    height: 24px;
    border-radius: 12px;
    margin-left: -2px;
  }

  .line-k {
    width: 42px;
    height: 8px;
    margin-top: 8px;
  }

  .process-info-k .space {
    width: 60px;
    text-align: center;
  }

  .process-info-k .space p {
    font-size: 16px;
    font-family: "Myriadpro-Light";
    line-height: 16px;
  }

  .list-menu-custom.student .btn-gr-text p {
    line-height: 60px;
  }

  .list-menu-custom.student .btn-gr {
    height: 60px;
  }

  .btn-gr-img.ico_thanhtich_offline {
    padding: 9px 0;
  }

  .ico_thanhtich_offline img {
    width: 46px;
  }

  .ico_thanhtich_online img {
    width: 33px;
  }

  .ico_xephang img {
    width: 45px;
  }

  .process-thumb img {
    width: 56px;
    height: 56px;
  }

  .skill-process-list {
    margin: 26px 0 0;
    padding: 16px 26px 9px 45px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 18px;
  }

  .skill-process-item p.title {
    line-height: 21px;
    font-size: 16px;
  }

  .process-100 {
    height: 26px;
    border-radius: 13px;
    padding: 5px 5px 5px 36px;
  }

  .process-due {
    height: 16px;
  }

  .sco {
    width: 92px;
    height: 26px;
    border-radius: 13px;
    box-sizing: border-box;
    background: #fff;
    padding: 0 6px 0 13px;
    margin: 21px 0 0 12px;
  }

  .sco .slp {
    line-height: 26px;
    font-size: 21px;
  }

  .sco .slp-top {
    line-height: 9px;
    font-size: 12px;
    top: -9px;
  }

  .top-t {
    height: 40px;
    border-radius: 20px;
    padding: 0 26px;
    margin: 0 0 16px;
  }

  .top-t p {
    font-size: 16px;
    line-height: 40px;
  }

  .box-s {
    padding: 0 6px 0 35px;
  }

  .box-s span {
    height: 30px;
    margin-top: 6px;
    border-radius: 16px;
    font-size: 16px;
    line-height: 30px;
    padding: 0 5px 0 35px;
  }

  .box-s img {
    top: 5px;
    left: 5px;
  }

  .box-s .select {
    font-size: 16px;
    color: #00cbad;
    width: 130px;
    height: 30px;
    line-height: 30px;
    border-radius: 15px;
    margin-top: 5px;
  }

  .box-s .select-styled {
    width: 150px;
    height: 30px;
    line-height: 30px;
    border-radius: 15px;
    font-size: 16px;
    padding: 0 5px 0 35px;
  }

  .select-chart .select-styled {
    padding: 0 5px;
    text-align: center;
    width: 100%;
  }

  .box-s .select-options {
    padding: 21px 9px 0;
    top: 21px;
    border-radius: 21px;
    max-height: calc(100vh - 140px);
  }

  .box-s .select img {
    top: 5px;
    left: 5px;
    width: 24px;
  }

  .box-nhatkyhoctap-graph .bangdiem-menu-gr span {
    font-size: 16px;
  }

  .box-diem .top-o p {
    font-size: 16px;
    line-height: 18px;
  }

  .box-diem h2 {
    font-size: 40px;
  }

  .his-hd {
    height: auto;
    min-height: calc(100vh - 140px);
    padding: 16px 25px;
  }

  .b-26-black {
    line-height: 28px;
    font-size: 22px;
    font-family: "Myriadpro-Bold";
    margin: 13px 0 9px;
  }

  .img-avatar-k {
    width: 86px;
    height: 86px;
    border-radius: 43px;
    border: 3px solid #fff;
    margin-right: 17px;
  }

  .bxh-info-student-box h3 {
    font-size: 21px;
    line-height: 26px;
    margin: 0 0 9px;
  }

  .gr-r p {
    font-size: 16px;
    line-height: 21px;
  }

  .gr-r span {
    font-size: 21px;
    line-height: 26px;
  }

  .ico_hc {
    width: 18px;
  }

  .sub-title-18 {
    display: block;
    font-size: 16px;
    line-height: 21px;
  }

  .box-top-k {
    border-radius: 17px;
    padding: 9px 17px;
  }

  .top-k-score {
    width: 70px;
    height: 26px;
    font-size: 16px;
    line-height: 26px;
    border-radius: 13px;
    margin: 0 auto 13px;
  }

  .top-k-item.v {
    width: 150px;
    margin: 0 13px;
  }

  .top-k-item.s,
  .top-k-item.b {
    width: 104px;
  }

  .top-k-item.s .avt-top-k .ico_avt,
  .top-k-item.b .avt-top-k .ico_avt {
    top: 15px;
    left: 25px;
    width: 52px;
    height: 52px;
    border-radius: 27px;
  }

  .top-k-item.v .avt-top-k .ico_avt {
    top: 35px;
    left: 40px;
    width: 66px;
    height: 66px;
    border-radius: 33px;
  }

  .thanhtich-container {
    padding: 12px 0 0;
  }

  .student_bxh_list .item-student {
    padding: 9px 17px;
    border-radius: 17px;
    margin: 0 0 9px;
  }

  .student_bxh_list .item-student .item-student-img {
    width: 46px;
    height: 46px;
    border-radius: 23px;
    border: 1px solid #e9af38;
  }

  .student_bxh_list .item-student-name p {
    line-height: 46px;
    font-size: 16px;
  }

  .student_bxh_list .item-student .stt {
    line-height: 46px;
    font-size: 16px;
    width: 26px;
  }

  .hcs {
    font-size: 16px;
    line-height: 16px;
    margin: 0 12px 0 5px;
  }

  .lv-down img,
  .lv-up img {
    width: 18px;
  }

  .student_bxh_list {
    max-height: 390px;
  }

  .edit-profile-student button {
    padding: 0 23px 0 45px;
  }

  .edit-profile-student .ico_edit_profile {
    position: absolute;
    left: 13px;
    top: 7px;
    width: 21px;
  }

  .box-detail-hs.student .avt-ab {
    width: 130px;
    height: 130px;
    top: -65px;
    left: calc(50% - 65px);
  }

  .ph-add-gr h2 {
    font-size: 21px;
    line-height: 26px;
    margin-bottom: 15px;
  }

  .parent-info .avatar {
    width: 66px;
    height: 66px;
    border-radius: 33px;
    margin-right: 17px;
  }

  .parent-info p {
    font-size: 16px;
    line-height: 16px;
    margin: 17px 0 6px;
  }

  .parent-info span {
    font-size: 16px;
    line-height: 21px;
  }

  .box-detail-ab.student-ab {
    top: 106px;
  }

  .avatar-edit-box.student {
    width: 160px;
    height: 160px;
    margin: 30px auto;
  }

  .bg_edit_student_profile {
    top: -33px;
  }

  .avatar-edit.student .sunE-input-gr {
    margin: 0 0 15px;
  }

  .avatar-edit.student {
    padding-top: 0;
  }

  .kh-title h2 {
    font-size: 21px;
  }

  .btn-create-khk span {
    width: 94px;
    height: 32px;
    min-width: 94px;
    padding: 0 17px;
    line-height: 32px;
  }

  .line38 {
    line-height: 32px;
  }

  .btn-create-khk .ico_add_kh {
    position: absolute;
    top: 8px;
    left: 13px;
    width: 16px;
  }

  .btn-create-khk .ico_line_kh {
    position: absolute;
    top: 5px;
    left: 52px;
  }

  .btn-create-khk .ico_line_kh {
    position: absolute;
    left: 39px;
    height: 26px;
  }

  .f24 {
    font-size: 20px !important;
  }

  .slider-item-desc .btn-img img {
    width: 18px;
    top: 6px;
    left: 11px;
  }

  .slider-item-desc .btn-img img.ico_add_custom {
    width: 22px;
    top: 8px;
    left: 14px;
  }

  .plan-item-content {
    padding: 10px 20px 10px 10px;
  }

  .img-upload {
    height: 450px;
  }

  .edit-plan-box {
    width: 136px;
    background: #b7f2e4;
    display: flex;
    justify-content: center;
    align-items: center;
    margin-right: -136px;
    transition: margin 0.6s ease;
    padding-top: 5px;
  }

  .edit-show .plan-item-content {
    margin-left: -124px;
    transition: margin 0.6s ease;
    border-top-right-radius: 10px;
    border-bottom-right-radius: 10px;
  }

  .sunE-create-class-content {
    margin-top: 30px;
  }

  .btn-remove-student {
    padding-top: 16px;
  }

  .btn-remove-student img {
    width: 18px;
  }

  .btn-accept-reject-select-gr .btn-select-custom {
    width: 100px;
    height: 32px;
    border-radius: 16px;
    font-size: 14px;
  }

  .add_code_student-gr .ico_err {
    width: 24px;
    right: 10px;
    top: 7px;
  }

  .title-info.dtb-title {
    width: 100px;
  }

  .box-criteria {
    max-height: 235px;
    /* max-height: fit-content; */
  }

  .box-criteria-full {
    max-height: fit-content;
  }

  .box-criteria-scroll {
    max-height: 265px;
  }

  .dk_class .select-all {
    /* margin-right: 16px; */
    padding-right: 37px;
  }

  .change_point_checkbox_add_exercise {
    padding-right: 43px !important;
  }

  .giaotrinh.unit .unit-list .box-giaotrinh-gr {
    padding: 0 55px 0 25px;
  }

  .box-bcht-date-custom-hei .calendar .day-cell.hide_collapse,
  .box-bcht-date-custom-hei .calendar .day-cell.hide_collapse {
    display: none;
  }

  .box-bcht-date-custom-hei .fullHeight .calendar .hide_collapse,
  .box-bcht-date-custom-hei .fullHeight .calendar .hide_collapse {
    display: flex;
  }

  .set-max-w {
    max-width: 363px;
  }

  .tb-mes {
    bottom: 8px;
  }

  .class-box-desc {
    padding: 0 0 12px 15px;
  }

  .mt-17 {
    margin-top: 17px;
  }

  .file-support-list {
    overflow: auto;
    max-height: 200px;
    padding-right: 10px;
  }

  .text-center.box-video-project.img-bg {
    max-height: 220px;
  }

  .responsive_video_marking_screen {
    max-height: 215px;
  }

  .box-video-project video {
    width: 100%;
    max-height: 215px;
  }

  .sunE-box-tkh,
  .sunE-box-xkh {
    padding: 10px 20px;
  }

  .input-gr label,
  .laplai label,
  .ct-hs label.ht {
    font-size: 16px;
    padding: 0 0 7px 12px;
  }

  .input-gr textarea {
    height: 80px;
    font-size: 16px;
  }

  .input-gr {
    margin: 0 0 12px;
  }

  .radio-item {
    padding: 0 5px;
    margin: 6px 0 0;
  }

  .radio-item label:before {
    top: 1px;
    margin: 0 5px 0 0;
    width: 12px;
    height: 12px;
    border-radius: 6px;
  }

  .tp-k .time-to.select-time input {
    font-size: 16px;
    margin: 6px 0 0 15px;
  }

  .apdung.tp-k .time-to.select-time .ico_edit_time_to {
    top: 12px;
  }

  .apdung .time-to.select-time .ico_edit_time_to {
    left: 127px;
  }

  .apdung.tp-k {
    margin: 0;
  }

  .laplai {
    margin: 0 0 10px;
    padding-left: 0;
  }

  .time-to-khht-cn .ico_edit_time_to_khht {
    top: -1px;
    right: -24px;
  }

  .valid_to_input {
    margin: 14px 0 0 10px;
  }

  .error-img {
    height: 18px;
  }

  .custom-4.slider-custom {
    max-width: 380px;
  }

  .thanhtich-offline-box .top-title-name.two-line {
    max-height: 57px;
  }

  .bg_auth {
    max-width: 100%;
    width: 100%;
  }

  /* File Support CSS */
  .pasd.sunE-container-box {
    padding: 20px 20px 0;
  }

  .__overview_report {
    padding: 25px 0px;
  }

  /*responsive home teacher*/
  .p_responsive_home_page_teacher {
    margin-top: -20px;
    padding: 0px 20px 0px !important;
  }

  .mb_mt_5px {
    margin: 5px 0 !important;
  }

  .__body_class_add_responsive_screen_small {
    height: 50%;
  }

  .responsive_plan_list_screen_small {
    max-height: 21.7rem !important;
  }

  .responsive_avatar_class_screen_small {
    display: flex;
    align-items: center;
    justify-content: center;
    width: 180px !important;
    height: 180px !important;
  }

  .responsive_avatar_class_screen_small_img {
    width: 70% !important;
    height: 70% !important;
  }

  .slider-custom-student .responsive_avatar_class_screen_small {
    width: 116px !important;
    height: 116px !important;
  }
  .slider-custom-student
    .img-thumb-student
    .responsive_avatar_class_screen_small_img {
    width: 100% !important;
    height: 100% !important;
  }

  .responsive_class_name_screen_small {
    max-height: 30px !important;
    padding: 5px 24px !important;
    margin-bottom: 0 !important;
  }

  .responsive_chart_screen_small {
    width: 55%;
  }

  .space_null_responsive_home_page_teacher {
    width: 140px !important;
  }

  /*end responsive home teacher*/

  /* region avatar rank */
  .top {
    width: 285px;
    background: #fff;
    border-radius: 20px;
    padding: 30px 0 10px 0;
    height: calc(100vh - 140px);
    overflow: auto;
  }

  .top-box {
    margin: 0 0 10px;
  }

  .top1 span {
    height: 25px;
    line-height: 25px;
  }

  .top2 span {
    height: 25px;
    line-height: 25px;
  }

  .top3 span {
    height: 25px;
    line-height: 25px;
  }

  .top-hs {
    width: 42%;
    height: 103px;
    margin: 0 auto 10px;
  }

  .top1 .top-hs .avt {
    position: absolute;
    top: 33px;
    left: 35px;
    width: 50px;
    height: 50px;
    border-radius: 39px;
    border: 2px solid #f7eda1;
    box-sizing: border-box;
    object-fit: cover;
  }

  .top-hs .gold {
    position: absolute;
    top: 8px;
    left: 37.5px;
  }

  .__top_number {
    position: absolute;
    bottom: -10px;
    left: 39%;
    font-weight: bold;
    border-radius: 50%;
    background: #fff;
    width: 25px;
    height: 25px;
    font-family: "Myriadpro-Bold" !important;
    display: flex;
    align-items: center;
  }

  .top2 .top-hs {
    width: 40%;
    height: 100px;
    margin: 0 auto 10px;
  }

  .top2 .top-hs .avt {
    position: absolute;
    top: 15px;
    left: 27.5px;
    width: 60px;
    height: 60px;
    border-radius: 39px;
    border: none;
    border: 2px solid #d3d2d2;
    box-sizing: border-box;
    object-fit: cover;
  }

  .top3 .top-hs {
    width: 40%;
    height: 100px;
    margin: 0 auto 10px;
  }

  .top3 .top-hs .avt {
    position: absolute;
    top: 15px;
    left: 27.5px;
    width: 60px;
    height: 60px;
    border-radius: 39px;
    border: none;
    border: 2px solid #d3d2d2;
    box-sizing: border-box;
    object-fit: cover;
  }

  /* end region avatar rank */

  .responsive_small_screen_margin_login {
    margin-top: -30px !important;
  }

  .register_account_type .account_content {
    margin-bottom: 0 !important;
  }

  .register_account_type .account_detail_school_title {
    margin-bottom: 5px !important;
  }

  .register_account_type .account_content_title {
    margin-bottom: 5px !important;
  }

  .register_account_type .account_detail_placeholder {
    height: 90px !important;
  }

  .register_update_info .button_submit {
    margin-top: 10px !important;
  }

  .responsive_screen_small_no_plan {
    margin-top: 25px;
  }

  .responsive_viewScheduleStudent_email,
  .responsive_viewScheduleStudent_name {
    margin: 0 !important;
  }

  .responsive_viewScheduleStudent_name {
    margin: 0 auto !important;
  }

  .responsive_screen_popup_height {
    max-height: 85vh !important;
    height: 85vh !important;
    width: 435px !important;
  }

  .responsive_low_screen_files_support {
    padding: 0 40px 0 47px !important;
  }

  .success_register_teacher {
    margin-top: 50px !important;
  }

  .responsive_modal_authentication_teacher {
    min-height: 22rem !important;
    margin-top: 0 !important;
  }

  .style_heading_authentication_teacher {
    margin-top: 0 !important;
  }

  .style_btn_agree_authentication_teacher {
    padding-top: 1.5rem !important;
  }

  .responsive_btn_assign_assignments {
    width: 127px !important;
  }

  .father_btn_assign_assignments {
    margin-right: 15px !important;
  }

  .quantity_from_teacher_choose {
    min-width: 25px;
    height: 25px;
    top: -10px;
  }

  .uk-modal-body .wh20.chk-custom-gr input:checked + label:after {
    top: -5px !important;
    left: 8px;
  }

  .ml--5 {
    margin-left: -5px;
  }

  .height_top_3_golden_board {
    height: calc(100vh - 140px) !important;
    padding: 20px 0 20px 0;
  }

  .slick-dots {
    bottom: -30px !important;
  }

  .slider-custom-student .slick-dots {
    position: relative !important;
    bottom: 0 !important;
    margin: 0.2rem 0 0.4rem;
  }

  .height_calendar_responsive {
    min-height: 410px;
  }

  .font_average_score {
    margin-bottom: 10px !important;
  }

  .upgrade_container {
    padding-top: 0.5rem;
  }

  .form_upgrade {
    padding-top: 0.75rem !important;
  }

  .title_upgrade {
    padding-bottom: 1rem !important;
  }

  .register-success-container {
    margin-top: 0px !important;
  }

  .content_homepage_student .slider_homepage_student {
    margin-bottom: 0.25rem !important;
  }
}

@media screen and (max-height: 700px) {
  /*RESET CSS*/
  html,
  body,
  div,
  span,
  object,
  iframe,
  h1,
  h2,
  h3,
  h4,
  h5,
  h6,
  p,
  blockquote,
  pre,
  abbr,
  address,
  cite,
  code,
  del,
  dfn,
  em,
  img,
  ins,
  kbd,
  q,
  samp,
  small,
  strong,
  sub,
  sup,
  var,
  b,
  i,
  dl,
  dt,
  dd,
  ol,
  ul,
  li,
  fieldset,
  form,
  label,
  legend,
  table,
  caption,
  tbody,
  tfoot,
  thead,
  tr,
  th,
  td,
  article,
  aside,
  canvas,
  details,
  figcaption,
  figure,
  footer,
  header,
  hgroup,
  menu,
  nav,
  section,
  summary,
  time,
  mark,
  audio,
  video {
    /* font-size: 14px; */
  }

  .home_curriculum .select-options {
    top: -4px !important;
  }

  .sunE-container {
    width: 100%;
    height: auto;
    /* max-width: 1200px; */
    margin: 0 auto;
    /* padding: 0; */
  }

  .list-menu-i a.menu-item {
    font-size: 14px;
    color: #404041;
    line-height: 29px;
    align-items: center;
    padding: 9px 0 9px 27px;
    text-decoration: none;
    margin: 7px 0;
  }

  .iZROEJ .select-styled {
    height: 44px !important;
  }

  .list-menu-i .menu-img {
    width: 50px;
    max-height: 27px;
  }

  .list-menu-i .menu-img img {
    width: 25px;
  }

  .list-menu-i a.menu-item span {
    font-size: 14px;
    color: #404041;
  }

  .sunE-sidebar {
    display: flex;
    height: 100vh;
    -webkit-box-flex: 0;
    background-color: rgba(172, 241, 228, 0.66);
    flex: 0 0 auto;
    -webkit-box-orient: vertical;
    -webkit-box-direction: normal;
    flex-direction: column;
    -webkit-transition: margin-left 250ms ease-out,
      -webkit-transform 250ms ease-out;
    transition: margin-left 250ms ease-out, -webkit-transform 250ms ease-out;
    transition: margin-left 250ms ease-out, transform 250ms ease-out;
    transition: margin-left 250ms ease-out, transform 250ms ease-out,
      -webkit-transform 250ms ease-out;
    width: 215px;
  }

  .plan-item-content p {
    font-size: 14px;
  }

  .btn-plan-item {
    width: 18px;
  }

  .his img {
    width: 23px;
  }

  .plan-item-content p.text-light {
    padding: 0 0 0 10px;
  }

  .slider-custom-2 .slick-arrow.slick-prev {
    left: -9px;
  }

  /* Slider for student homepage */
  .slider_homepage_student .slider-custom-student {
    /* margin-bottom: 0.9rem !important; */
  }

  .slider-custom-student .slick-arrow.slick-prev {
    left: 39px;
  }

  .slider-custom-2 .slick-next,
  .slider-custom-2 .slick-prev {
    width: 36px;
    height: auto;
  }

  .slider-custom-2 .slick-arrow {
    background: #00bbb6;
    padding: 10px 12px;
    position: absolute;
    border-radius: 10px;
    border: none;
    z-index: 9;
    text-align: center;
  }

  .item-top-title-main p {
    text-align: center;
    font-size: 14px;
    padding: 0;
    color: #fff;
    font-family: "Myriadpro-SemiBold";
  }

  .slick-dots li button:before {
    font-size: 6px;
    line-height: 15px;
    position: absolute;
    top: 0;
    left: 0;
    width: 12px;
    height: 12px;
    content: "•";
    text-align: center;
    opacity: 0.25;
    color: #000;
  }

  .slider-custom-2 .slick-dots li button:before {
    font-size: 14px;
    color: #00a79d;
  }

  .slider-item-content .img-thumb {
    margin: 10px;
    width: 200px;
    height: 177px;
    border-radius: 10px;
    overflow: hidden;
  }

  .slider-custom-2 .slider-item-content {
    margin: 10px;
    padding: 5px 11px;
  }

  /* For Student */
  .slider-custom-student .slider-item-content {
    margin: 12px;
    padding: 5px 8px;
  }

  .slider-custom-student .slider_student_wrapper .slider-item-content {
    margin-top: 0.55rem !important;
    margin-bottom: 0.45rem !important;
  }

  .slider-item-desc .item-top-title-main {
    margin: 10px 0;
    background-image: linear-gradient(to right, #00e1a0, #00b9b7);
    padding: 10px 20px;
    border-radius: 25px;
    max-height: 56px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
    margin-bottom: 25px;
  }

  .edit-plan-box .btn p {
    font-size: 14px;
    line-height: 14px;
  }

  .edit-plan-box .btn img {
    width: 23px;
  }

  .sunE-right-container {
    width: 100%;
    height: 100vh;
    overflow: auto;
    padding: 20px 15px 10px 15px;
  }

  .sunE-container-box {
    padding: 20px 10px 10px;
  }

  .orange span,
  .red span,
  .success-text span {
    line-height: 23px;
  }

  .chart-content canvas {
    margin-left: 0;
  }

  .sunE-plan-list {
    max-height: 270px;
    overflow: auto;
    padding-right: 8px;
  }

  .no-plan img {
    width: 205px;
  }

  .no-plan h2 {
    font-family: "Myriadpro-SemiBold";
    font-size: 18px;
    padding: 0;
    margin: 0;
    color: #00a79d;
  }

  .dtb-sum-slider {
    bottom: -45px;
  }

  .dtb-sum-slider .w {
    width: 142px;
  }

  .slider-custom-2 .dtb-sum-slider .w {
    width: 123px;
  }

  .img-check-calendar {
    top: -1px;
    right: -5px;
    width: 14px;
  }

  .class-box .class-box-img {
    width: 107px;
    height: 87px;
  }

  .title-line-blue {
    font-size: 14px;
    line-height: 18px;
    padding: 6px;
    text-align: center;
    border-radius: 15px;
    background-image: linear-gradient(to right, #00e1a0, #00b9b7);
  }

  .two-line {
    max-height: 43px;
    overflow: hidden;
    text-overflow: ellipsis;
    display: -webkit-box;
    -webkit-line-clamp: 2;
    -webkit-box-orient: vertical;
  }

  .class-box-desc p,
  .class-box-desc span {
    font-size: 14px;
  }

  .sunE-main-title h1 {
    font-size: 24px;
    line-height: 32px;
    padding-left: 6px;
  }

  .sunE-main-title .line-h {
    display: block;
    width: 3px;
    height: 30px;
    background: #00bbb5;
    border-radius: 2px;
    border: none;
  }

  .sunE-class-list {
    padding-right: 15px;
    max-height: calc(100vh - 155px);
    padding-bottom: 24px;
    overflow: auto;
  }

  .class-index-box .class-index-box-img {
    width: 206px;
    height: 209px;
  }

  .class-index-box {
    box-sizing: border-box;
    padding: 11px;
    border-radius: 15px;
    background: #fff;
    display: inline-block;
    width: 100%;
  }

  .info-gr .info-img {
    width: 24px;
  }

  .info-gr {
    margin: 10px 0 0;
  }

  .info-gr img {
    height: 16px;
    cursor: pointer;
  }

  .info-gr .info-con p {
    font-size: 14px;
    font-family: "Myriadpro-Light";
    line-height: 22px;
  }

  .class-select-box {
    padding: 15px 0px 0;
    display: inline-block;
    width: 118px;
    height: 118px;
    background: #fff;
    margin: 0 5px;
    border-radius: 10px;
    border: none;
    cursor: pointer;
    box-sizing: border-box;
    overflow: hidden;
  }

  .class-select-box .select-img {
    height: 66px;
  }

  .class-select-box img {
    height: 100%;
  }

  .class-select-box p {
    font-size: 14px;
    padding: 8px 0 0;
    margin: 0;
  }

  .box-giaotrinh-gr.hei-custom.edit {
    height: 110px;
    padding: 0 11px 0 24px;
    margin: 0 0 15px 0;
  }

  .box-select-info p {
    color: #221f1f;
    font-size: 14px;
    line-height: 19px;
  }

  .box-select-info span {
    font-size: 14px;
  }

  .box-select-file-full {
    flex: 1;
  }

  .box-select-file-full p {
    flex: 1;
    text-align: left;
  }

  .gtcn-menu-gr span {
    font-size: 18px;
    margin-right: 22px;
  }

  .box-giaotrinh-gr.hei-custom {
    height: 75px;
  }

  .box-giaotrinh-gr .thumb {
    position: absolute;
    top: -4px;
    left: -22px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #fff;
    border: 3px solid #fff;
    border-radius: 50%;
    width: 55px;
    height: 55px;
    box-shadow: 0 1px 8px 0 rgb(21 27 38 / 24%);
  }

  .box-giaotrinh-gr .thumb3 {
    position: absolute;
    top: -4px;
    left: -22px;
    display: flex;
    justify-content: center;
    align-items: center;
    background: #ccedeb;
    border: 3px solid #fff;
    border-radius: 50%;
    width: 55px;
    height: 55px;
    box-shadow: 0 1px 8px 0 rgb(21 27 38 / 24%);
  }

  .box-giaotrinh-gr .thumb2 {
    width: 65px;
    height: 65px;
    left: -24px;
  }

  .box-giaotrinh-gr.hei-custom .thumb {
    top: 11px;
  }

  .box-giaotrinh-gr.hei-custom .thumb3 {
    top: 11px;
  }

  .gt_list_hei {
    max-height: calc(100vh - 260px);
    padding: 0 11px;
    overflow: auto;
  }

  .btn-user-add img,
  .btn-user-share img {
    width: 32px;
  }

  .sunE-title-medium {
    font-size: 16px;
    margin: 0;
    padding: 0 0 15px;

    span {
      font-size: 16px !important;
    }
  }

  .sunE-right-container.add_student_container {
    padding: 30px 14px 0 14px;
  }

  .add_student {
    height: calc(100vh - 90px);
    width: 100%;
  }

  .sunE-no-student .add_code_student-gr {
    top: 440px;
  }

  .add_code_student-gr {
    width: 310px;
    position: absolute;
    left: 50%;
    top: 450px;
    transform: translate(-50%, -50%);
  }

  .sunE-input-border-blue-gr input {
    height: 32px;
    border: 1px solid #399098;
    border-radius: 16px;
    padding: 0 35px;
  }

  .sunE-input-border-blue-gr .ico_input {
    position: absolute;
    /* top: 4.5px; */
    /* left: 10px; */
    width: 24px;
  }

  .btn-filter button {
    padding: 0 26px 0 33px;
  }

  .btn-filter img {
    position: absolute;
    top: 9px;
    left: 12px;
    width: 15px;
  }

  .sunE-giaotrinh-item .img {
    width: 88px;
    height: 80px;
  }

  .sunE-giaotrinh-item .content {
    padding-left: 15px;
    padding-top: 7px;
  }

  .sunE-giaotrinh-item .content h2.title {
    font-size: 14px;
    line-height: 17px;
  }

  h2.title {
    font-family: "Myriadpro-Bold";
    font-size: 14px;
  }

  .sunE-giaotrinh-item .content h3.desc {
    font-size: 14px;
    line-height: 17px;
    margin: 0 0 7px;
  }

  .sunE-giaotrinh-item .content .easy,
  .sunE-giaotrinh-item .content .hard,
  .sunE-giaotrinh-item .content .medium,
  .sunE-giaotrinh-item .content .normal {
    padding: 2px 7px;
  }

  .lb-dc-gr .lb {
    margin-right: 7px;
  }

  .lb-dc-gr span {
    color: #fff;
    font-size: 14px;
    padding: 3px 11px;
    border-radius: 10px;
    line-height: 16px;
  }

  .topic {
    background: #fff;
    padding: 22px 16px;
    border-radius: 16px;
    margin: 0 0 11px;
  }

  .cb-score-gr p {
    font-size: 14px;
    margin: 0 0 7px;
  }

  .cb-score-gr span {
    font-size: 24px;
    font-family: "Myriadpro-Bold";
    color: #00a69c;
  }

  .item-student .item-student-img {
    width: 52px;
    height: 52px;
    border-radius: 26px;
  }

  .list-detail .item-student {
    background: #fff;
    border-radius: 16px;
    padding: 7px 7px 7px 22px;
    margin: 0 0 7px 40px;
    min-height: 76px;
  }

  .list-detail .item-student-img {
    position: absolute;
    top: 9px;
    left: -35px;
    width: 62px;
    height: 62px;
    border-radius: 31px;
    overflow: hidden;
  }

  .item-student-name h2 {
    font-size: 14px;
    line-height: 16px;
    margin: 10px 0 10px;
  }

  .list-detail .item-student .item-student-name span {
    font-size: 14px;
    line-height: 27px;
  }

  .list-detail .item-student .item-student-name img {
    width: 27px;
  }

  .box-title-bg {
    border-radius: 18px;
    height: 34px;
  }

  .box-title-bg p {
    font-size: 18px;
    /* line-height: 36px; */
  }

  .box-criteria-score-title p {
    font-size: 14px;
    padding-left: 11px;
  }

  .box-criteria-comment h2 {
    font-size: 18px;
    padding-left: 25px;
    margin: 0 0 5px;
  }

  .box-criteria-comment textarea {
    padding: 11px 11px 7px 22px;
    border-radius: 16px;
    resize: none;
    width: 100%;
    height: 200px;
  }

  .post-content {
    background: #fff;
    padding: 22px 16px;
    border-radius: 16px;
    margin: 0;
  }

  .title-post-box {
    font-size: 18px;
    line-height: 30px;
  }

  .btn-mark {
    height: 30px;
    line-height: 30px;
    padding: 0 0 0 16px;
    box-sizing: border-box;
    border-radius: 17px;
    border: none;
    cursor: pointer;
    margin: 0 7px 0 0;
  }

  .btn-mark p {
    font-size: 14px;
    padding: 0 25px;
  }

  .btn-mark img {
    width: 27px;
  }

  .btn-help {
    height: 30px;
    line-height: 30px;
    border-radius: 17px;
    border: none;
    cursor: pointer;
    padding: 0 22px;
  }

  .btn-help img {
    width: 14px;
  }

  .chambai.writing {
    margin: 0 0 11px;
  }

  .post-content .content-box-edit {
    padding: 11px 11px 7px 25px;
    border-radius: 16px;
    resize: none;
    width: 100%;
    font-size: 14px;
    height: 125px;
    overflow: auto;
  }

  .popup-tag {
    padding: 7px;
    font-size: 16px;
  }

  .sunE-giaobai-list {
    padding: 16px 22px;
    border-radius: 16px;
    max-height: calc(100vh - 170px);
    margin: 0;
  }

  .bg_no_gb {
    width: 286px;
  }

  .sunE-giaotrinh-item .content p,
  .sunE-giaotrinh-item .content span {
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 7px;
  }

  .wh27 {
    width: 20px;
    height: 20px;
  }

  .btn-setting img {
    top: 6px;
    left: 15px;
    width: 21px;
  }

  .box-info-giaobai {
    background: #fff;
    padding: 19px 16px;
    border-radius: 16px;
  }

  .box-info-giaobai h3.desc {
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 22px;
  }

  .box-info-giaobai p {
    font-size: 12px;
    line-height: 18px;
    margin: 0 0 7px;
  }

  .box-info-giaobai .text_detail {
    font-size: 14px;
    line-height: 18px;
    margin: 0 0 7px;
  }
  .sunE-container-box.giaobai-ganday {
    padding: 15px 16px 0;
  }

  .list-giaobai.chualam {
    max-height: calc(100vh - 240px);
  }

  .item-student .stt {
    line-height: 52px;
    font-size: 14px;
    width: 22px;
  }

  .btn-check-gr {
    padding-top: 13px;
  }

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

  .sunE-input-group label {
    display: block;
    margin: 0;
    padding: 0 0 7px;
    font-size: 16px;
    color: #000;
  }

  .select-gr select {
    width: 32px;
    height: 40px;
    border-radius: 10px;
    font-size: 14px;
    margin: 0 4px 0 0;
  }

  .check-box-gr label {
    font-size: 14px;
  }

  .datlichnhac-input-gr .left,
  .datlichnhac-input-gr .right {
    font-size: 14px;
  }

  .datlichnhac-input-gr input.dln-mins {
    height: 32px;
    outline: none;
    border: none;
    border-radius: 16px;
    padding: 5px 16px;
    box-shadow: 0 1px 6px 0 rgb(21 27 38 / 15%);
    box-sizing: border-box;
    text-align: center;
    font-size: 14px;
  }

  input.dln-mins::-webkit-outer-spin-button,
  input.dln-mins::-webkit-inner-spin-button {
    -webkit-appearance: none;
    margin: 0;
  }

  .nhacnho-content .datlichnhac-input-gr input.dln-mins {
    width: 60px;
  }

  .err-nhacnho img {
    margin: 11px 0 0;
  }

  .nhacnho-content textarea {
    height: 64px;
    border-radius: 16px;
    padding: 8px 16px;
    font-size: 14px;
  }

  .check-date-time-week {
    width: 320px;
    height: 32px;
    background: #fff;
    border-radius: 16px;
    padding: 0 11px;
  }

  .check-date-time-week img {
    width: 10px;
  }

  .check-date-time-week p {
    font-size: 15px;
    line-height: 32px;
  }

  .student-list-container {
    width: 280px;
  }

  .tong-hs {
    line-height: 18px;
    font-size: 14px;
    font-family: "Myriadpro-SemiBold";
    margin: 0 0 16px;
  }

  .text-title-blue {
    font-size: 14px;
  }

  .box-chart p {
    font-size: 14px;
  }

  .dtb-sum .w {
    width: 184px;
  }

  .bdg-sum .w {
    width: 151px;
  }

  .f-24 {
    font-size: 18px;
  }

  .sunE-title-medium-p {
    font-size: 14px;
    line-height: 14px;
    margin: 0 0 11px;
  }

  .custom-list-student {
    padding: 16px;
    border-radius: 16px;
  }

  .bcht .list-student {
    max-height: calc(100vh - 240px);
  }

  .student-info {
    width: 254px;
    margin-right: 16px;
  }

  .student-info .avt-i {
    width: 132px;
    height: 132px;
    border-radius: 66px;
    border: 2px solid #e7ae38;
    margin: 0 auto 16px;
  }

  .student-info .name {
    font-size: 18px;
    margin: 0 0 10px;
  }

  .email-gr img {
    width: 17px;
  }

  .email-gr p {
    font-size: 14px;
    line-height: 18px;
  }

  .box-bcht-top h2 {
    font-size: 14px;
    line-height: 32px;
  }

  .btn-history-bcht {
    border: 2px solid #00b9b7;
    line-height: 28px;
    height: 32px;
    border-radius: 16px;
    padding: 0 25px;
    font-size: 14px;
  }

  .title-info {
    border-radius: 16px;
    height: 32px;
    padding-left: 16px;
  }

  .title-info p {
    line-height: 32px;
    font-size: 14px;
  }

  .score-info {
    border-radius: 16px;
    height: 32px;
    width: 62px;
  }

  .score-info p {
    line-height: 32px;
    font-size: 14px;
  }

  .title-info.dtb-title p {
    line-height: 16px;
    font-size: 14px;
  }

  .bcht {
    padding: 10px 0 0;
  }

  .box-bcht-date-custom-hei.box-bcht {
    padding: 0;
    width: 368px;
  }

  .box-bcht.box-bcht-date-custom-hei .calendar .week-cell,
  .box-bcht.box-bcht-date-custom-hei .calendar .day-cell {
    flex-grow: 0;
    flex-shrink: 0;
    flex-basis: calc(100% / 7 - 22px);
    display: flex;
    justify-content: center;
    align-items: center;
    height: 30px;
    width: 30px;
    cursor: pointer;
    margin: 5px 0px;
  }

  .fullHeight.showMonth .calendar {
    height: auto;
  }

  .item-student-name p {
    font-size: 14px;
  }

  .score-tb-student span {
    width: 64px;
    height: 34px;
    line-height: 34px;
    font-size: 18px;
  }

  .top p {
    font-size: 16px;
  }

  .vinhdanh-item img.vinhdanh-bg {
    width: 140px;
  }

  .avt-vd {
    width: 80px;
    height: 80px;
    border-radius: 40px;
    border: 2px solid #e9af38;
    margin: 16px auto 0;
  }

  .name-vd {
    padding: 0 16px;
    line-height: 27px;
    font-size: 14px;
    color: #fff;
    border-radius: 16px;
    position: absolute;
    top: 80px;
    left: 50%;
    transform: translate(-50%, 0);
  }

  .vd-info {
    bottom: 8px;
    font-size: 14px;
  }

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

  .diemdanh-no-item img {
    width: 306px;
  }

  .diemdanh-no-item p {
    font-size: 18px;
  }

  .btn-create-diemdanh img {
    width: 16px;
    top: 7px;
  }

  .btn-create-diemdanh button {
    padding: 0 16px 0 40px;
  }

  .medium-title {
    font-size: 14px;
  }

  .menu-gr-right input[type="text"].btn {
    height: 36px;
    border-radius: 18px;
    font-size: 14px;
    line-height: 36px;
    padding: 0 24px;
  }

  .btn-ob.select {
    font-size: 14px;
    height: 36px;
    line-height: 36px;
    border-radius: 18px;
  }

  .btn-ob .select-styled {
    border-radius: 18px;
    font-size: 14px;
    line-height: 36px;
    height: 36px;
    padding: 0 24px;
  }

  .btn-ob .select-styled:after {
    content: "";
    width: 18px;
    height: 10px;
    top: 14px;
    right: 8px;
    background: url(./../images/teacher/diemdanh/ico_dropdown_blue.png) 90% /
      18px no-repeat transparent;
  }

  .btn-ob .select-styled.active:after {
    background: url(./../images/teacher/diemdanh/ico_dropup_blue.png) 90% / 18px
      no-repeat transparent;
  }

  .btn-ob .select-options {
    padding: 37px 19px 0;
  }

  .btn-ob .select-options li {
    text-indent: 18px;
  }

  .menu-gr-right .react-datepicker-wrapper input[type="text"] {
    height: 36px;
    border-radius: 18px;
    font-size: 14px;
    line-height: 36px;
    padding: 0 24px;
  }

  .box-select-gr {
    border-radius: 16px;
    padding: 22px 0 22px 25px;
    margin: 0 0 11px 16px;
  }

  .box-select-gr .thumb {
    position: absolute;
    top: -2px;
    left: -24px;
    border: 4px solid #fff;
    width: 78px;
    height: 78px;
  }

  .box-select-info h2 {
    font-size: 14px;
    line-height: 16px;
  }

  .box-giaotrinh-gr {
    border-radius: 16px;
    height: 48px;
    margin: 0 0 22px 16px;
    padding: 0 11px 0 48px;
  }

  .custom-select-no-bg .select-styled {
    padding-left: 48px;
  }

  .custom-select-no-bg .select-styled {
    height: 32px;
    border-radius: 16px;
    font-size: 14px;
    padding-right: 32px;
    line-height: 32px;
    /* background: url(./../images/icon/ico_dropdown_s.png) 97% / 16px no-repeat
      #fff; */
  }

  .custom-select-no-bg .select {
    font-size: 14px;
    width: 100%;
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
  }

  .btn-bar img {
    height: 32px;
  }

  .sunE-container-box.giaotrinh.unit {
    padding: 0 16px;
  }

  .sunE-unit-item h2 {
    font-size: 16px;
  }

  .sunE-unit-item p {
    font-size: 14px;
  }

  .img-bg-x {
    width: 138px;
    height: 212px;
    background-size: 100%;
    margin: auto;
  }

  .img-bg-x .__avt_unit {
    margin-top: 30px;
    margin-left: -5px;
  }

  .__way_map {
    position: absolute;
    transform: translate(75%, 95%);
  }

  .__way_map_down {
    position: absolute;
    transform: translate(65%, 150%);
  }

  .sunE-unit-item .h-287 {
    height: 212px;
  }

  .giaotrinh.unit .unit-list .box-giaotrinh-gr {
    border-radius: 26px;
    height: 40px;
  }

  .btn-more-info {
    width: 32px;
    height: 32px;
    border-radius: 16px;
    right: 6px;
    top: 4px;
  }

  .btn-more-info img {
    width: 11px;
  }

  .btn-more-info .show_img {
    width: 6px;
  }

  .btn-more-info .show_ {
    margin: 14px 0 0 1px;
    width: 8px;
  }

  .info-item-desc h2 {
    font-size: 14px;
    line-height: 16px;
  }

  .sunE-giaotrinh-resuft-filter {
    padding: 16px 24px;
    border-radius: 16px;
    max-height: calc(100vh - 230px);
  }

  .chk-custom-gr label:before {
    padding: 9px;
    margin-right: 8px;
    border-radius: 2px;
    margin-top: -1px;
  }

  .chk-custom-gr input:checked + label:after {
    top: -7px;
    left: 9px;
    width: 5px;
    height: 16px;
  }

  .sunE-giaotrinh-item .chk-gr .chk-custom-gr label:before {
    margin-top: -9px;
  }

  .sunE-giaotrinh-resuft-filter.box-shadow.scrollbar-custom.flex-1
    .sunE-giaotrinh-item
    .chk-gr
    .chk-custom-gr
    label:before {
    margin-top: -5px;
  }

  .select-all .wh20.chk-custom-gr input:checked + label:after {
    top: -4px;
  }

  /* Check box select all */
  .checbox-right .wh20.check-select-student input:checked + label:after {
    top: -8px;
  }

  .btn-create-taomoi button,
  .btn-create-datlai button {
    padding: 0 25px 0 48px;
  }

  .btn-create-taomoi img {
    left: 11px;
    top: 8px;
    width: 18px;
  }

  .class-box-desc .title-line-blue {
    margin: 0 0 10px;
  }

  .box-btn {
    width: 24px;
    height: 24px;
  }

  .ico_ring-res-7 {
    width: 14px;
  }

  .ico_message-res-7 {
    width: 15px;
  }

  .reng {
    width: 8px;
    height: 8px;
    border-radius: 4px;
    bottom: 0;
    right: 0;
  }

  .tn-menu-item p {
    font-size: 14px;
  }

  .tinnhan-item h2 {
    font-size: 14px;
    line-height: 14px;
    margin: 0 0 6px;
  }

  .tinnhan-item span {
    font-size: 10px;
  }

  .tinnhan-item p.mes-info {
    font-size: 14px;
    line-height: 18px;
    max-height: 54px;
  }

  .mex-info-box p {
    font-size: 14px;
  }

  .mes-box-send {
    height: 40px;
    line-height: 21px;
    font-size: 14px;
    padding: 8px 16px 8px 16px;
    border-top-left-radius: 20px;
    border-bottom-left-radius: 20px;
  }

  .box-btn-send {
    height: 40px;
    width: 40px;
    border-top-right-radius: 20px;
    border-bottom-right-radius: 20px;
  }

  .send-mes img {
    width: 20px;
  }

  .search-gr-p {
    height: 40px;
    box-sizing: border-box;
    margin: 15px 0 6px;
  }

  .select-message.select {
    font-size: 14px;
    width: 148px;
    height: 36px;
    line-height: 36px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .select-message .select-styled {
    font-size: 14px;
    width: 148px;
    height: 36px;
    line-height: 36px;
    border-top-right-radius: 0;
    border-bottom-right-radius: 0;
  }

  .search-custom {
    width: 296px;
    height: 36px;
    line-height: 36px;
    padding: 0 34px 0 16px;
    font-size: 14px;
    font-family: "Myriadpro-Regular";
    box-sizing: border-box;
    border: none;
    text-align: center;
    border-top-right-radius: 18px;
    border-bottom-right-radius: 18px;
    outline: none;
  }

  .icon_search {
    position: absolute;
    right: 11px;
    top: 10px;
    width: 18px;
  }

  ._line_box {
    padding: 5px 0;
    height: 36px;
  }

  ._line {
    height: 26px;
    top: 5px;
  }

  .select-message .select-styled:after {
    content: "";
    width: 14px;
    height: 8px;
    background: url(./../images/tinnhan/ico_dropdown.png) 98% / 14px no-repeat
      transparent;
    top: 14px;
    right: 24px;
  }

  .class_student_list_box {
    padding: 16px;
    border-radius: 16px;
    height: calc(100vh - 160px);
  }

  .list-student {
    max-height: calc(100vh - 200px);
  }

  .mex-box.cus-hei-2 {
    height: calc(100vh - 160px);
  }

  .tinnhan-item .dot-active {
    width: 10px;
    height: 10px;
    top: 10px;
    left: 10px;
  }

  .box-detail-hs .avt-ab {
    width: 160px;
    height: 160px;
    border-radius: 50%;
    overflow: hidden;
  }

  .box-detail-hs .avt-ab {
    position: absolute;
    top: -80px;
    left: calc(50% - 80px);
  }

  .box-detail-ab {
    top: 110px;
    padding: 0 60px;
  }

  .box-detail-ab .box-detail-hs {
    border-radius: 16px;
    padding: 70px 16px 10px;
    width: 310px;
  }

  .box-detail-hs h2.name {
    font-size: 24px;
  }

  .detail-info {
    padding: 0 20px 10px;
  }

  .info-sum h3 {
    font-size: 40px;
  }

  .sunE-container-box.hoso {
    min-height: auto;
  }

  .info-sum {
    margin: 40px 0 0;
  }

  .avatar-edit {
    margin: 20px 0 0;
  }

  .avatar-edit-box {
    background: #fff;
    width: 156px;
    height: 156px;
    border-radius: 78px;
    margin: 0 auto 25px;
    padding: 3px;
  }

  .hoso .btn-save button {
    padding: 0 25px;
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
    font-size: 14px;
    min-width: 100px;
  }

  .avatar-edit-box .img-edit-avt {
    position: absolute;
    bottom: 0;
    background: #fff;
    height: 40px;
    width: 100%;
    text-align: center;
  }

  .avatar-edit-box .img-edit-avt img {
    width: 29px;
    height: 22px;
    border-radius: 0;
    margin-top: 8px;
  }

  .list-menu-custom {
    width: 240px;
  }

  .btn-gr-text p {
    font-size: 14px;
    font-family: "Myriadpro-Bold";
    color: #00a79d;
    line-height: 46px;
  }

  .btn-gr {
    margin: 0 0 10px;
    border-radius: 11px;
    height: 46px;
  }

  .apdung label {
    margin: 11px 0;
    font-size: 14px;
    padding: 0 0 8px 10px;
  }

  .apdung.apdung-custom label {
    margin: 10px 0 10px 10px;
    padding: 0;
  }

  .thoikhoabieu.tb .apdung .valid_to_input .react-datepicker-wrapper {
    width: 100px;
  }

  .valid_to_input input {
    font-size: 14px;
    width: 80px;
    margin-right: 0;
    text-align: center;
  }

  .thoikhoabieu.tb .valid_to_input {
    margin: 10px 0 0 15px;
  }

  .btn-create-datlai img {
    left: 11px;
    top: 6px;
    width: 18px;
  }

  .orange span,
  .red span,
  .success-text span {
    font-size: 14px;
    line-height: 20px;
  }

  .his {
    margin-top: -5px;
    width: 95px;
  }

  .btn-select-year button {
    padding: 0 45px;
  }

  .btn-select-year .ico_right,
  .btn-select-year .ico_left {
    top: 7px;
    width: 11px;
  }

  .title-list-lichnam h2 {
    font-size: 18px;
  }

  .btn-remove-item {
    width: 40px;
    height: 40px;
  }

  .btn-remove-item img {
    width: 16px;
  }

  .popup-filter-option .wh20.chk-custom-gr input:checked + label:after {
    top: -4px;
  }

  .ql-bt-dg.sunE-giaotrinh-resuft-filter {
    max-height: calc(100vh - 140px);
  }

  .box-setting-custom {
    border-radius: 16px;
    padding: 16px;
    margin: 0 0 8px;
  }

  .setting-title-blue {
    font-size: 18px;
    line-height: 24px;
    margin: 0 0 8px;
  }

  .w80 {
    width: 60px;
  }

  /*CUSTOM ON OFF BUTTON*/
  .toggle-button-cover {
    position: relative;
    width: 38px;
  }

  .knobs,
  .layer {
    position: absolute;
    top: 0;
    right: 0;
    bottom: 0;
    left: 0;
  }

  .button {
    top: calc(50% - 10px);
    width: 38px;
    height: 15px;
  }

  .button.r,
  .button.r .layer {
    border-radius: 86px;
  }

  /* Button 1 */
  .btn-on-off .knobs:before {
    top: -5px;
    left: -4px;
    width: 24px;
    height: 24px;
    font-size: 10px;
  }

  .btn-on-off.active .checkbox:checked + .knobs:before {
    left: 18px;
  }

  /*END CUSTOM ON OFF BUTTON*/
  .setting-on-off-box p {
    font-size: 14px;
    line-height: 18px;
  }

  .setting-on-off-box {
    margin: 0 0 1rem;
  }

  .select-language .select-styled {
    height: 18px;
    line-height: 18px;
    font-size: 14px;
  }

  .setting-on-off-box .center-flex img {
    width: 10px;
  }

  .btn-gr-img {
    width: 86px;
    padding: 10px 0;
  }

  .list-menu-custom .btn-gr-img.ico_ma img {
    width: 28px;
  }

  .list-menu-custom .btn-gr-img.ico_buy img {
    width: 32px;
  }

  .list-menu-custom .btn-gr-img.ico_time img {
    width: 27px;
  }

  .slider-custom {
    max-width: 380px;
  }

  .item-top-title p {
    font-size: 16px;
  }

  .item-price p {
    font-size: 22px;
  }

  .slider-custom .slider-item-content img.details-ig {
    margin: auto;
    width: 224px;
  }

  .slider-custom .slick-arrow.slick-next {
    left: calc(100% - 22px);
  }

  .slider-custom .slick-arrow.slick-prev {
    left: -9px;
  }

  .custom-select-w {
    width: 320px;
  }

  .input-nm {
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
    padding-left: 16px;
    margin: 0 0 15px;
    font-size: 14px;
  }

  .box-white-content p,
  .btn_click_link {
    font-size: 14px;
  }

  .student-index {
    padding: 5.5vh 20px 10px;
  }

  .map-skill span {
    width: 160px;
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
    font-size: 14px;
  }

  .map-skill img {
    top: -19px;
    left: -4px;
    width: 44px;
  }

  .star img {
    width: 32px;
    height: 32px;
  }

  .pink-ab {
    bottom: 16px;
    right: 55px;
  }

  .pink-ab img {
    width: 45px;
  }

  .box-unit-info p,
  .box-unit-info p span {
    font-size: 14px;
  }

  .giaotrinh.unit .box-giaotrinh-gr {
    padding: 0 15px 0 34px;
    margin: 0 0 16px 16px;
  }

  .list-menu-custom.student {
    width: 240px;
  }

  .bg_top_tt {
    width: 100%;
  }

  .mte-gr .mte-thumb {
    width: 48px;
    height: 48px;
    border: 3px solid #fff;
    top: -5px;
    left: -15px;
  }

  .mte-gr {
    background: #fff;
    height: 38px;
    width: 110px;
    border-radius: 19px;
    text-align: center;
    padding-left: 20px;
  }

  .mte-gr h2 {
    line-height: 22px;
    font-size: 22px;
  }

  .circle-k {
    width: 20px;
    height: 20px;
    border-radius: 10px;
    margin-left: -2px;
  }

  .line-k {
    width: 36px;
    height: 7px;
    margin-top: 7px;
  }

  .process-info-k .space {
    width: 50px;
    text-align: center;
  }

  .process-info-k .space p {
    font-size: 14px;
    font-family: "Myriadpro-Light";
    line-height: 14px;
  }

  .list-menu-custom.student .btn-gr-text p {
    line-height: 50px;
  }

  .list-menu-custom.student .btn-gr {
    height: 50px;
  }

  .btn-gr-img.ico_thanhtich_offline {
    padding: 8px 0;
  }

  .ico_thanhtich_offline img {
    width: 40px;
  }

  .ico_thanhtich_online img {
    width: 28px;
  }

  .ico_xephang img {
    width: 38px;
  }

  .process-thumb img {
    width: 48px;
    height: 48px;
  }

  .skill-process-list {
    margin: 22px 0 0;
    padding: 14px 22px 8px 38px;
    background: rgba(0, 0, 0, 0.2);
    border-radius: 16px;
  }

  .skill-process-item p.title {
    line-height: 18px;
    font-size: 14px;
  }

  .process-100 {
    height: 22px;
    border-radius: 11px;
    padding: 4px 4px 4px 31px;
  }

  .process-due {
    height: 14px;
  }

  .sco {
    width: 78px;
    height: 22px;
    border-radius: 11px;
    box-sizing: border-box;
    background: #fff;
    padding: 0 5px 0 11px;
    margin: 18px 0 0 10px;
  }

  .sco .slp {
    line-height: 22px;
    font-size: 18px;
  }

  .sco .slp-top {
    line-height: 8px;
    font-size: 10px;
    top: -8px;
  }

  .top-t {
    height: 34px;
    border-radius: 17px;
    padding: 0 22px;
    margin: 0 0 14px;
  }

  .top-t p {
    font-size: 14px;
    line-height: 34px;
  }

  .box-s {
    padding: 0 5px 0 30px;
  }

  .box-s span {
    height: 26px;
    margin-top: 5px;
    border-radius: 14px;
    font-size: 14px;
    line-height: 26px;
    padding: 0 4px 0 30px;
  }

  .box-s img {
    top: 4px;
    left: 4px;
  }

  .box-s .select {
    font-size: 14px;
    color: #00cbad;
    width: 110px;
    height: 26px;
    line-height: 26px;
    border-radius: 13px;
    margin-top: 4px;
  }

  .box-s .select-styled {
    width: 110px;
    height: 26px;
    line-height: 26px;
    border-radius: 13px;
    font-size: 14px;
    padding: 0 4px 0 30px;
  }

  .select-chart .select-styled {
    padding: 0 5px;
    text-align: center;
    width: 100%;
  }

  .box-s .select-options {
    padding: 18px 8px 0;
    top: 18px;
    border-radius: 18px;
    max-height: calc(100vh - 100px);
  }

  .box-s .select img {
    top: 4px;
    left: 4px;
    width: 20px;
  }

  .box-nhatkyhoctap-graph .bangdiem-menu-gr span {
    font-size: 14px;
  }

  .box-diem .top-o p {
    font-size: 14px;
    line-height: 16px;
  }

  .box-diem h2 {
    font-size: 35px;
  }

  .his-hd {
    height: auto;
    min-height: calc(100vh - 130px);
    padding: 14px 21px;
  }

  .b-26-black {
    line-height: 24px;
    font-size: 18px;
    font-family: "Myriadpro-Bold";
    margin: 11px 0 8px;
  }

  .img-avatar-k {
    width: 72px;
    height: 72px;
    border-radius: 36px;
    border: 3px solid #fff;
    margin-right: 15px;
  }

  .bxh-info-student-box h3 {
    font-size: 18px;
    line-height: 22px;
    margin: 0 0 8px;
  }

  .gr-r p {
    font-size: 14px;
    line-height: 18px;
  }

  .gr-r span {
    font-size: 18px;
    line-height: 22px;
  }

  .ico_hc {
    width: 16px;
  }

  .sub-title-18 {
    display: block;
    font-size: 14px;
    line-height: 18px;
  }

  .box-top-k {
    border-radius: 15px;
    padding: 8px 15px;
  }

  .top-k-score {
    width: 60px;
    height: 22px;
    font-size: 14px;
    line-height: 22px;
    border-radius: 11px;
    margin: 0 auto 11px;
  }

  .top-k-item.v {
    width: 126px;
    margin: 0 11px;
  }

  .top-k-item.s,
  .top-k-item.b {
    width: 88px;
  }

  .top-k-item.s .avt-top-k .ico_avt,
  .top-k-item.b .avt-top-k .ico_avt {
    top: 13px;
    left: 21px;
    width: 45px;
    height: 45px;
    border-radius: 23px;
  }

  .top-k-item.v .avt-top-k .ico_avt {
    top: 30px;
    left: 35px;
    width: 56px;
    height: 56px;
    border-radius: 29px;
  }

  .thanhtich-container {
    padding: 10px 0 0;
  }

  .student_bxh_list .item-student {
    padding: 8px 15px;
    border-radius: 15px;
    margin: 0 0 8px;
  }

  .student_bxh_list .item-student .item-student-img {
    width: 40px;
    height: 40px;
    border-radius: 20px;
    border: 1px solid #e9af38;
  }

  .student_bxh_list .item-student-name p {
    line-height: 40px;
    font-size: 14px;
  }

  .student_bxh_list .item-student .stt {
    line-height: 40px;
    font-size: 14px;
    width: 22px;
  }

  .hcs {
    font-size: 14px;
    line-height: 14px;
    margin: 0 10px 0 4px;
  }

  .lv-down img,
  .lv-up img {
    width: 16px;
  }

  .student_bxh_list {
    max-height: 350px;
  }

  .edit-profile-student button {
    padding: 0 15px 0 35px;
  }

  .edit-profile-student .ico_edit_profile {
    position: absolute;
    left: 11px;
    top: 6px;
    width: 18px;
  }

  .box-detail-hs.student .avt-ab {
    width: 110px;
    height: 110px;
    top: -55px;
    left: calc(50% - 55px);
  }

  .ph-add-gr h2 {
    font-size: 18px;
    line-height: 22px;
    margin-bottom: 10px;
  }

  .parent-info .avatar {
    width: 56px;
    height: 56px;
    border-radius: 28px;
    margin-right: 15px;
  }

  .parent-info p {
    font-size: 14px;
    line-height: 14px;
    margin: 15px 0 5px;
  }

  .parent-info span {
    font-size: 14px;
    line-height: 18px;
  }

  .box-detail-ab.student-ab {
    top: 86px;
  }

  .avatar-edit-box.student {
    width: 136px;
    height: 136px;
  }

  .avatar-edit.student {
    padding-top: 0;
  }

  .kh-title h2 {
    font-size: 18px;
  }

  .btn-create-khk span {
    width: 80px;
    height: 28px;
    min-width: 80px;
    padding: 0 15px;
    line-height: 28px;
  }

  .line38 {
    line-height: 28px;
  }

  .btn-create-khk .ico_add_kh {
    position: absolute;
    top: 7px;
    left: 11px;
    width: 14px;
  }

  .btn-create-khk .ico_line_kh {
    position: absolute;
    top: 4px;
    left: 45px;
  }

  .btn-create-khk .ico_line_kh {
    position: absolute;
    left: 33px;
    height: 22px;
  }

  .sunE-time-lcv .select-custom-bg .select-styled:after {
    top: 6px;
    right: 6px;
  }

  .f24 {
    font-size: 18px !important;
  }

  .img-upload {
    height: 400px;
  }

  .class-box-desc span.class-online,
  .class-box-desc span.class-offline {
    font-size: 18px;
    font-family: "Myriadpro-SemiBold";
  }

  .btn-remove-student {
    padding-top: 16px;
  }

  .btn-remove-student img {
    width: 18px;
  }

  .box-shadow.custom-list-student.class_student_list_box.review {
    height: calc(100vh - 200px);
  }

  .mg-top-0 .chk-custom-gr label:before {
    margin-top: 0px;
  }

  .box-criteria {
    max-height: 217px;
    /* max-height: fit-content; */
  }

  .box-criteria-full {
    max-height: fit-content;
  }

  .box-criteria-scroll {
    max-height: 250px;
  }

  .dk_class .select-all {
    /* margin-right: 14px; */
    padding-right: 35px;
  }

  .change_point_checkbox_add_exercise {
    padding-right: 40px !important;
  }

  .giaotrinh.unit .unit-list .box-giaotrinh-gr {
    padding: 0 45px 0 25px;
  }

  .box-bcht-date-custom-hei .calendar .day-cell.hide_collapse,
  .box-bcht-date-custom-hei .calendar .day-cell.hide_collapse {
    display: none;
  }

  .box-bcht-date-custom-hei .fullHeight .calendar .hide_collapse,
  .box-bcht-date-custom-hei .fullHeight .calendar .hide_collapse {
    display: flex;
  }

  .set-max-w {
    max-width: 302px;
  }

  .select-all-k.mg-top-0.flex-m {
    margin-right: 10px;
  }

  .max-w-hidden {
    max-width: 220px;
    margin: 0px auto 10px;
  }

  .setting-on-off-box .btn.f-13 {
    font-size: 14px;
  }

  .sunE-container-box.setting {
    padding: 10px 10px 0;
  }

  .gioithieu-info p {
    line-height: 18px;
    font-size: 16px;
  }

  .term-info p {
    line-height: 20px;
    color: #404041;
    font-size: 14px;
    font-family: "Myriadpro-Regular";
    padding: 0 0 20px;
  }

  .chk-custom-gr.top-1 {
    margin-top: -1px;
  }

  .mt-17 {
    margin-top: 17px;
  }

  .box-video-project {
    height: 200px;
  }

  .box-giaotrinh-gr.rel.box-shadow .thumb img {
    /* max-width: 30px; */
  }

  .file-support-list {
    overflow: auto;
    max-height: 90px;
    padding-right: 10px;
  }

  .ldjas
    .giaotrinh.teacher-giaobai
    .giaotrinh.filter
    .sunE-giaotrinh-resuft-filter {
    height: calc(100vh - 230px);
  }

  .text-center.box-video-project.img-bg {
    max-height: 180px;
  }

  .list-chart-gr .dtb-sum .w {
    width: 183px;
  }

  .list-chart-gr .bdg-sum .w {
    width: 178px;
  }

  .sunE-box-tkh,
  .sunE-box-xkh {
    padding: 0 15px;
  }

  .input-gr input,
  .input-gr select {
    height: 32px;
    border-radius: 16px;
    padding: 5px 15px;
    font-size: 14px;
  }

  .input-gr label,
  .laplai label,
  .ct-hs label.ht {
    font-size: 14px;
    padding: 0 0 7px 12px;
  }

  .input-gr textarea {
    height: 60px;
    font-size: 14px;
  }

  .input-gr {
    margin: 0 0 12px;
  }

  .radio-item {
    padding: 0 5px;
    margin: 6px 0 0;
  }

  .radio-item label:before {
    top: 1px;
    margin: 0 5px 0 0;
    width: 12px;
    height: 12px;
    border-radius: 6px;
  }

  .tp-k .time-to.select-time input {
    font-size: 14px;
    margin: 11px 0 0 15px;
  }

  .apdung.tp-k .time-to.select-time .ico_edit_time_to {
    top: 12px;
  }

  .apdung .time-to.select-time .ico_edit_time_to {
    left: 119px;
  }

  .apdung.tp-k {
    margin: 0;
  }

  .laplai {
    margin: 0 0 10px;
    padding-left: 0;
  }

  .select-custom-bg .select-styled {
    height: 32px;
    border-radius: 16px;
    font-size: 14px;
    line-height: 32px;
  }

  .select-custom-bg .select {
    height: 32px;
    line-height: 32px;
    border-radius: 16px;
  }

  .select-custom-bg .select-styled:after {
    content: "";
    width: 20px;
    height: 20px;
    top: 4px;
    right: 5px;
    background: url(./../images/icon/ico_dropdown_border_white.png) 96% / 20px
      no-repeat transparent;
  }

  ._detail p {
    font-size: 14px;
    line-height: 20px;
    max-height: 40px;
  }

  ._tb .title p {
    font-size: 16px;
  }

  .nkht-op.list-schedule {
    max-height: calc(100vh - 100px);
  }

  .schedule-i p {
    font-size: 14px;
  }

  .time-h {
    width: 60px;
  }

  .time-h p {
    font-size: 16px;
    padding-left: 5px;
  }

  .score-d p {
    font-size: 16px;
    text-align: center;
  }

  .bg_edit_student_profile {
    top: -27px;
  }

  .iZROEJ .select-styled {
    height: 36px !important;
  }

  .iZROEJ .select-styled::after {
    top: 4px !important;
  }

  .iZROEJ .select-options {
    margin-top: 10px;
  }

  .sunE-input-gr input {
    height: 36px;
    line-height: 36px;
    font-size: 14px;
    padding-left: 20px;
    border-radius: 18px;
  }

  .sunE-input-gr label {
    padding: 0 0 0 15px;
    font-size: 14px;
  }

  .hoso .sunE-male-female {
    width: 36px;
    height: 36px;
    border-radius: 18px;
    line-height: 36px;
  }

  .hoso .ico_male,
  .hoso .ico_male_active {
    width: 17px;
    margin: 10px;
  }

  .hoso .ico_female,
  .hoso .ico_female_active {
    width: 12px;
    margin: 8px 12px;
  }

  .hoso .sunE-male-female span {
    font-size: 16px;
    line-height: 36px;
  }

  .sunE-container-box.hoso .form-sunE-button {
    margin: 10px 0 0 !important;
  }

  .box-detail-hs .avt-ab {
    border: 3px solid #fff;
  }

  .add_code_student-gr .ico_err {
    top: 4px;
  }

  .time-to-khht-cn .ico_edit_time_to_khht {
    top: -1px;
    right: -24px;
  }

  .valid_to_input {
    margin: 13px 0 0 10px;
  }

  .item-student-name span {
    font-size: 16px;
    line-height: 20px;
  }

  .slider-item-desc .btn-img img.ico_add_custom {
    width: 16px;
    top: 8px;
    left: 10px;
  }

  .btn-img .create_class_new.btn-line-blue {
    padding-left: 35px;
  }

  .item-student-name.max-w-1 p {
    max-width: 130px;
  }

  .custom-4.slider-custom {
    max-width: 320px;
  }

  .thanhtich-offline-box .top-title-name.two-line {
    max-height: 55px;
  }

  .top-title-name p {
    font-size: 18px;
    line-height: 23px;
    font-family: "Myriadpro-SemiBold";
    color: #00a79d;
    text-align: center;
  }

  .title-k {
    font-size: 20px;
    line-height: 24px;
    font-family: "Myriadpro-SemiBold";
    color: #00a79d;
    margin: 0 0 10px;
    text-transform: uppercase;
  }

  .gr-k p {
    text-align: left;
    font-size: 16px;
    line-height: 45px;
    font-family: "Myriadpro-Light";
    color: #231f20;
    margin: 0;
    padding: 0;
  }

  .gr-k span {
    display: block;
    font-size: 18px;
    line-height: 45px;
    font-family: "Myriadpro-Bold";
    color: #00a79d;
    margin: 0;
    padding: 0;
  }

  .slider-custom.custom-4 .slick-dots {
    bottom: -60px;
  }

  .bg_auth {
    max-width: 100%;
    width: 100%;
  }

  /* File Support CSS */
  .pasd.sunE-container-box {
    padding: 17px 20px 0;
  }

  .__overview_report {
    padding: 20px 0px;
  }

  .responsive_low_screen_files_support {
    padding: 0 40px 0 40px !important;
  }

  .responsive_btn_assign_assignments {
    width: 100px !important;
  }

  .ml--5 {
    margin-left: 0;
  }

  /*golden board*/
  .block_golden_board {
    padding: 0;
  }

  .height_top_3_golden_board {
    height: calc(100vh - 100px) !important;
    padding: 10px 0 10px 0;
  }

  .padding_tops_golden_board {
    padding: 15px 10px 15px 20px !important;
  }

  .width_block_top_golden_board {
    height: 80px;
    width: 35%;
  }

  .top_1_crown {
    width: 35%;
    left: 33px !important;
    top: 7px !important;
  }

  .top_1_avatar {
    top: 25px !important;
    left: 30px !important;
    width: 40px !important;
    height: 40px !important;
  }

  .slick-dots {
    bottom: -30px !important;
  }

  .slider-custom-student .slider_student_wrapper .slick-dots {
    position: relative !important;
    bottom: 0 !important;
    margin: 0.3rem 0 0.5rem;
  }

  .space_null_responsive_home_page_teacher {
    width: 145px !important;
  }

  .font_average_score {
    margin-bottom: 10px !important;
  }

  .height_calendar_responsive {
    min-height: 335px;
  }

  .upgrade_container {
    padding-top: 0.25rem;
  }

  .form_upgrade {
    padding-top: 0.75rem !important;
  }

  .title_upgrade {
    padding-bottom: 0.5rem !important;
  }

  .content_homepage_student .slider_homepage_student {
    margin-bottom: 0.25rem !important;
  }
}