.notif_badge {

  padding: 5px 10px;
  border-radius: 70%;
  background: red;
  color: white;
}

.dashDrop{
  color:white;
}

@import "https://fonts.googleapis.com/css?family=Poppins:300,400,500,600,700";
body {
    font-family: 'Poppins', sans-serif;
    background: #fafafa;
}

p {
    font-family: 'Poppins', sans-serif;
    font-size: 1.1em;
    font-weight: 300;
    line-height: 1.7em;
    color: #999;
}

a,
a:hover,
a:focus {
    color: inherit;
    text-decoration: none;
    transition: all 0.3s;
}

.navbar {
    padding: 15px 10px;
    background: #fff;
    background-color: #158e8f;
    border: none;
    border-radius: 0;
    margin-bottom: 20px;
    box-shadow: 1px 1px 3px rgba(0, 0, 0, 0.1);
}



.navbar-btn {
    box-shadow: none;
    outline: none !important;
    border: none;
}



.line {
    width: 100%;
    height: 1px;
    border-bottom: 1px dashed #ddd;
    margin: 40px 0;
}

/* ---------------------------------------------------
    SIDEBAR STYLE
----------------------------------------------------- */

#sidebar {
    width: 250px;
    position: fixed;
    top: 0;
    left: -250px;
    height: 100vh;
    z-index: 999;
    background: #158e8f;
    color: #fff;
    transition: all 0.3s;
    /* overflow-y: scroll; */
    box-shadow: 3px 3px 3px rgba(0, 0, 0, 0.2);
}

#sidebar.active {
    left: 0;
}

#dismiss {
    width: 35px;
    height: 35px;
    line-height: 35px;
    text-align: center;
    background: #158e8f;
    position: absolute;
    top: 10px;
    right: 10px;
    cursor: pointer;
    -webkit-transition: all 0.3s;
    -o-transition: all 0.3s;
    transition: all 0.3s;
}

#dismiss:hover {
    background: #fff;
    color: #158e8f;
}

.overlay {
    display: none;
    position: fixed;
    width: 100vw;
    height: 100vh;
    background: rgba(0, 0, 0, 0.7);
    z-index: 998;
    opacity: 0;
    transition: all 0.5s ease-in-out;
}
.overlay.active {
    display: block;
    opacity: 1;
}

#sidebar .sidebar-header {
  padding-top: 50px;
    padding: 20px;
    background: #158e8f;
}

#sidebar ul.components {
    padding: 20px 0;
    border-bottom: 1px solid #158e8f;
}

#sidebar ul p {
    color: #fff;
    padding: 10px;
}

#sidebar ul li a {
    padding: 10px;
    font-size: 1.1em;
    display: block;
}

#sidebar ul li a:hover {
    color: #158e8f;
    background: #fff;
}



a[data-toggle="collapse"] {
    position: relative;
}

.dropdown-toggle::after {
    display: block;
    position: absolute;
    top: 50%;
    right: 20px;
    transform: translateY(-50%);
}

ul ul a {
    font-size: 0.9em !important;
    padding-left: 30px !important;
    background: grey;
}

ul.CTAs {
    padding: 20px;
}

ul.CTAs a {
    text-align: center;
    font-size: 0.9em !important;
    display: block;
    border-radius: 5px;
    margin-bottom: 5px;
}



a.article,
a.article:hover {
    background: grey !important;
    color: #fff !important;
}

/* ---------------------------------------------------
    CONTENT STYLE
----------------------------------------------------- */

#content {
    width: 100%;
    padding: 20px;
    min-height: 100vh;
    transition: all 0.3s;
    position: absolute;
    top: 0;
    right: 0;
}



.home-button{
  margin-top: 5px;
}

.user-jumbotron{

  background-color: #158e8f;
  padding-bottom: 50px;
  margin-bottom: 5px;
}



.user-jumbotron .support-lead{
  color:white;

  font-size: 20px;
}




.the_user-jumbotron {
  background-color: #11A69A;
  padding-bottom: 50px;
  margin-bottom: 20px;
}

.jumbo-icon{
  display: flex;
  justify-content: center;

  margin-left: auto;
  margin-right: auto;
  color:white;

}

.admin-icon{
  display: flex;
  justify-content: center;
  margin-top: 15px;
  margin-left: auto;
  margin-right: auto;
  color: #11A69A;

}

.admin-card-title{
  display: flex;
  justify-content: center;
  font-weight: 600;
  font-size : 2rem;
  color:white;
}

.admin-body{
  background-color: #11A69A;

}

.display-4 ,.display-5 ,.display-3{
  display: flex;
  justify-content: center;
  text-align: center;


  color:white;
}



.student-section {
  margin-top:10px;
}




.section-title{
  margin-top: 10px;

  text-transform: uppercase;
  font-family: "Montserrat","Helvetica Neue",Helvetica,Arial,sans-serif;
  color :white ;
}




.user-card-title{
  display: flex;
  justify-content: flex-start;
  color:black;
  font-weight: 800;
}

.user-card-text{
  color:black;
}

.user-card .card-body {
  background-color: #F2E3D5;
}
.user-profile-card .card-body {
  background-color: #F2E3D5;
}




.card-body table  {
  border-collapse: separate;
  border-spacing:0 .01px;
  margin-left: -20px;
}

.card-deck {
  display: flex;
  justify-content: center;
}





.pagination {
  display: flex;
  justify-content: flex-end;
  color:blue;
  font-size:20px;
}

.card {
  box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);

}


.page-footer {
  /* position: absolute; */
  margin-top: 200px;
  bottom:0;
  width: 100%;
}

.suspended-button {
  display: flex;
  justify-content: flex-end;
}



.tooltip {
  font-family: "Helvetica Neue", Helvetica, Arial, sans-serif;
  font-size: 20px;

}  
/* ---------------------------------------------------
sidebar content
----------------------------------------------------- */


.sidenav-profile-pic{
    display: flex;
    justify-content: center;
    padding-top: 50px;

}


.new-pic-button{
  display: flex;
  text-align: center;
   margin-left: auto;
  margin-right: auto;
}





.view-btn{
  display: flex;
  justify-content: center;
}





.search-icon {
  color : #158e8f;
  display: flex;
  justify-content: center;
}


.profile-button{
  display: flex;
  justify-content: center;
  font-size: 15px;
}




/* booking */
.book-button {
  display: flex;
  justify-content: center;
}


.book-info{
  margin-top:30px;
}

.booking-p {
  display: flex;
  justify-content: center;
  color:white;
}


.bank-info {
  color : blue;
  font-size: 20px;
  font-weight: 600;
}


.important-notes{
  color :red;
}

/* INBOX */

.post-form {
  margin-top : 50px;
  margin-bottom : 50px;
}


.inbox-border {
  border-style: solid;
  color : grey;
  padding:20px;
}

.document-name {
  float:right;
  margin-right: 50px;
  margin-top: 20px;
}

.unread {
  color : red;
}

.document-created {
  display: flex;
  justify-content: flex-end;
  margin-top: 10px;
  margin-right: 110px;

}


.message-footer-the_user {
  background-color: #FFF5E6;
}

#id_message{
  width:75%;
}




.the_user_message {
  margin-right: 10px;

}

.user_message {
margin-left: 10px;

}


/* BIG-SCREENS */

@media screen and (min-width:1000px){

  .user-profile-card {
    max-width: 25rem;
    max-height: 60rem;
    height:60rem;
    margin: auto;
    
  }



  .user-card{
    max-width: 23rem;
    margin: auto;
    width : 23rem;
  }

  .user-card-text{
    font-weight: 600;
    font-size : 13px;

  }
  .card-body table tr td{
    font-weight: 400;
    font-size : 15px;
  }

  .profile-pic{
    width:200px;
    height:200px;
  }



  .card-row {
    height : 200px;
  }


  .body-icon{
    margin-top :20px;
     text-align: center;

  }

  .inst_sec_buttons {
  display: flex;
  justify-content: center;
  margin-top: 20px;
  margin-left: 50px;
  }

  .inst-action-link{
    margin-right : 10px;
    margin-bottom: 10px;
    width:200px;
  }


  .new-course-button{
    float:right;
    margin-right: -10px;


  }

.pagination-link {
  margin-right: 20px;
}


/* publish course form  */
.half-form {
    width : 50%;
}


}

/* SMALL-SCREENS */
@media screen and (max-width: 1000px){
  .display-4{
        font-size: 3rem;
    }



  .profile-pic{
    width:150px;
    height:150px;
  }

  .user-card-text{
    font-weight: 600;
    font-size : 12px;

  }

  .card-body table tr td{

    font-weight: 600;
    font-size : 12px;
  }

  .card-body table tr th{
    display: flex;
    justify-content: flex-start;
  }



  .user-card{
    margin: auto;
    width : 17rem;
    margin-bottom: 30px;
  }

  .user-profile-card{
    margin: auto;
    width : 19rem;
   

    margin-bottom: 30px;
  }

  .home-button{
    margin-top: 10px;
  }

  .sidenav-profile-pic{
      display: flex;
      justify-content: center;
      padding-top: 10px;

  }

  #sidebar ul.components {
      padding: 5px 0;
      border-bottom: 1px solid #158e8f;
  }

  #sidebar ul li a {
      padding: 10px;
      font-size: 18px;
      display: block;
  }

  .inst-action-link{
    width :100%;
    margin-bottom : 5px;
  }

  .new-course-button{
  display: flex;
  justify-content: center;

  }

}



.instructor-card {
  margin-top: 30px;
  max-width: 100%;
  max-height: 50%;

}




/* the_user */

/* the_user_view_contact */
.user_id {
  width:75%;
}

.search-row{
  margin-bottom: 20px;
}


.an-img {

  margin-right : 20px;
}


/* the_user_jobs */


.edit-button {
  display: flex;
  justify-content: center;
}



.whatsapp-button{
	position:fixed;
	width:60px;
	height:60px;
	bottom:40px;
	right:40px;
	background-color:#25d366;
	color:#FFF;
	border-radius:50px;
	text-align:center;
  font-size:30px;
	box-shadow: 2px 2px 3px #999;
  z-index:100;
}

.whatsapp-icon{
	margin-top:16px;
}