.mb-4 {
   margin-bottom: 1.5rem!important;
}
 .mt-5, .my-5 {
   margin-top: 3rem;
}
 .panel-heading {
   padding-bottom:0 !important;
}
 .panel-title a {
   color: #172e81 !important;
   font-size:1.5em !important;
   text-decoration: none;
   background-color: transparent;
}
 .rounded-dir {
   border-radius: .25rem!important;
}
 p.fine-print.bottom-text {
   font-size: 0.8em;
   margin: 3% 0 5% 0;
}
 ul.dropdown-menu.ng-isolate-scope {
   width: 94.5%;
}
 li.uib-typeahead-match a {
   display: block;
   padding: 3px 10px;
}
 li.uib-typeahead-match a:hover {
   color: #fff;
   text-decoration: none;
   background-color: #007bff;
}
 h1.border-bottom {
   line-height: 2;
   border-bottom: 1px solid #dee2e6!important;
       margin-bottom: 2%;
}

.sidebar{
  background-color: #f3f3f3;
}

.sidebarWrap{
  padding: 9% 6%;
}


 .sidebar row {
   margin-left:0;
   margin-right:0;
}
 .sidebar h3, .sidebar .h3 {
   width: 100%;
}

.imgDirectory{
  width: 100%;
  border: 10px solid #ffffff;
}

.leftBar{
  padding: 0 10% 0 0;
}


@media (max-width: 768px){ 
  .imgDirectory{
    max-width: 250px !important;
  }

  .leftBar{
  padding: 0;
}


}


 .expertise {
   padding: .75rem 1.25rem;
   background-color: rgba(0,0,0,.03);
}
 @media only screen and (min-width: 991px) {
   .directory-main {
     margin-top:180px;
    /* accounting for sticky header */
     margin-bottom:20px;
  }
}
 .panel {
   margin-bottom: 0 !important;
   height: 100%;
}
 .panel-body {
   flex: 1 1 auto;
}
 @media only screen and (min-width: 767px) {
   .panel {
     display: flex;
     flex-direction: column;
     word-wrap: break-word;
  }
  /* .panel-body {
    */
    /* height:100%;
    */
    /*
  }
  */
   .row.profiles {
     display: flex;
     flex-wrap: wrap;
  }
   .row.profiles > [class*='col-'] > {
     display: flex;
     flex-direction: column;
  }
  /* * And with max cross-browser enabled. * Nobody should ever write this by hand. * Use a preprocesser with autoprefixing. */
   .row.profiles {
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-flex-wrap: wrap;
     -ms-flex-wrap: wrap;
     flex-wrap: wrap;
  }
   .row.profiles > [class*='col-'] {
     display: -webkit-box;
     display: -webkit-flex;
     display: -ms-flexbox;
     display: flex;
     -webkit-box-orient: vertical;
     -webkit-box-direction: normal;
     -webkit-flex-direction: column;
     -ms-flex-direction: column;
     flex-direction: column;
  }
   .col-12.col-md-8 {
     order:1 
  }
   .col-12.col-md-4 {
     order:2 
  }
}
 .pagination > .selected > a {
   font-weight: bold;
}
.directory-main input.form-control {
    color:#555 !important;
}

p.degree{
    margin-bottom:2px;
}
 

 @media (max-width: 576px){ 
   h1.border-bottom {
    line-height: 1;
    padding-bottom: 5%;
    border-bottom: none;
    margin-bottom: 5%;
}
 
   
 }