a {
     text-decoration: none;
}
.noborder-bottom{
  border-bottom:0px !important;
}
.shadwo-nav{
  box-shadow: 0 1px 2px 0 rgb(60 64 67 / 30%), 0 2px 6px 2px rgb(60 64 67 / 15%);
}
.class-subtitle{
  margin-top: 27px !important;
}
.class-img{
  height: 94px;
}
.error_crit_degree{
  font-size: 11px;
    color: #c51010;
}
.class-header{
  width: 100%;
height: -webkit-fit-content;
height: -moz-fit-content;
height: fit-content;
justify-content: space-between;
}
.criterion_degrees,.criterion_degrees:focus,.criterion_degrees:active,.criterion_degrees:focus-visible{
  border: 0;
    background-color: #cedbdb0d;
    border-bottom: 1px solid gray;
}
/* .classfile-img:before {
  background-color: rgb(32 33 36 / 49%);
  content: "";
  height: 100%;
  left: 0;
  position: absolute;
  top: 0;
  width: 100%;
  border-radius: 10px;
} */
.group-main-info {
    display: flex;
    justify-content: flex-start;
    z-index: 1;
}
.group-main-info .group-color-bar {
    display: inline-block;
    width: 10px;
    height: 64px;
    margin-top: 2px;
    border-radius: 9px;
}
.group-main-info .group-info {
    max-width: 90%;
    position: relative;
    margin: 0 14px;
  }
  .truncated-group-title {
      vertical-align: top;
      font-size: 32px;
      font-weight: 500;
      color: #fff;
      margin-bottom: 4px;
      white-space: normal;
      word-break: keep-all;
  }
  .group-details {
      display: inherit;
      font-size: 16px;
      line-height: 20px;
      font-weight: 400;
      color: #fff;
    }
    .group-options {
    position: relative;
  }
  .group-options .group-settings-container {
    position: absolute;
    right: -20px;
    bottom: -2px;
    }
.class-container{
flex-basis: 48%;
flex-grow: 0;
margin: 0 2% 16px 0;
border-radius: 8px;
height: 137px;

}
.upload-class-img{
  color: #fff;
  font-size: 17px;
}
.upload-class-img:hover{
  color: #fff;
  text-decoration: underline;
}
.create-classfile-div{
  display: inline-block;
}
.create-classfile-div .dropdown-menu.show{
  left: -39px !important;

}
.create-classfile i{
  padding-right: 15px;
}
.create-classfile-btn{
  background-color: #1a237e;
border: 1px solid #1a237e;
color: #fff;
font-size: 17px;
font-weight: 400;
box-shadow: 0 0 0 0.2rem rgb(26 35 126 / 50%);
float: inline-start;
margin: 3px 14px;


}
.create-classfile-btn:hover {
    background-color: #283593;
    border: 1px solid #283593;
        /* box-shadow: 0 2px 3px 0 rgb(23 78 166 / 30%), 0 6px 10px 4px rgb(23 78 166 / 15%); */
}
.create-classfile-btn:focus {

box-shadow: 0 0 0 0.2rem rgb(26 35 126 / 50%);
    /* box-shadow: 0 2px 3px 0 rgb(23 78 166 / 30%), 0 6px 10px 4px rgb(23 78 166 / 15%); */
}
 .create-classfile-btn:not(:disabled):not(.disabled):active,.show>.create-classfile-btn.dropdown-toggle {
    color: #fff;
    background-color: #283593 !important;
    border-color: #283593 !important;
    box-shadow: 0 0 0 0.2rem rgb(26 35 126 / 50%) !important;
        /* box-shadow: 0 2px 3px 0 rgb(23 78 166 / 30%), 0 6px 10px 4px rgb(23 78 166 / 15%)!important; */
}
.create-classfile-btn i{
  padding-right: 15px;
}
.create-classfile{
  background-color: #1a237e;
    border: 1px solid #1a237e;
    color: #fff;
    font-size: 17px;
    font-weight: 400;
    padding: 15px 20px !important;
    border-radius: 1.7rem;
    box-shadow: 0 0 0 0.2rem rgb(26 35 126 / 50%);
    /* box-shadow: 0 1px 2px 0 rgb(23 78 166 / 30%), 0 2px 6px 2px rgb(23 78 166 / 15%); */

}
.create-classfile:hover {
    background-color: #283593;
    border: 1px solid #283593;
        /* box-shadow: 0 2px 3px 0 rgb(23 78 166 / 30%), 0 6px 10px 4px rgb(23 78 166 / 15%); */
}
.create-classfile:focus {

box-shadow: 0 0 0 0.2rem rgb(26 35 126 / 50%);
    /* box-shadow: 0 2px 3px 0 rgb(23 78 166 / 30%), 0 6px 10px 4px rgb(23 78 166 / 15%); */
}
 .create-classfile:not(:disabled):not(.disabled):active,.show>.create-classfile.dropdown-toggle {
    color: #fff;
    background-color: #283593 !important;
    border-color: #283593 !important;
    box-shadow: 0 0 0 0.2rem rgb(26 35 126 / 50%) !important;
        /* box-shadow: 0 2px 3px 0 rgb(23 78 166 / 30%), 0 6px 10px 4px rgb(23 78 166 / 15%)!important; */

}
.cust_title{
  padding: 20px;
font-size: 32px;
}
.class-card{
    border-radius: 8px;
    border-color: #ccced7;
    cursor: pointer;
    height: 100%;
    width: 100%;

    position: relative;
  }
  .class-card-subtitle {
      font-size: 1rem;
      font-weight: 400;
      color: #fff;
      margin-top: -.375rem;
      line-height: 19px;
  }
  .class-card-title{
    font-size: 1.5rem;
      font-weight: 400;
      word-break: break-word;
      color: #fff;

  }
  .nobackground_color{
    background-color: #ff000000!important;
  }
  .group-page-header.has-image {
      background-position: 50%;
      min-height: 287px;
    border-radius: 4px;
  }
  ..nav-link-cus{
    color: #5f6368;

    -webkit-align-items: center;
      align-items: center;
      display: -webkit-box;
      display: -webkit-flex;
      display: flex;
      border-bottom: solid 0.125rem transparent;
      -webkit-box-sizing: border-box;
      box-sizing: border-box;
      text-decoration: none;
      letter-spacing: .01785714em;
      font-family: 'Google Sans',Roboto,Arial,sans-serif;
      /* font-size: 0.875rem; */
      font-weight: 500;
      line-height: 1.25rem;
      text-transform: none;
      height: 4rem !important;

  }
  .nav-link-cus.active{
    color: #174ea6 !important;
    border-bottom-color: #174EA3;
  }
  .nav-link-cus.active:after{
    border-top-width: 0.25rem;
  border-top-style: solid;
  -webkit-border-radius: 0.25rem 0.25rem 0 0;
  border-radius: 0.25rem 0.25rem 0 0;
  bottom: -0.125rem;
  content: "";
  height: 0;
  left: 0;
  position: absolute;
  right: 0;
  }
  .nav-link-cus i{
    padding-right: 6px;
    font-size: 17px;
  }
  .nav-link-cus svg{
    fill:rgb(127 127 127);
  }
  .nav-link-cus.active svg{
    fill: #174EA3 !important;

  }
#main-header{
  line-height: 23px;
font-weight: 500;
top: 0;
background-color: #fff;
width: 100%;
box-shadow: 0px 0px 7px 2px #a5969678;
border-bottom: 1px solid #80808038;
position: relative;
/* z-index: 99999; */
}
.box_sh{
  box-shadow: 0px 0px 7px 2px #a5969678;
  }

.top_menu{
  padding-top: 9px;

}
.top_menu li {
  display: inline-block;
      font-size: 14px;
      padding-right: 22px;}
.top_menu a {
  color: rgba(86,86,86,0.63)!important;
  font-size: 15px;
}
.top_menu a.active-item{
  color: #1e5260 !important ;

}
.space{display: inline-block !important;
    justify-content: space-between;}
.top_navigation{
  float: right;
vertical-align: middle;
}
.font-14{
    font-size:14px;
}

.myib{
  font-weight: lighter;
    font-size: 48px;
    margin-left: 10px;
    margin-top: 0;
    color: white;
    text-align: center;
}
.desc_myib{
  font-weight: lighter;
    font-size: 24px;
    margin-left: 10px;
    margin-top: 8px;
    color: #6b7584;
    text-align: center;
    margin: auto;
    padding: 33px;

}
.ib_logo_title{
  background-color: #c1e7f67d;
    position: relative;
    display: inline-block;
    width: 100%;
    height: 20%;
    padding-top: 18px;

}
.ib_login_div{
  /* margin-top: 2%; */
    /* margin-bottom: 2%; */
    background-color: #fbfaf9;
    padding: 39px;
height: 100vh;
    /* margin-left: 15%; */
}
.login_myib{

}
.headingDiv{
  text-align: left;
    letter-spacing: 0px;
    opacity: 1;
    font-size: 28px;
    font-weight: lighter;
    margin-top: 8px;
    color: #4A74BB;
}
.loginheadingDiv{font-size: 18px;
    margin-top: 8px;
    color: #4A74BB;
    letter-spacing: 0px;
    opacity: 1;
}
.paradiv{
  position: relative;
    text-align: left;
    letter-spacing: 0px;
    color: #454543;
    opacity: 1;
    font-size: 14px;
}
.loginButton{
  cursor: pointer;
    background-color: #E29435;
    border: none;
    color: white;
    padding: 10px 20px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    margin: 4px 2px;
    border-radius: 20px;
}
.logo_img{

}
.blue-border{
  border:1px solid #026bb0;
  border-radius: 5px;
  margin-top: 28px;

}
.green-border{
  border:1px solid #78b517;
  border-radius: 5px;
  margin-top: 28px;

}
.red-border{
    border:1px solid #e51d74;
    border-radius: 5px;
    margin-top: 28px;

}
.orange-border{
    border:1px solid #f5aa00;
    border-radius: 5px;
    margin-top: 28px;
}
.purple-border{
  border:1px solid #b62ebe;
  border-radius: 5px;
  margin-top: 28px;
}
.dark-blue-border{
  border:1px solid #2b5be4e0;
  border-radius: 5px;
  margin-top: 28px;
}
.dark-green-border{
  border:1px solid #6ced00;
  border-radius: 5px;
  margin-top: 28px;
}
.dark-red-border{
  border:1px solid #f9393991;
  border-radius: 5px;
  margin-top: 28px;
}
.yellow-border{
  border:1px solid #b0b60070;
  border-radius: 5px;
  margin-top: 28px;
}

.blue-border:hover{  box-shadow: 1px 1px 7px 1px #0000ff5e;}
.green-border:hover{box-shadow: 1px 1px 7px 1px #76e381;}
.red-border:hover{box-shadow: 1px 1px 7px 1px #e773b3;}
.orange-border:hover{box-shadow: 1px 1px 7px 1px #d39839;}
.purple-border:hover{box-shadow: 1px 1px 7px 1px #d58cd9;}
.dark-blue-border:hover{box-shadow: 1px 1px 7px 1px #4172ffb3;}
.dark-green-border:hover{box-shadow: 1px 1px 7px 1px #70f600db;}
.dark-red-border:hover{box-shadow: 1px 1px 7px 1px #e900008f;}
.yellow-border:hover{box-shadow: 1px 1px 7px 1px #ecf23fe6;}

.blue-bg{
  background-color: #e5f0f7;
  margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;
            text-align: center;
}
.green-bg{
  background-color: #d4e9d6;
  margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;

            text-align: center;

}
.red-bg{
  background-color: #fce8f3;
  margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;    text-align: center;

}
.orange-bg{
  background-color: #fef6e9;
  margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;    text-align: center;

}
.purple-bg{
  background-color: #c5aad263;
  margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;    text-align: center;
}
.dark-blue-bg{
  background-color: #2b5be457;
  margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;    text-align: center;
}
.dark-green-bg{
  background-color: #85f9244f;
  margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;    text-align: center;
}
.dark-red-bg {
    background-color: #f25e5e33;
    margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;    text-align: center;
}
.yellow-bg {
    background-color: #e3f6173b;
    margin-top: 8px;
    margin-bottom: 8px;
    border-radius: 5px;
    padding-top: 40px;
        padding-bottom: 40px;    text-align: center;
}
.subject a{
  color: #262628;
    font-size: 17px;
    font-weight: 400;
    text-decoration: none;
}
.sub_topics a{
  text-decoration: none;
}
.group-main-info {
    display: flex;
    justify-content: flex-start;
    z-index: 1;
    padding: 20px;
}
.group-main-info .group-info {
    max-width: 90%;
    position: relative;
    margin: 0 14px;
}
.library-group-title {
    vertical-align: top;
    font-size: 32px;
    font-weight: 500;
    color: black;
    margin-bottom: 4px;
    white-space: normal;
    word-break: keep-all;
}
.nav_cat{
  border-bottom: 1px solid #6699c7 !important;
}
.nav_cat button{
  color: #495057!important;

}
.nav_cat button.active{
  border-color: #3270a8 #6699c7 #fff!important;

}
.nav_cat button:hover,.nav_cat button:focus{
  border: 0!important;

}
.active_easy{
  color: #39cc87 !important;
  border-bottom: 2px solid #39cc87!important;
  font-weight: 500;

}
.active_medium{
  color: #ffa047 !important;
  border-bottom: 2px solid #ffa047!important;
  font-weight: 500;

}
.active_hard{
  color: #d83e4b !important;
  border-bottom: 2px solid #d83e4b!important;
  font-weight: 500;

}
.logo_img_div{    padding: 8px;
    border-bottom: 1px solid #80808040;
}
.desc_myib_div{
    padding: 39px;
    background-color: #1cc7d0!important;
    font-size: 20px;
    /*font-family: 'Poppins',Helvetica,Arial,Lucida,sans-serif;*/
    color: #fff;
}
.img_box{
  padding: 36px;

}
.unit_p{
  font-weight: 500;
    font-size: 22px;
}
.details_images{
  padding-top: 65px!important;
padding-right: 10px!important;
padding-bottom: 65px!important;
padding-left: 10px!important;
margin-left: auto!important;
margin-right: auto!important;
text-align: center;
background-color: #fbfaf9;
}
.unit_group .panel{
            background-color: #fff;
            border:none;
            box-shadow:none;
            border-radius: 10px;
            margin-bottom:11px;
        }
        .panel .panel-heading{
            padding: 0;
            border-radius:10px;
            border: none;
        }
        .panel-heading button{
            color:#fff !important;
            display: block;
            border:none;
            padding:20px 35px 20px;
            font-size: 20px;
            background-color:rgb(236, 87, 102);
            font-weight:600;
            position: relative;
            color:#fff;
            box-shadow:none;
            transition:all 0.1s ease 0;
        }
        .panel-heading button:after, .panel-heading button.collapsed:after{
            content: "\f068";
            font-family: fontawesome;
            text-align: center;
            position: absolute;
            left:-20px;
            top: 10px;
            color:#fff;
            background-color:rgb(236, 87, 102);
            border: 5px solid #fff;
            font-size: 15px;
            width: 40px;
            height:40px;
            line-height: 30px;
            border-radius: 50%;
            transition:all 0.3s ease 0s;
            background-image: none !important;
        }
        .panel-heading:hover button:after,
        .panel-heading:hover button.collapsed:after{
            transform:rotate(360deg);
        }
        .panel-heading button.collapsed:after{
            content: "\f067";
        }
        #accordion .panel-body{
            background-color:#Fff;
            color:#8C8C8C;
            line-height: 25px;
            padding: 10px 25px 20px 35px ;
            border-top:none;
            font-size:14px;
            position: relative;
        }
        .unit-button:focus {
    /* z-index: 3; */
    border: 0px !important;
    box-shadow: none !important;
}
.unit-button:not(.collapsed) {
    background-color: #ec5766 !important;
    box-shadow: none !important;
}
.lesson_div{
  border: 1px solid #ec576680;
padding: 14px;
background-color: #fff;
border-radius: 8px;
margin-bottom: 12px;

}
.lesson_div:hover{
  box-shadow: 0px 0px 6px 1px #b1a6a7eb;
      transform: translateX(0px) translateY(-3px);
      border: 1px solid #ec5766ba;
  }
}
.hover-underline-animation:after {
  content: '';
  position: absolute;
  width: 100%;
  transform: scaleX(0);
  height: 2px;
  bottom: 0;
  left: 0;
  background-color: #0087ca;
  transform-origin: bottom right;
  transition: transform 0.25s ease-out;

}

.hover-underline-animation:hover:after {
  transform: scaleX(1);
  transform-origin: bottom left;
}
  .lessons_body{
    background-color: #fbfaf9;
    text-align: start;
  }
.lessons_body a{
  text-decoration: none;
  color: black;
}
.video_div:hover{
  box-shadow: 0px 0px 6px 1px #b1a6a7eb;
      transform: translateX(0px) translateY(-3px);
      border: 1px solid #ec5766ba;
}
.video_div:hover .video_icon{
  font-size: 22px !important;
}
.video_div{
  border: 1px solid #ec576680;
      padding: 14px;
      background-color: #ec5766;
      border-radius: 8px;
      margin-bottom: 12px;
      color: white;
      font-weight: 500;
}
.video_div p{
  display: contents!important;

}
.video_icon{
  font-size: 19px !important;
vertical-align: middle !important;
margin-top: -2px;

}
.img_card{
  margin: auto !important;
  padding: 10px!important;

}
.img_card img{
  height: 164px!important;
  border: 1px solid #1613134f;
  border-radius: 5px;
  box-shadow: 0px 2px 9px 0px rgb(0 0 0 / 40%);
}
.download_pdf a{
  color: #004a8f!important;

}
.btn_book{
  position: absolute;
    bottom: 9px;
}
.book_body{
  position: relative;
}
.book_title{
  font-size: 18px !important;
  font-family: 'Poppins',Helvetica,Arial,Lucida,sans-serif !important;
}
.comment_type_title h3{
  letter-spacing: 1px;
    font-family: "Google Sans",Roboto,Arial,sans-serif;
    font-size: 18px;
    font-weight: 700;
    line-height: 1.25rem;
    color: #0463ab;
    padding: 11px;
}
.comment_type_child{
  padding: 11px;
  margin-bottom: 8px;
}
.comment_type_child h4{
  font-family: Roboto,Arial,sans-serif;
font-size: 17px;
font-weight: 500;
letter-spacing: .2px;
color: #202124;
}
.check_div{
  padding-top: 5px;
    padding-bottom: 5px;
    /* background-color: #8f8b8b0f; */
    border-radius: 3px;
    padding-left: 0px;
}
.check-inline{
  display: inline-block;
    margin-right: 2px;
}
.comment_body{
  /* padding-left: 110px;
    padding-right: 110px; */
    /* margin-top: 20px; */
padding-bottom: 50px;
padding-top: 14px
}
.check_label {display: block; padding: 8px; position: relative; padding-left: 17px;}
.check_label input {display: none;}
.check_label span {border: 1px solid #766f6f;
    width: 20px;
    height: 20px;
    position: absolute;
    overflow: hidden;
    line-height: 15px;
    text-align: center;
    border-radius: 100%;
    font-size: 10pt;
    left: 50%;
    top: 50%;
    margin-top: -7.5px;
  }
.check_label input:checked + span {
    background: #2c8ad17d;
    border: 2px solid #0463ab;
    box-shadow: 0px 0px 2px 2px #067dd7b8;
  }
  .comment_type {
    padding: 20px;

  }
  .textarea_label{
    padding: 10px;
    margin-bottom: 4px;
    font-size: 18px;
    font-weight: 500;
  }
  .generate_box{
    padding-left: 42px;

  }
  .show_eye{
    color: #23a123;
    border: 1px solid;
    padding: 5px;
    border-radius: 3px;
  }
    .noshow_eye{
      color: #bf0f0f;
          border: 1px solid;
          padding: 5px;
          border-radius: 3px;
    }
    .write_comment{
      color: #0f5ebf;
    border: 1px solid;
    padding: 5px;
    border-radius: 3px;
    }
    .tox-statusbar__branding{
      width: 0px !important;
    }
    .vertical-align{
      vertical-align: middle;
    }
@media only screen and (max-width: 600px) {


}