*,
*:before,
*:after {
  box-sizing: border-box;
}
html {
  scroll-behavior: smooth;
}
body {
  font-style: normal;
  font-weight: 400;
  /* color: rgb(102, 102, 102); */
  color: #404f59;
  background-color: #f3f3f3;
  font-family: "Roboto", sans-serif;
  display: flex;
      flex-direction: column;
      min-height: 100vh;
}
.content {
  flex: 1;
}

:focus{
  box-shadow: 0 0 0 2px #fff; /* White and black double border */
}


input:focus {
  border-color: #fdb31c;
}

a {
  color: #13428a;
  scroll-behavior: smooth;
}

a:hover{
  color: rgb(35, 83, 107);
  text-decoration: underline;
}

.nav-link:hover,
.nav-link:active, a.dropdown-item:hover, a.dropdown-item:active {
  color: #fdb31c;
  text-decoration: underline;
}

h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6,
h1 a,
h2 a,
h3 a,
h4 a,
h5 a,
h6 a,
.h1 a,
.h2 a,
.h3 a,
.h4 a,
.h5 a,
.h6 a,
blockquote {
  color: rgb(102, 102, 102);
}
h1,
h2,
h3,
h4,
h5,
h6,
.h1,
.h2,
.h3,
.h4,
.h5,
.h6 {
  font-style: normal;
  font-weight: 700;
  margin: 1.25em 0 0.2em;
  text-rendering: optimizelegibility;
}
h1 {
  font-size: 5em;
  line-height: 1.4;
  text-align: center;
}



h2 {
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 100;
  font-size: 1.7em;
}

h3{
  font-family: Arial, Helvetica, sans-serif;
  font-weight: 100;
  font-size: 1.5em;
}

p,
li {
  margin: 0em;
  padding: 0em;
  font-style: normal;
  font-weight: 300;
  line-height: 1.4;
  letter-spacing: 0em;
  text-transform: none;
  background-color: transparent;
}

.btn-primary {
  color: #fff !important;
  background-color: #0c4164 !important;
  border-color: transparent !important;
  border-radius: 0.35em;
  font-size: .8em;
  flex-direction: row;
  justify-content: center;
  align-items: center;
  padding: 1em;
  border: none;
}
.btn-primary:hover,
.btn-primary:focus,
.btn-primary:active,
.btn-primary.active,
.open > .dropdown-toggle.btn-primary {
  color: #680c0c !important;
  background-color: #eda93f !important;
  border-color: transparent !important;
  text-decoration: none;
}

.modal-body{
  padding: 2em;
}

img{
 vertical-align: middle;
}
.ft_c {
  flex: 1 1 auto;
}

.bodyBanner {
  /* position: sticky; */
  top: 0px;
  width: 100%;
  z-index: 100;
  padding-bottom: 4px;
  background-color: #f2b13c;
  background: linear-gradient(-90deg, #eeaa30, #ffc356, #eeaa30);
  text-shadow: 1px 1px 2px rgba(0,0,0,0.3);
  box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.4);
  -webkit-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.4);
  -moz-box-shadow: 0px 2px 5px 0px rgba(0,0,0,0.4);
}

#healthcare.bodyBanner{
  text-shadow: 1px 1px 2px rgba(0,0,0,0.45);
  background-color: darkred;
  background-color:rgba(148, 32, 40, 1);
  background: radial-gradient(circle, rgba(194,31,46,1) 1%, rgba(173,37,59,1) 30%, rgba(148,32,40,1) 100%);
  color: #fff;
}

#criminalJustice.bodyBanner{
  text-shadow: 1px 1px 2px rgba(0,0,0,0.45);
  background-color: steelblue;
  background-color:rgba(0, 122, 181, 1);
  background: radial-gradient(circle, rgba(21,142,201,1) 1%, rgba(0,122,181,1) 30%, rgba(8,98,142,1) 100%);
  color: #fff;
}

#otherCosts.bodyBanner{
  text-shadow: 1px 1px 2px rgba(0,0,0,0.45);
  background-color: olive;
  background-color:rgba(129, 141, 104, 1);
  background: radial-gradient(circle, rgb(139, 151, 102) 1%, rgba(129,141,104,1) 30%, rgba(98,116,78,1) 100%);
  color: #fff;
}

#errorPage.bodyBanner{
  text-shadow: 1px 1px 2px rgba(0,0,0,0.45);
  background-color: #d40e8c;
  background: rgb(198,22,89);
  background: radial-gradient(circle, rgba(198,22,89,1) 0%, rgba(172,8,101,1) 35%, rgba(212,14,140,1) 100%);
  color: #fff;
}

nav{
  background-color: #0e4164 ;
}

/* Skip to main content on focus button */
.skip-to-main-content-link {
  position: absolute;
  top: 0;
  left: 0;
  opacity: 0;
  width: 4em; /* Set the desired width for the colored square */
  height: 5em; /* Set the desired height for the colored square */
  border-radius: 0.35em;
  padding-top: 1em;
  font-size: 0.8em;
  background-color: rgb(54, 136, 200);
  box-shadow: 0em 0.15em 0.65em 0em rgba(0, 0, 0, 0.25);
  color: white;
  text-align: center;
  line-height: normal;
  text-decoration: none;
  z-index: 1;
  transition: opacity 0.3s; /* Add a smooth fade-in transition */
  overflow: hidden; /* Hides text outside the square */
}
.skip-to-main-content-link:focus {
  opacity: 1;
  left: 1em;
  top: -10px;
  border: 0px rgba(0, 0, 0, 0);
}

.skip-to-main-content-link:hover {
  color: #fff;
  text-decoration: underline;
}

.shadow-text{
  text-shadow: 2px 0px 2px rgba(0,0,0,0.3);
}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~ Dropdown menu CSS ~~~~~~~~~~~~~~~~~~~~~~~*/
/* ============ desktop view ============ */
@media all and (min-width: 992px) {
  .dropdown-menu li {
    position: relative;
  }
  .dropdown-menu .submenu {
    display: none;
    position: absolute;
    left: 100%;
    top: -7px;
  }
  .dropdown-menu .submenu-left {
    right: 100%;
    left: auto;
  }

  .dropdown-menu > li:hover > .submenu {
    display: block;
  }
}
/* ============ desktop view .end// ============ */

/* ============ small devices ============ */
@media (max-width: 991px) {
  .dropdown-menu .dropdown-menu {
    margin-left: 0.7rem;
    margin-right: 0.7rem;
    margin-bottom: 0.5rem;
  }
}
/* ============ small devices .end// ============ */
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~ End Dropdown menu CSS ~~~~~~~~~~~~~~~~~~~~~~~*/

.nav-link{
  font-size: 1em;
}

.nav-link,
.navbar-toggler-icon,
.dropdown-item {
  font-size: 0.95em;
  font-style: normal;
  font-weight: 300;
  line-height: 1;
  color: #fff;
}

.nav-link:focus{
    color: #eda93f; 
}

.dropdown-menu {
  background-color: #0e4164;
  border: none;
  border-radius: none;
}

.dropdown-menu li {
  margin: 1em;
}

.dropdown-toggle::after {
  display: none;
}

.nav-item,
.dropdown-item {
  padding: 0.5em;
}

.dropdown-item:hover {
  background: none;
}

.fa-instagram {
  width: auto;
  font-size: 1.65em;
  line-height: 0.5;
}

.jumbotron {
  padding: 1em 0 1em 0;
  background: #fdb31c;
}

.jumbotron .row {
  margin: 0;
}

.jumbotron .row img {
  padding: 0;
}

.navbar-toggler {
  padding: 0.25rem 0.75rem;
    font-size: 1.4rem;
    line-height: 1;
    background-color: transparent;
    border: 1px solid transparent;
    border-radius: 0.25rem
}



.fa-bars {
  color: white;
  font-size: larger;
}

.infoColumnsHeaders{
  width: 100%;
  font-weight: bold;
  margin-top: 2em;
  text-shadow: 1px 1px 2px rgba(0,0,0,0.1);
  text-transform: uppercase;
  font-size: 1.2em;
  letter-spacing: .1em;
}

.fa-angle-down {
  font-size: 0.7em;
  font-weight: bolder;
}

footer {
  font-size: 0.85em;
}

footer h3 {
  font-weight: 300;
  font-size: 1.25em;
  margin-bottom: 1em;
}

footer a {
  text-decoration: none;
}

strong {
  font-weight: 600;
}

.figure-caption{
color: #676f77;
}


/* ~~~~~~~~~ GDPR Notice ~~~~~~~~~*/
#gdpr-cookie-notice {
  background-color: #5e6973;
  border: none;
  border-radius: 0;
  color: #ffffff;
  font-size: 0.8em;
  line-height: 1.7em;
  position: fixed;
  bottom: 0; /* Adjust this value to control the distance from the bottom */
  left: 0;
  right: 0;
  z-index: 998; /* Make sure it's a high z-index to overlay other content */
  -webkit-box-shadow: 1px -1px 16px 5px rgba(0, 0, 0, 0.47);
  box-shadow: 1px -1px 16px 5px rgba(0, 0, 0, 0.47);
  border-top: 1px solid #946910;
  text-shadow: 2px 2px 6px rgba(24, 11, 7, 0.54);
}

#gdpr-cookie-notice a:link,
#gdpr-cookie-notice a:visited {
  color: #f8c96b;
  text-decoration: none;
}

#gdpr-cookie-notice a:hover {
  text-decoration: underline;
}

#gdpr-cookie-notice button {
  font-size: 1.1em;
  background: #fdb31c;
  padding: 0.5em 1em 0.5em 1em;
}

.contentShowcase {
  -webkit-box-shadow: 0em 0.25em 2em 0em rgba(0, 0, 0, 0.1);
  box-shadow: 0em 0.25em 2em 0em rgba(0, 0, 0, 0.1);
  border-bottom: 1px solid rgba(0, 0, 0, 0.1);
  border-left: 1px solid rgba(0, 0, 0, 0.1);
  border-right: 1px solid rgba(0, 0, 0, 0.1);
  padding: 2em;
  min-height: 27em;
  font-weight: 300;
  font-size: 1.2em;
}

.contentShowcase li {
  margin: 0.5em 0em;
}

.currentMembers {
  padding: 2em 2em;
}

a.currentMembers:link,
a.currentMembers:visited {
  font-style: normal;
  font-weight: 700;
  line-height: 1;
  letter-spacing: 0.05em;
  text-align: left;
  text-transform: uppercase;
  text-decoration: none;
  color: #2e7bb3;
}

a.currentMembers:hover {
  text-decoration: underline;
  color: #432c77;
}

#scrollToTop {
  display: none;
  position: fixed;
  bottom: 1em;
  right: 1em;
  color: #f39c12;
  text-align: center;
  font-size: 2em;
  line-height: 40px;
  cursor: pointer;

  z-index: 999;
  width: 1.5em; /* Adjust the size of the container */
  height: 1.5em; /* Make it square for a circle */
  justify-content: center;
  align-items: center;
  border: 2px solid #f39c12; /* Border width and color */
  border-radius: 50%; /* Creates a circular shape */
  transition: opacity 0.5s;
  opacity: 0;
}

#scrollToTop.active {
  display: block;
  opacity: 1;
}

.youtube-video {
  aspect-ratio: 16 / 9;
  width: 100%;
}

.text-shadow {
  text-shadow: 2px 2px 4px rgba(0, 0, 0, 0.5);
}


/* Styles for the image switch effect on mouseover for the buttons */
.image-switch-container {
  text-align: center;
}

.image-switch-wrapper {
  position: relative;
  display: inline-block;
  overflow: hidden;
  max-height: 150px; /* Set a maximum height to contain the image */
  /*margin-bottom: 20px;  Adjust the margin as needed for spacing */
  transition: max-height 0.5s ease, transform 0.5s ease; /* Add transitions */
}

.image-switch-container img {
  max-width: 100%;
  height: auto;
  object-fit: contain; /* Ensure the image is fully contained within its wrapper */
  display: block;
  transition: 0.3s ease-out 100ms;
}


.image-switch-wrapper:hover {
  max-height: 500px; /* Adjust the maximum height on hover */
  transform: scale(1.06); /* Scale the image on hover */
  animation: fadeIn .2s;
}

/*~~~~~~~~~~~ Accordian css ~~~~~~~~~~~~*/

.accordion-item {
  background-color: white;
  margin-bottom: 10px; 
  font-size: .9em ;
}


.accordion-item h2{
  margin: 0 !important;
}


  /* Apply rounded corners to all accordion items */
  .accordion-item {
    border-radius: .2em; /* Set your desired border-radius */
    overflow: hidden; /* Ensure content doesn't overflow rounded corners */
    border: 1px solid #6d6d6d;
    margin-bottom: 2em;
}

.accordion-item:not(:first-of-type) {
  border-top: 1px solid #383838;
}
.accordion-button{
  background-color: #fff; /* Text color when the accordion is active */
   color: #052215; 
   font-weight: 700 !important;
   font-size: .7em ;
}
.accordion-button:not(.collapsed) {
  color: #052215;
  background-color: #eaf5d7; /* Background color when the accordion is active */
  border: 0;
}

/* Change the color of the chevron when active */
 .accordion-button:not(.collapsed)::after {
  color: #052215 !important; /* Set your desired color */

  background-image: url('data:image/svg+xml,%3csvg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 16 16" fill="%23052215"%3e%3cpath fill-rule="evenodd" d="M1.646 4.646a.5.5 0 0 1 .708 0L8 10.293l5.646-5.647a.5.5 0 0 1 .708.708l-6 6a.5.5 0 0 1-.708 0l-6-6a.5.5 0 0 1 0-.708z"/%3e%3c/svg%3e');
}

.accordion-button:focus {
  outline: none; /* Remove the focus outline */
}

.text-indigo {
  color: #0e4164;
}

.main_holder {
  height: 500px;
  width: 100%;
  overflow-x: scroll;
  overflow-y: hidden;
}

#mainchart {
  height: 100%;
  width: 100%;
}

/* Font size for the Data vis tool chart labels */
#mainchart tspan {
  font-size: 1.5em;
  }

/* Styling for the data vis tool tooltips   */
  div.tooltip {
    position: absolute;
    text-align: center;
    width: auto;
    height: auto;
    padding: 5px;
    font: 12px sans-serif;
    background: #343a40;
    border: 0px;
    color: #fff;
    -webkit-border-radius: 3px;
    -moz-border-radius: 3px;
    border-radius: 3px;
    pointer-events: none;
  }

  .svg-shadow{
    filter: drop-shadow(0px 3px 3px rgba(0, 0, 0, 0.4));
  }
  
  .cbox {
    display: flex;
    -webkit-flex-direction: column;
    -moz-flex-direction: column;
    -ms-flex-direction: column;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    height: 100%;
  }

  .center-container {
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }

  .subHeaderStyle {
    color: #0e4164;
    margin-top: 15px;
    padding-bottom: 10px;
    margin-bottom: 15px;
    padding-top: 10px;
    border-bottom: 1px solid #efefef;
  }
  .headingOneSmall {
    font-size: 1.65em;
    font-weight: 300;
    padding-bottom: 5px;
    margin-top: -7px;
    color: #404f59;
  }
  @media (max-width: 901px) {
    .headingOneSmall {
      font-size: 1.2em;
      font-weight: 300;
      padding-bottom: 5px;
      margin-top: -7px;
      color: #404f59;
    }
  }
  .headingOneLarge {
    color: #404f59;
    font-weight: 600;
    font-size: 2.1em;
  }
  
  .headingOneLarge img{
    margin: 0 .5em 0 0;
  }
  
  @media (max-width: 901px) {
    .headingOneLarge {
      padding-top: 30px;
      color: #404f59;
      font-weight: 600;
      font-size: 1.6em;
    }
  }

  .card-header {
    background-color: #0e4164;
    border-bottom: 1px solid #0e4164;
    color: #fff;
  
  }

  .imglink{
    text-decoration: none;
  }

  a.imglink img.hover {
    display: none;
    width: 3rem;
    height: 3rem;
  }
  a.imglink img.default {
    display: inherit;
    width: 3rem;
    height: 3rem;
  }
  a.imglink:hover img.hover {
    display: inherit;
  }
  a.imglink:hover img.default {
    display: none;
  }

  .imgplacer img.default {
    display: inline-block;
    width: 3rem;
    height: 3rem;
  }

  .para {
    padding-left: 3rem;
    text-decoration: underline;
  }
  

  .hover-border:hover {
  border: 2px solid currentColor; /* matches text color */
  border-radius: .25rem; /* optional */
}