/* Header CSS */
.header {
  display: flex;
  flex-direction: row;
  flex-wrap: nowrap;
  justify-content: space-between;
}

.header-text {
  display: flex;
  flex-wrap: nowrap;
  justify-content: flex-end;
  font-weight: bold;
  align-items: flex-end;
  flex-direction: column;
  align-content: flex-end;
}

.header-text h4 {
  color: #002d69;
  margin-bottom: 0;
  /* font-weight: 700; */
}

.header-text h3 {
  color: #12acee
}

/* body css */
html {
  position: relative;
  /*IMPORTANT FOR THE ABSOLUTE FOOTER */
  min-height: 100%
}

body {
  margin-top: 20px !important;
}

.label {
  font-weight: 600 !important;
}

/* footer */
footer {
  height: 10%;
  background-color: #012d6b;
  color: #12acee;
  position: absolute;
  width: 100%;
  left: 0;
  bottom: 0;
  height: 100px;
}

/* ****************************
   Font Colors
  ****************************** */
  .dkblue {
    color: #012d6b;
  }
  
  .cyan {
    color: #00aeef;
  }
  
  .black {
    color: #000000;
  }
  
  .grey {
    color: #666;
  }
  
  .dkgreen {
    color: #9dc9ba;
  }
  
  
/* buttons */
.primary-btn {
  color: #fff;
  background-color: #030f46;
  border-color: #030f46;

}

/* button on hover keep text white */
.primary-btn:hover {
  color: #cee3f3 !important;
  /* make it feellike someone has hovered using shadows*/
  box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.25) !important;
  /* make it feel like a depression*/
  border-color: #012d6b !important;
  background-color: #002d69;

}

.btn:hover {
  /* make it feellike someone has hovered using shadows*/
  box-shadow: 0 0 0 0.2rem rgba(0, 0, 0, 0.25) !important;
  /* make it feel like a depression*/
  border-color: #012d6b !important;

}

/* // buttons */
.btn {
  border-radius: 5px;
  padding: 10px 30px;
  display: inline-block;
  margin: 0;
}

.btn-default {
  border: 1px solid #CEE3F3;
  background-color: #CEE3F3;
}

.btn-sm,
.btn-group-sm>.btn {
  border-radius: 5px;
  padding: 10px 10px;
  display: inline-block;
  margin: 0;
}

.btn-thin-sm {
  font-size: .9rem;
  border-radius: 5px;
  padding: 3px 10px;
  display: inline-block;
  margin: 0;
}

.btn-ltblue {
  border: 1px solid #dfe2e5;
  background-color: #f0f8ff;
  color: #012d6b;
}

.btn-silver {
  border: 1px solid #dfe2e5;
  background-color: #f4f4f4;
  color: #012d6b;
}

.btn-cyan {
  border: 1px solid #dfe2e5;
  background-color: #00aeef;
  color: #f0f8ff;
}

.btn-blue {
  border: 1px solid #dfe2e5;
  background-color: #f0f8ff;
  color: #012d6b;
}

.btn-red-fill {
  border: 1px solid #dfe2e5;
  background-color: #e49497;
  color: #f0f8ff;
}

.btn-red {
  border: 1px solid #e49497;
  background-color: #eeeded;
  color: #e47478;
}

.btn-green {
  border: 1px solid #dfe2e5;
  background-color: #9dc9ba;
  color: #f0f8ff;
}

/* .warning-btn{
    border: 1px solid #f7f3cf;
    background-color: #dcd087;
    color: #f0f8ff;
  
  } */
.btn-gray {
  color: #212529;
  background-color: #C2C6DB;
  border-color: #BABFD6;
}

.btn-gray:hover {
  color: #212529;
  background-color: #d0d4e4;
  border-color: #c7cce0
}

.warning-btn {
  color: #212529;
  background-color: #f68b1f;
  border-color: #f68b1f
}

.warning-btn:hover {
  color: #fff;
  background-color: #e67809;
  border-color: #d97109
}

.warning-btn.focus,
.warning-btn:focus {
  -webkit-box-shadow: 0 0 0 .2rem rgba(214, 124, 33, .5);
  box-shadow: 0 0 0 .2rem rgba(214, 124, 33, .5)
}


/* datatable button override */
.page-link:hover{
  z-index:2;
  color:white;
  background-color: #8dd3f1;
  border-color: #8dd3f1;
}
.page-link:focus{
  z-index:3;color:var(--bs-pagination-focus-color);
  background-color:var(--bs-pagination-focus-bg);
  outline:0;box-shadow:var(--bs-pagination-focus-box-shadow)
}
  .active>.page-link,
  .page-link.active{
    z-index:3;
    color:white;;
    background-color: #12acee;
    border-color: #12acee;
  }

/* .back-button {
  background-color: #fff;
  color: #6c757d;
  border-color: #6c757d;
} */

.hidden {
  display: none !important;
}

.twitter-typeahead {
  width: 100% !important;
}

.tt-menu {
  width: 100% !important;
  -webkit-box-shadow: 0 8px 6px -6px #999;
  box-shadow: 0 8px 6px -6px #999;
  border: #ced4da 1px solid;
  border-radius: 4px;
  margin-top: 1px;
  padding: 4px;
  background: white;
  padding: 8px;
}


.col-form-label {
  font-weight: 600;
}

.alert-info-jj
{
    background-color: #cee3f3;
}

.container:after {
	clear: both;
}

.nav-pills .nav-link.active, .nav-pills .show>.nav-link {
  color: #fff !important;
  background-color: #00aeef !important;
}

/* //navlink that is not active  */
.nav-link {
  color: #012d6b !important;
}


#overlay {
  /*display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  top: 0; 
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.5); /* Black with a bit of transparency */
  z-index: 2; /* Sit on top */
  cursor: progress; /* Add a progress cursor */
  color: #12acee !important;
}

#overlay .spinner-grow {
  position: absolute;
  top: 50%;
  left: 50%;
  /* transform: translate(-50%, -50%); */
  font-size: 3rem; /* Adjust size */
}