.navbar-custom {
    background-image: url('/img/header-img.jpg');
    background-size: cover;
  }

.navbar-custom,
.footer-custom {
  background-color: #5854A4;
  color: white;
}

.footer-custom {
  height: 40px; 
}

html,
body {
  height: 100%;
  margin: 0;
}

.wrapper {
  display: flex;
  flex-direction: column;
  min-height: 100vh;
}

.content {
  flex: 1;
}
.nav-link {
  color: white ;
}

.table-striped>tbody>tr:nth-child(odd)>td, 
.table-striped>tbody>tr:nth-child(odd)>th {
   background-color: #aaa; 
   opacity: 0.8;
 }

 .table-striped>tbody>tr:nth-child(even)>td, 
.table-striped>tbody>tr:nth-child(even)>th {
   background-color: #ccc; 
   opacity: 0.8;
 }
 .table-hover tbody tr:hover td, .table-hover tbody tr:hover th {
    background-color: #5854A4;
    opacity: 0.8;
  }

  .xpagination {
    display: inline-block;
  
  }
  
  .xpagination a {
    color: black;
    float: center;
    border: 1px solid #ddd;
    padding: 8px 16px;
    
    text-decoration: none;
  }
  
  .pagination a.active {
    background-color: #5854A4;
   
  }
  

.custom-btn {
  background-color: #5854A4;
  color: #fff;
}

.pageBack {
  background-color: #1E2228

}

.pageForward  {
  background-color: #1E2228

}

.input-group>input.pageNumber {
  flex: 0 1 90px;
}

/* these styles are used by the project detail page */
.scrollable-box {
  border: 1px solid #000;
  height: 300px; /* Adjust this needed */
  overflow-y: auto;
}
.box-heading {
  background-color: #5854A4;;
  color: white;
  padding: 5px;
  margin-bottom: 10px;
  text-align: center;
}
.small-box {
  height: 40px;
  border: 1px solid #000;
  margin-bottom: 5px;
  display: flex;
  align-items: center;
  justify-content: center;
}

.statusText {
  
  margin: 1px auto 1px auto; 
  padding:2px;font-size:15px;color:#ffffff;
}

.projectHeadBox {
  padding-left: 20px ;

}

.topBoxesText {
  padding-left: 5px ;

}

.icon-green {
  color: green;
  font-size: 200%;

}