.left {
    width: 250px;
    height: 100%;
    overflow-x: hidden;
    overflow-y: auto;
    background: #354052;
    position: fixed;
    transition: all 0.5s;
    top: 50px;
  }
  .left:hover {
    width: 250px;
  }
  .left:hover ul li.menu-heading {
    opacity: 1;
  }
  .left ul {
    padding-left: 0;
  }
  .left ul li {
    list-style-type: none;
  }
  .left ul li.active a {
    background: #00b300;
    color: white;
  }
  .left ul li.active a:hover {
    background: #009a00;
  }
  .left ul li a {
    display: inline-block;
    text-align: left;
    background: #354052;
    color: white;
    padding: 15px 10px;
    font-size: 13px;
    width: 100%;
    border-bottom: 1px solid #2b3443;
  }
  .left ul li a:hover {
    background: #2b3443;
    text-decoration: none;
  }
  .left ul li a:hover i.fa {
    color: #00b300;
  }
  .left ul li a:focus {
    text-decoration: none;
  }
  .left ul li a i.fa {
    width: 30px;
    text-align: center;
    padding-right: 5px;
    transition: all 1s;
    
  }
  .left ul .menu-heading {
    opacity:6;
    padding: 10px 5px 10px 10px;
    color: #b3b300;
    font-size: smaller;
    border-bottom: 1px solid #2b3443;
    transition: all 0.5s;
  }
  .header {
      background: #fff;
      box-shadow: 0px 0px 10px #ccc;
      height: 50px;
      position: fixed;
      z-index: 9;
  }
  .dashbord-left-top-img {
      text-align: left;
      margin-top: 9px;
  }
  .navbar-header > .navbar-right {
    float: right;
  }
  .navbar-header > .navbar-right > .drop-down {
    list-style: none;
    float: right;
    margin-right: 15px;
  }
  .navbar-header > .navbar-right > .drop-down:hover > .media-group-f {
    transform: translateX(0px);
  }
  .navbar-header > .navbar-right > .drop-down > a {
    text-decoration: none;
    float: right;
    display: block;
    font-size: 15px;
    cursor: pointer;
    box-sizing: border-box;
    padding: 14px 5px;
  }
  .navbar-header > .navbar-right > .drop-down > a:hover {
    background-color: rgba(255, 255, 255, 0.07);
  }
  .navbar-header > .navbar-right > .drop-down > .media-group {
    top: 65px;
    right: 130px;
    display: none;
  }
  .navbar-header > .navbar-right > .drop-down > .drop-down-menu {
    position: absolute;
    min-width: 175px;
    list-style: none;
    font-size: 14px;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.175);
  
  }
  .drop-down-menu ul li a:hover{
    padding-left:10px!important;
    transition: 300ms;
    color:#22527b !important;
  }
  .navbar-header > .navbar-right > .drop-down > .drop-down-menu > .drop-down-item {
    text-decoration: none;
    color: #000;
    font-family: Raleway;
    position: relative;
    display: block;
    padding: 13px 17px;
    background-color: #fff;
    border-bottom: 1px solid #f5f7f9;
  }
  .navbar-header > .navbar-right > .drop-down > .drop-down-menu > .drop-down-item > .drop-down-item:last-child {
    border-bottom: none;
  }
  .navbar-header > .navbar-right > .drop-down > .drop-down-menu > .drop-down-item:hover {
    background: #f5f7f9;
  }
  .navbar-header > .navbar-right > .drop-down > .drop-down-menu > .drop-down-item > .media > .media-left > .avatar > img {
    width: 30px;
    height: 30px;
    float: left;
    border-radius: 50%;
    margin-right: 15px;
  }
  .navbar-header > .navbar-right > .drop-down > .media-group-p {
    top: 50px;
    right: 70px;
  }
  .navbar-header > .navbar-right .drop-down-menu-p {
    position: absolute;
    min-width: 240px;
    list-style: none;
    font-size: 14px;
    background-color: #fff;
    border-radius: 4px;
    box-shadow: 0 3px 12px rgba(0, 0, 0, 0.175);
    display: none;
    z-index: 555;
    right: 10px;
  }
  .navbar-header > .navbar-right .drop-down-menu-p .drop-down-item {
    text-decoration: none;
    color: #000;
    font-family: Raleway;
    position: relative;
    display: block;
    padding: 10px 16px;
    background-color: #fff;
    border-bottom: 1px solid #f5f7f9;
  }
  .navbar-header > .navbar-right .drop-down-menu-p .drop-down-item > i {
    padding-right: 15px;
  }
  .navbar-header > .navbar-right .drop-down-menu-p .drop-down-item > .drop-down-item:last-child {
    border-bottom: none;
  }
  .navbar-header > .navbar-right .drop-down-menu-p .drop-down-item:hover {
    background: #f5f7f9;
  }
  .navbar-header > .navbar-right > .drop-down > .media-group-f {
    top: 50px;
    z-index: 5;
    transform: translateX(0px);
    transition: all 1s ease-in-out;
    right: 30px;
  }
  .dashbord-left-top-img img {
      margin: 0 auto;
  }
  .animate-friends{
    display: none;
  }
  li#friends a img {
      width: 30px;
      border-radius: 50%;
      margin: 0;
  }
  li#profile a{
    color:#000;
  }
  li#friends a{
    padding:10px 5px;
  
  }
  .drop-down-menu ul li a {
      color: #333 !important;
      transition: 300ms;
      text-decoration: none;
  }
  .drop-down-menu ul li {
      list-style: none;
      padding: 5px;
      text-align: left;
      transition: 300ms;
  }
  .drop-down-menu ul {
      padding: 10px 0;
  }
  .drop-down-menu ul li a i {
      margin-right: 8px;
  }
  ul.drop-down-menu-p.media-group-p.animate-profile {
      padding: 0;
  }
  .animate-profile a.drop-down-item img {
      width: 30px;
      border-radius: 50%;
      margin-right: 10px;
  }
  .top-bar {
      float: right;
      padding-right: 40%;
      margin-top: 5px;
  }
  .top-bar i{
    cursor: pointer;
  }
  .right {
      max-width: 100%;
      display: block;
      height: 100vh;
      background: #ebf2f6 !important;
      margin-left: 250px;
      position: relative;
      top: 50px;
       padding: 0 20px 10px 20px;
  }
  .right.right-show {
      max-width: 100%;
      margin-left: 0;
  }
  .left.left-hidden {
      display: none;
  }
  ul.member-drop-down li a {
      padding: 10px 45px !important;
  
  
  }
  ul.member-drop-down{
    display: none;
  
  }
  span.fa.fa-angle-down.drop-down-icon {
      float: right;
      width: auto;
      text-align: right !important;
      padding-right: 0 !important;
  }
  ul.member-drop-down li a i {
      width: 0 !important;
      padding-right: 15px !important;
  }
  .card {
    margin-bottom: 25px;
      position: relative;
      display: flex;
      -webkit-box-orient: vertical;
      -webkit-box-direction: normal;
      flex-direction: column;
      min-width: 0;
      background-color: #fff;
      background-clip: border-box;
      border: 1px solid rgba(0, 0, 0, 0.125);
      border-radius: 0.25rem;
  }
  .card-body {
      -webkit-box-flex: 1;
      flex: 1 1 auto;
      padding: 1.25rem;
  }
  .bg_color1 {
      background-color: #4b9ce4;
  }
  .top_border1 {
      width: 60px;
      height: 60px;
      border-radius: 50%;
      line-height: 4.1;
      font-size: 15px;
      color: #fff;
      -webkit-box-shadow: 1px 1px 20px rgb(75 156 228 / 88%);
      box-shadow: 1px 1px 20px rgb(75 156 228 / 88%);
  }
  .circle_round {
      font-size: 20px;
  }
  .user_font {
      font-size: 13px;
      color: #646567;
      margin-bottom: 0!important;
  }
  .number_size {
      font-size: 20px;
      color: #646567;
      margin-bottom: 0 !important;
  }
  .member-list-box{
      margin-top: 20px;
  }
  .member-list-box .card-body:hover{
      box-shadow: 1px 1px 38px -8px #8e8c8e;
  }
  .row.dashboard-row-section .member-list-box.col.text-center {
    margin-top: 0;
}
  .card-table-header p {
    text-align: left;
    padding: 20px;
    font-size: 20px;
    padding-bottom: 0;
}
.bg-success-card .table-responsive .table td {
    font-size: 13px;
    text-align: left;
    padding: 7px 15px;
}

.bg-success-card .table-responsive .table th {
    font-size: 14px;
    text-align: left;
}
.text-info {
    color: #4fc1e9 !important;
    margin-right: 10px;
}
.text-danger {
    color: #fd7570 !important;
}
table.dataTable.no-footer {
    border-bottom: 1px solid #ddd;
}
table.dataTable thead th, table.dataTable thead td {
    border-bottom: 1px solid #ddd;
}
.download-btn {
  float: right;
}
.contact-dashboard .form {
  width: 50%;
  margin: 0 auto;
  background: #fff;
  padding: 20px;
  margin-top: 0px;
  display: inline-block;
  box-shadow: 2px 2px 15px 0px #ccc;
}
.form-heading {
  margin-top: 20px;
  display: inline-block;
  width: 100%;
}
.form.dashboard-crate-form .form-group label {
  text-align: left !important;
  display: block;
  font-size: 14px;
}
#demo div {
  width: 50%;
  display: table-cell;
  text-align: left;
}
#demo label {
  display: inline-block;
  margin: 5px;
}
#demo input {
  float: left;
  margin-top: 8px;
  margin-left: 5px;
}
.views-icon {
  margin-left: 10px;
}
button.btn.btn-success.invoice-btn {
  margin-left: 15px;
  font-size: 12px;
    padding: 5px 10px;
}
.profile-form-section {
  width: 500px;
  margin-top: 20px;
  display: inline-block;
  background: #fff;
  padding: 20px;
  
}
.profile-form-section .profile-photos img {
  width: 65px;
  border-radius: 50%;
  margin-bottom: 30px;
}
.profile-form-section .form-group label {
  text-align: left !important;
  display: block;
  font-size: 14px;
}
.form-group.profile-btn {
  text-align: right;
}
.profile-photos.update-password h5 {
  margin-bottom: 38px;
}
.profile-photos h5 {
  margin-bottom: 20px;
}
.form-group.btn-right-part {
  text-align: right;
}