html,body{
  height:100% !important;
  font-size: 16px;
}

.btn-group>.btn-group:not(:last-child)>.btn, .btn-group>.btn:not(:last-child):not(.dropdown-toggle) {
  border-radius: .2rem !important;
}

table .far,table .fas,table .fal{line-height:1.5rem !important}

.font-large{font-size:150%}
.font-double{font-size:200%}
.font-triple{font-size:300%}
.font-quadruple{font-size:200%}

/* extend */

.table-responsive{
  width:100%;
  word-spacing:nowrap;
}


.pointy{cursor:pointer}

.row-dividers .row{
  border-top:1px solid;
  padding-top:.75rem;
}
  .row-dividers .row:first-of-type{
    border-top:none;
    padding-top:0;
  }
  
.spinning{
  animation-duration: .5s;
  animation-name: spin;
  animation-iteration-count: infinite;
  animation-timing-function:linear;
}
  
  @keyframes spin {
    from{transform:rotate(0deg);}
    to{transform:rotate(360deg);}
  }
  
#connections,#favorites{
  padding:0 1rem;
}
  
  .student-overview-tab{
    margin:0 !important;
    padding:0 !important;
    width:calc(100% / 3);
    border:none;
  }
  .student-overview-tab a{
    margin:0 !important;
    padding:0 !important;
    border:none !important;
    text-align:center;
    line-height:3rem;
    background:#fff !important;
  }
  .student-overview-tab a.active{
    color:#000 !important;
    font-weight:bold;
  }
  
/* CORE */

.hidden{display:none !important}

/* login pages */

#login {
    position: absolute;
    width: 100%;
    height: 100%;
}
#login #alertbox{
    position:absolute;
    width:calc(100% - 20px);
    margin:10px;
}
#content{
  width: 100%;
  height: 100%;
}

.form-login {
  position: relative;
  top: 50%;
  width: 400px;
  margin: 0 auto !important;
  margin-top: -170px !important;
  border: none !important;
}


/*default pages */

.disabled{display:none}

a{text-decoration:none !important}
  
.heading .btn .fas,
.heading .btn .far,
.heading .btn .fal{
  margin-right:10px;
}

.fadeOut{
  animation-name: fadeOut;
  animation-duration: .5s;
  animation-fill-mode: forwards;
}
.fadeIn{
  animation-name: fadeIn;
  animation-duration: .5s;
  animation-fill-mode: forwards;
}

  @keyframes fadeOut{
    from{opacity:1}
    to{opacity:0}
  }
  @keyframes fadeIn{
    from{opacity:0}
    to{opacity:1}
  }

#topnav{
  position:fixed;
  z-index:1040;
  width:100%;
  height:80px;
  box-shadow:0 0 15px rgba(0,0,0,.1);
  animation-name: topnavIn;
  animation-duration: .8s;
}
  
  @keyframes topnavIn {
  from {top:-300px;}
  to {top:0;}
  }

  .navbar-text i{
    padding:14px 10px 10px;
    margin:0;
    font-size:150%;
  }
  
  .navicons{
    padding:0;
  }
  
    .navicons i{cursor:pointer}
  
  .img-profile{
    cursor:pointer;
    margin:0 10px 0 30px;
    height:52px;
    width:52px;
    float:right;
    box-shadow: 0 0 10px rgba(0,0,0,.3);
    border:2px solid;
  }
  
  .logo{
    width:90px;
    height:auto;
  }

#sidebar{
  position:fixed;
  z-index:1003;
  height:100%;
  top:0;
  padding-top:80px;
  width:120px;
  box-shadow:0 0 15px rgba(0,0,0,.3);
  animation-name: sbSlideIn;
  animation-duration: .4s;
  overflow-y:auto;
  overflow: -moz-scrollbars-none;
  -ms-overflow-style: none;
}
#sidebar::-webkit-scrollbar{ width: 0 !important }

  #sidebar.inactive{
    left:-120px;
    animation-name: sbSlideOut;
    animation-duration: .5s;
  }

  @keyframes sbSlideIn {
  from {left:-120px;padding-top:0;}
  to {left:0;padding-top:80px;}
  }
  
  @keyframes sbSlideOut {
  from {left:0;padding-top:80px;}
  to {left:-120px;padding-top:0;}
  }

  .taskbutton{
    cursor: pointer;
    width: 100%;
    display: flex;
    height: 120px;
    max-height: 20%;
    overflow: hidden;
    text-align: center;
    align-items: center;
    flex-direction: column;
    justify-content: center;
  }
  
    .taskbutton i{
      padding:5px 0;
      font-size:300%;
      text-shadow:0 0 5px rgba(0,0,0,.5);
      overflow-y: hidden;
    }
    
#sidenav{
  position:fixed;
  z-index:1002; 
  top:80px;
  left:-300px;
  width:300px;
  height:calc(100% - 80px);
  padding:0 20px;
  box-shadow:0 0 15px rgba(0,0,0,.1);
  animation-name: slideIn;
  animation-duration: .8s;
}
  #sidenav.inactive{
    left:-300px;
    animation-name: navSlideOut;
    animation-duration: .5s;
  }
  
  #sidenav.active{
    left:120px;
    animation-name: navSlideIn;
    animation-duration: .5s;
    overflow: auto;
  }
  
  #sidenav ul{display:none;line-height:1;}

  @keyframes navSlideIn {
  from {left:-300px;}
  to {left:120px;}
  }
  
  @keyframes navSlideOut {
  from {left:120px;}
  to {left:-300px;}
  }
  
  #sidenav h3{
    font-size:120%;
    margin-top:30px;
  }
  
  #sidenav ul li{
    padding:0;
  }  
  
  #sidenav ul li a{
    display:block;
    padding:10px 15px;
    color:#333;
    text-decoration:none;
  }
  
  #sidenav ul li i{
    padding-right:15px;
  }
  
#alertbox{

}
  
  #alertbox .alert{
    margin:0;
    border-radius:0;
  }
  
#main{
  position:absolute;
  top:5rem;
  padding:0 0 0 120px;
  width:100%;
  height:100%;
  animation-name: mainIn;
  animation-duration: .5s;
}

  #main.expand{
    padding-left: 0;
    animation-name: mainExpand;
    animation-duration: .5s;
  }
  
  .content{padding:20px;padding-top:69px;}
  
  .content .card-deck{margin:1rem 0 2rem;width:100%;}
  
  .card-header{
    padding: .5rem .75rem;
  }
    .card-header h5{
      padding-left:0 !important;
      margin:0;
      font-size:125%;
    }
  
  @keyframes mainIn {
  from {padding-left:0;}
  to {padding-left:120px;}
  }
  @keyframes mainExpand {
  from {padding-left:120px;}
  to {padding-left:0;}
  }
  
  #main h5{padding-left:15px;}
  
  .area table{margin-bottom:0;}
  
  table .filter-by{cursor:pointer}
  
  table .fas,table .far,table .fal{font-size:20px !important;margin:0 !important; }
  table .th_box{width:40px;padding-left:10px;}
  table .th_enabled,table .th_active{width:30px;padding-right:0;padding-left:0;}
  
  .table-heading{
    padding:10px;
    background:#eee;
    font-size:120%;
    margin:0;
  }
  
  .main-edit .form-group{
    margin-bottom:.5rem !important;
  }
  
  .heading{
    position:fixed;
    display:block;
    z-index:1001;
    width:100%;
    right:0;
  }
  
    .heading h1{
      font-weight:normal;
      font-size:150%;
      padding:20px 20px 20px 140px;
      margin-bottom:0;
      box-shadow:0 0 20px rgba(0,0,0,.15);
      animation-name: headingIn;
      animation-duration: .5s;
    }
    
        .expand .heading h1{
          padding-left:20px;
          animation-name: headingExpand;
          animation-duration: .5s;
        }
        
    @keyframes headingIn {
    from {padding-left:20px;}
    to {padding-left:140px;}
    }
    @keyframes headingExpand {
    from {padding-left:140px;}
    to {padding-left:20px;}
    }
  
  .search{
    border-radius:10px;
    border:1px solid #eee;
    overflow:hidden;
    box-shadow:0 0 20px rgba(0,0,0,.1);
  }
    .search label,.search button{
      margin:0;
      padding:0;
      border:0;
    }
  
  .search .fas{
    width:45px;
    height:38px;
    line-height:38px;
    padding:0 15px;
    margin:0;
    border-left:none;
    border:none;
    outline: none !important;
  }

  .searchbox{
    height:38px;
    line-height:38px;
    padding:0 15px;
    width:calc(100% - 99px);
    display:inline-block;
    border:none;
    outline: none;
  }
  
  .heading .btns{
    position:absolute;
    right:20px;
    top:20px;
  }
  
  .heading .btns .dropdown{
    display:inline-block;
  }
  
  .heading .btns .btn-group{
    margin-right:20px;
  }
  
  .area{
    border-radius:15px;
    padding:15px;
    margin:0 0 20px 0;
  }
  
    .area.tab-content{
      border-top:none !important;
      border-top-left-radius:0;
    }
    
    .area .giant{
      font-weight:bold;
      font-size:400%;
      padding:0;
      margin:0;
    }
    
  .nav-tabs{border:none}
  
  .nav-tabs .nav-link{border:none;}
  .nav-tabs .nav-link:hover{border-color: #eee #eee #fff;color:#777;background:#eee;}
  .nav-tabs .nav-link.active{border:1px solid;border-color: #eee #eee #fff;}
    
  .btn-advanced{
    float:right;
    box-shadow:0 0 20px rgba(0,0,0,.1);
    border-radius:10px !important;
    border:none  !important;
    display:inline-block;
    height: 38px;
    line-height: 38px !important;
    font-size: 100% !important;
    margin:0 15px 0 0 !important;
    padding:0 15px; 
  }
  
  .paging{
    float:right;
    box-shadow:0 0 20px rgba(0,0,0,.1);
    border-radius:10px !important;
    border:none  !important;
    display:inline-block;
    overflow:hidden;
    list-style:none;
    list-style-type:none;
    margin:0 0 20px;
    padding:0;
  }
  
  .paging li{
    float:left;
    margin:0;
    padding:0;
    border-left:1px solid #eee;
    border-right:1px solid #eee;
    list-style:none;
    list-style-type:none;
  }
  
  .paging li .page-link{
    display:block;
    margin:0;
    padding:0 1rem;
    height:2.3rem;
    line-height:2.3rem !important;
    font-size:100% !important;
    border:none !important;
  }
  
  .paging .page-link.fas{
    padding-left:15px;
    padding-right:15px;
  }
  
   .paging-end{float:right !important}
  
.help-admin-profile-full .dropdown-menu,
.help-admin-profile-mobile .dropdown-menu{
  min-width:15rem;
}
#resume > .row:first-of-type{display:none}
