body {
  font-family: Arial, Helvetica, sans-serif;
}

.container-outer {
  position: relative;
  height: 100%;
  padding: 0px 10% 0px 10%;
  /* outline: 1px solid red; */
}
.container-inner {
  position: relative;
  max-width: 1200px;
  height: 100%;
  /* outline: 1px solid lightgreen; */
}


.va-common-banner {
  position: relative;
  height: 50px;
  background-color: #000000;
}


/* NAV STYLES USE TO GO HERE - NOW BROKEN UP INTO A SEPAREATE CSS FILE */


.introduction {
  position: relative;
  margin: calc(25px + 2%) 0px 12% 0px;
}
.introduction h1 {
  font-weight: 700;
}
.homepage-opening-photo {
  position: relative;
  width: 100%;
  max-height: 475px;
  object-fit: cover;
  object-position: 50% 50%;
}
@media screen and (min-width: 1650px) {
  .homepage-opening-photo {
    object-position: 50% 42%;
  }
}
.programs-header-text {
  font-weight: 700;
  margin: 0px 0px 35px 0px;
}
.services-intro-p01 {
  font-size: clamp(1.125rem, 2.25vw, 1.5rem);
  /* font-size: 20px; */
  /* font-size: calc(.375rem + 3vw); */
  line-height: 28px;
  margin-top: min(2.25ch, 7%);
}
.services-intro-p02 {
  font-size: 16px;
  margin-top: min(3.25ch, 7%);
}

/* ---- OTHER AGENCY CARDS ---- */
.other-agency-cards {
  display: flex;
  flex-direction: column;
  gap: 25px;
  flex-wrap: wrap;
  width: 100%;
  height: 100%;
}
.other-agency-cards a {
  text-decoration: none;
  color:rgb(200, 200, 200);
}
.oac-common-properties {
  display: flex;
  flex-direction: row;
  align-items: center;
  width: 100%;
  min-height: 50px;
  color: rgb(255, 255, 255); 
  /* color: inherit; */
  background-color: #222f7e;
  padding: 15px 15px 15px 15px;
}
.oac-common-properties:hover {
  background-color: blueviolet;
  color: rgb(255, 255, 255); 
}
.vbic-image {
  height: 50px;
}
.vpgc-image {
  height: 50px;
}
.cni-image {
  height: 50px;
}
.vasilc-image {
  height: 50px;
}
.oac-text {
  position: relative;
  display: inline-block;
  width: fit-content;
  font-size: 16px;
  font-weight: 700;
  color: inherit;
  text-align: left;
  margin: 0px 0px 0px 15px;
}
@media screen and (min-width: 705px) {
.other-agency-cards {
  display: flex;
  flex-direction: row;
  justify-content: center;
  gap: 50px;
  flex-wrap: wrap;
  width: 100%;
  height: 100%;
}
.oac-common-properties {
  flex-direction: column;
  width: 250px;
  min-width: 250px;
  height: 250px;
  padding: 20px 20px 0px 20px;
}
.vbic-image {
  position: relative;
  top: 10px;
  width: 112px;
  height: unset;
}
.vpgc-image {
  position: relative;
  top: 17px;
  width: 98px;
  height: unset;
}
.cni-image {
  position: relative;
  top: 16px;
  width: 107px;
  height: unset;
}
.vasilc-image {
  position: relative;
  top: 30px;
  width: 182px;
  height: unset;
}
.oac-text {
  position: absolute;
  display: block;
  width: 250px;
  font-size: 16px;
  font-weight: 700;
  color: inherit;
  text-align: center;
  padding: 0px 30px 0px 30px;
  margin: 140px 0px 0px 0px;
  z-index: 10;
}
}
@media screen and (min-width: 1455px) {
  .other-agency-cards {
    justify-content: space-between;
  }
}

/* VIDEOS */
.vid-background {
  position: relative;
  display: grid;
  grid-template-columns: auto;
  gap: 35px;
  background-color: rgb(245, 245, 245);
  padding: 35px;
  max-width: 1200px;
}
.dcl-vid-01, .dcl-vid-02 {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.25%;
}
.dcl-vid-01 iframe, .dcl-vid-02 iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  margin: 0px auto 0px auto;
}
.vid-header-text {
  font-weight: 700;
  margin: 17% 0px 35px 0px;
}
.dis-header-text {
  font-weight: 700;
  margin: 0px 0px 35px 0px;
}

@media screen and (min-width: 700px) {
  .vid-background {
    position: relative;
    display: grid;
    grid-template-columns: auto auto;
    gap: 35px;
    background-color: rgb(245, 245, 245);
    padding: 35px;
  }
}
@media screen and (min-width: 1000px) {
  .vid-background {
    padding: 70px;
    gap: 50px;
  }
}

.dcl-quote {
  font-size: 23px;
  font-style: italic;
  font-weight: 400;
  text-align: center;
  padding: 0px 15% 0px 15%;
  margin: 10% 0px 10% 0px;
}

@media screen and (max-width: 800.8px) {
  .dcl-quote {
   font-size: 16px;
  }
}
@media screen and (min-width: 801px) and (max-width: 1000px) {
  .dcl-quote {
   font-size: 20px;
  }
}
@media screen and (min-width: 1200px) {
  .services-intro-p01 {
    font-size: 24px;
    line-height: 32px;
  }
  .services-intro-p02 {
    font-size: 18px;
  }
}

.caregiver-image-01 {
  width: 100%;
  max-height: 600px;
  object-fit: cover;
  object-position: 50% 25%;
}

/* FOOTER -- START */
/* FOOTER -- SINGLE COLUMN */
footer {
  position: relative;
}
.footer-containter-outer {
  position: relative;
  background-color: #222f7e;
  padding: 50px 10% 30px 10%;
}
.footer-container-inner-grid {
  position: relative;
  display: grid;
  grid-template-columns: auto;
  column-gap: 50px;
  max-width: 1200px;
  padding: 0px 0px 0px 0px;
}
.footer-dcl-logo {
  width: 100%;
  max-width: 250px;
  /* width: auto; */
  margin: 0px 0px 40px 0px
}
.footer-contact {
  color: #ffffff;
  max-width: 300px;
}
.footer-contact p {
  margin-bottom: 0px;
}
.footer-contact p:first-line {
  font-weight: 700;
}
.footer-policies {
  color: #ffffff;
  max-width: 300px;
  margin: 35px 0px 0px 0px
}
.footer-policies p:first-line {
  font-weight: 700;
}
.social-logos {
  /* display: flex;
  justify-content: center; */
  width: fit-content;
  margin: 25px auto 0px auto;
}
.social-logos a img {
  display: inline-block;
  max-height: 30px;
  margin: 0px 8px 0px 8px;
}
.social-logos a:last-child img {
  display: inline-block;
  height: 30px;
  margin: 0px 8px 0px 8px;
}
.footer-copyright {
  color: #ffffff;
  text-align: center;
  margin: 15px 0px 0px 0px;
}
.footer-contact a,
.footer-policies a {
  text-decoration: none;
  color: rgb(255, 255, 255);
  font-weight: 700;
}

/* FOOTER -- TWO COLUMNS */
@media screen and (min-width: 576.8px) and (max-width: 1000.8px) {
  .footer-container-inner-grid {
    position: relative;
    display: grid;
    grid-template-columns: 44% 44%;
    grid-template-rows: auto auto;
    grid-column-gap: 12%;
  }
  .footer-logo {
    /* grid-column-start: 1;
    grid-column: 1 / 3;
    width: 100%;
    min-width: 200px;
    max-width: 300px; */
    margin: 0px 0px 0px 0px
  }
  .footer-dcl-logo {
    margin: 0px 0px 35px 0px
  }
  .footer-contact {
    grid-column-start: 1;
    color: #ffffff;
  }
  .footer-contact p {
    margin-bottom: 16px;
  }
  .footer-policies {
    grid-column-start: 2;
    color: #ffffff;
    margin: 0px 0px 0px 0px
  }
}

/* FOOTER -- THREE COLUMNS */
@media screen and (min-width: 1001px) {
  .footer-container-inner-grid {
    position: relative;
    display: grid;
    grid-template-columns: 29.3333% 29.3333% 29.3333%;
    grid-template-rows: auto;
    column-gap: 6%;
    padding: 0px 0px 0px 0px;
    margin: 0px auto 0px auto;
  }
  .footer-contact p {
    margin-bottom: 16px;
  }
  .footer-policies {
    margin: 0px 0px 0px 0px
  }
}
/* FOOTER -- END */


/* PROGRAM CARDS -- MOBILE */
  .grid-container-01 {
    position: relative;
    display: grid;
    grid-template-columns: auto;
    padding: 0px;
    gap: 50px;
    margin: 0px 0px 100px 0px
  }
  .grid-container-02 {
    position: relative;
    display: grid;
    grid-template-columns: auto;
    padding: 0px;
    gap: 50px;
    margin: 0px 0px 100px 0px
  }
  .grid-items-odd {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding: 35px;
    text-align: left;
    /* min-width: 200px; */
    max-width: 300px;
    height: 100%;
    background-color: rgb(245, 245, 245);
    margin: 0px auto 0px auto;
  }
  .grid-items-even {
    display: flex;
    justify-content: space-between;
    flex-direction: column;
    padding: 35px;
    text-align: left;
    /* min-width: 200px; */
    max-width: 300px;
    height: 100%;
    background-color: rgb(245, 245, 245);
    margin: 0px auto 0px auto;
  }
  .program-card-image-01,
  .program-card-image-02,
  .program-card-image-03,
  .program-card-image-04,
  .program-card-image-05,
  .program-card-image-06,
  .program-card-image-07 {
    aspect-ratio: 1 / 1;
    width: 100%;
    margin: 0px 0px 25px 0px;
    object-fit: cover;
  }
  .program-card-image-02 {
    object-position: 82% 50%;
  }
  .program-card-image-04 {
    object-position: 69% 50%;
  }
  .program-card-image-05 {
    object-position: 20% 50%;
  }
  .program-card-image-06 {
    object-position: 48% 50%;
  }
  .program-card-image-07 {
    object-position: 51% 50%;
    object-fit: cover;
  }
  /* .program-card-image-07 {
    object-position: 66% 100%;
    object-fit: cover;
  } */
  .program-card-text-containter {
    display: flex;
    flex-direction: column;
    align-content: space-between;
    justify-content: center;
    width: 100%;
    min-width: 150px;
  }
  .program-button-container {
    display: flex;
    justify-content: center;
    /* height: 100%; */
  }
  .program-card-button {
    position: relative;
    bottom: 0px;
    align-self: end;
    font-weight: 600;
    color: #ffffff;
    background-color:#222f7e;
    border: 0px;
    border-radius: 0px;
    width: 150px;
    margin: 25px 0px 0px 0px;
  }
  .program-card-button:hover { 
    color: #ffffff;
    /* background-color:hsl(293, 58%, 31%); */
    /* background-color: rgb(81, 38, 157); */
    background-color: blueviolet;
    /* background-color: #222f7e; */
    /* outline: 6px solid rgba(255, 255, 255, .5);
    outline-offset: -6px; */
  }
  .program-card-button:active { 
    color: #ffffff !important;
    /* background-color: rgb(81, 38, 157); */
    background-color: blueviolet !important;
  }
  .program-card-text-containter p {
    letter-spacing: -0.048em;
    /* min-width: 200px; */
  }
  .program-card-title {
    font-weight: 700;
    letter-spacing: -0.036em;
  }



  @media screen and (min-width: 577px) and (max-width: 1275.8px) {
    .grid-items-odd {
      flex-direction: unset;
      max-width: 800px;
      height: 315px;
    }
    .grid-items-even {
      -webkit-flex-direction: row-reverse;
      flex-direction: row-reverse;
      max-width: 800px;
      height: 315px;
    }
    .program-card-image-01,
    .program-card-image-03,
    .program-card-image-05,
    .program-card-image-07 {
      float: left;
      width: 100%;
      min-width: 140px;
      min-height: 240px;
      margin: 0px 25px 0px 0px;
      object-fit: cover;
    }
    .program-card-image-02,
    .program-card-image-04,
    .program-card-image-06  {
      float: right;
      width: 100%;
      min-width: 140px;
      min-height: 240px;
      margin: 0px 0px 25px 25px;
      object-fit: cover;
    }
    .program-card-image-01 {
      object-position: 15% 50%;
    }
    .program-card-image-02 {
      object-position: 82% 50%;
    }
    .program-card-image-03 {
      object-position: 75% 50%;
    }
    .program-card-image-04 {
      object-position: 59% 50%;
    }
    .program-card-image-05 {
      object-position: 40% 50%;
    }
    .program-card-image-06 {
      object-position: 5% 50%;
    }
    .program-card-image-07 {
      object-position: 50% 100%;
    }
    /* .program-card-image-07 {
      object-position: 44% 100%;
    } */
    .program-card-text-containter {
      min-width: 220px;
    }
    .program-card-text-containter p {
      min-width: 220px;
    }
    .program-card-button {
      margin: 15px 0px 0px 0px;
    }
  }

@media screen and (min-width: 1276px) {
  .grid-container-01 {
      grid-template-columns: auto auto;
  }
  .grid-container-02 {
    grid-template-columns: auto auto;
  }
  .grid-items-odd, .grid-items-even {
    flex-direction: unset;
    max-width: 575px;
    height: 315px;
  }
  .program-card-image-01,
  .program-card-image-02,
  .program-card-image-03,
  .program-card-image-04,
  .program-card-image-05,
  .program-card-image-06,
  .program-card-image-07 {
    float: left;
    min-width: 140px;
    min-height: 240px;
    margin: 0px 25px 0px 0px;
  }
  .program-card-image-02 {
    object-position: 82% 50%;
  }
  .program-card-image-03 {
    object-position: 80% 50%;
  }
  .program-card-image-04 {
    object-position: 60% 50%;
  }
  .program-card-image-05 {
    object-position: 40% 50%;
  }
  .program-card-image-06 {
    object-position: 0% 50%;
  }
  .program-card-image-07 {
    object-position: 50% 100%;
  }
  /* .program-card-image-07 {
    object-position: 62% 100%;
  } */
  .program-card-text-containter {
    min-width: 220px;
  }
  .program-card-button {
    margin: 15px 0px 0px 0px;
  }

/* _______________________ */
.grid-container-01 div:nth-child(3) {
  grid-column: 1 / span 2;
  margin-left: calc(23.776% + 25px);
  margin-right: calc(23.776% + 25px);
}
.grid-container-01 div:nth-child(3) .program-card-text-containter {
  max-width: 240px;
}
.grid-container-02 div:nth-child(5) {
  grid-column: 1 / span 2;
  margin-left: calc(23.776% + 25px);
  margin-right: calc(23.776% + 25px);
}
.grid-container-02 div:nth-child(5) .program-card-text-containter {
  max-width: 240px;
}
}




/* PERSONAL ASSISTANCE SERVICES (PAS) */
.sunny-view-image {
  position: relative;
  width: 100%;
  max-height: 600px;
  object-fit: cover;
  object-position: 50% 32.5%;
  margin: 0px 0px 12% 0px;
}
.pas-services-include {
  font-size: clamp(1.125rem, 2.25vw, 1.5rem);
  line-height: 28px;
  margin-top: min(2.25ch, 7%);
  font-weight: 700;
}
.pas-services-listing {
  font-size: clamp(1.125rem, 2.25vw, 1.5rem);
  line-height: 28px;
  font-weight: 500;
  margin: -6px 0px 0px 0px;
  /* overflow-wrap: break-word;
  word-wrap: break-word;
  word-break: break-all; */
}

.supports {
  display: grid;
  grid-template-columns: auto;
  grid-template-rows: auto auto;
  grid-row-gap: 20px;
  margin: 0px 0px 50px 0px;
}
.supports img {
  width: 100%;
}
.supports-text-container {
  display: flex;
  justify-content: center;
  flex-direction: column;
}
.supports-text-container h4 {
  font-size: 20px;
  font-weight: 700;
}
.supports-text-container p {
  margin: 0px 0px 0px 0px;
}
.pas-general-eligibility {
  height: fit-content;
  background-color: rgb(240, 240, 240);
  padding: 50px 0px 40px 0px;
  margin: 12% 0px 12% 0px;
}
.pas-general-eligibility-heading {
  font-size: 24px;
  font-weight: 700;
  text-align: center;
}
.pas-general-eligibility-text ul li {
  /* list-style-position: inside; */
  /* list-style-type: none;
  padding: 0px;
  margin: 0px; */
  margin-left: 18px;
  text-align: left;
}
.pas-general-eligibility-text ul {
  padding: 0px 0px 0px 0px;
}
.specific-eligibility-heading {
  font-size: 24px;
  font-weight: 700;
  text-align: center;
  margin: 0px 0px 30px 0px;
}
.specific-eligibility-grid {
  position: relative;
  display: grid;
  height: 100%;
  grid-template-columns: auto;
  grid-template-rows: auto auto auto auto auto auto;
  /* grid-row-gap: 2%; */
  /* margin: 0px 0px 50px 0px; */
}
.specific-eligibility-grid h4 {
  font-size: 20px;
  font-weight: 700;
}
.state-pas-image {
  width: 100%;
  margin: 0px 0px 20px 0px;
}
.brain-injury-pas-image {
  width: 100%;
  margin: 0px 0px 20px 0px;
}
.vr-pas-image {
  width: 100%;
  margin: 0px 0px 20px 0px;
}
.state-pas-text-container {
  margin: 0px 0px 50px 0px;
}
.brain-injury-pas-text-container {
  margin: 0px 0px 50px 0px;
}
.vr-pas-text-container {
  margin: 0px 0px 0px 0px;
}
.pas-lower-image {
  position: relative;
  width: 100%;
  height: 300px;
  object-fit: cover;
  object-position: 50% 18%;
  margin: 75px 0px 0px 0px;
}

@media screen and (min-width: 576px) {
  .supports-text-container h4 {
    font-size: 22px;
    font-weight: 700;
  }
  .specific-eligibility-grid h4 {
    font-size: 22px;
    font-weight: 700;
  }
  .pas-general-eligibility-heading {
    font-size: 30px;
  }
  .specific-eligibility-heading {
    font-size: 30px;
  }
  .state-pas-image {
    margin: 0px 0px 25px 0px;
  }
  .brain-injury-pas-image {
    margin: 0px 0px 25px 0px;
  }
  .vr-pas-image {
    margin: 0px 0px 25px 0px;
  }
  .supports {
    grid-row-gap: 25px;
  }
}

@media screen and (min-width: 900px) {
  .introduction {
    position: relative;
    margin: 7% 0px 8% 0px;
  }  
  .services-intro-p01 {
    /* font-size: clamp(1.125rem, 2.25vw, 1.5rem); */
    /* font-size: 20px; */
    /* font-size: calc(.375rem + 3vw); */
    line-height: 32px;
    margin-top: min(2.25ch, 7%);
  }
  .sunny-view-image {
    margin: 0px 0px 0px 0px;
  }
  .supports {
    display: grid;
    grid-template-columns: 47.91665% 47.91665%;
    grid-template-rows: auto;
    /* grid-template-rows: auto auto; */
    grid-column-gap: 4.1667%;
    margin: 8% 0px 8% 0px;
  }
  .supports img {
    /* aspect-ratio: 1 / 1; */
    width: 100%;
    /* height: 100%; */
    height: 383px;
    object-fit: cover;
    object-position: 87% 50%;
  }
  .supports-text-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
  }
  .supports-text-container h4 {
    font-size: 24px;
    font-weight: 700;
  }
  .specific-eligibility-grid h4 {
    font-size: 24px;
    font-weight: 700;
  }
  .supports-text-container p {
    margin: 0px 0px 0px 0px;
  }
  .pas-general-eligibility {
    margin: 0px 0px 0px 0px;
  }
  .pas-general-eligibility-heading {
    font-size: 32px;
  }
  .specific-eligibility-heading {
    margin: 100px 0px 50px 0px;
    font-size: 32px;
  }
  .specific-eligibility-grid {
    display: grid;
    grid-template-columns: calc(50% - 25px) calc(50% - 25px);
    grid-template-rows: auto auto auto;
    grid-column-gap: 50px;
    grid-row-gap: 100px;
    /* grid-column-gap: 4.1667%;
    grid-row-gap: 4.1667%; */
    /* grid-template-rows: 30.5555% 30.5555% 30.5555%;
    grid-column-gap: 4.1667%; */
    margin: 0px 0px 0px 0px;
  }
  .state-pas-image {
    width: 100%;
    height: 100%;
    min-height: 300px;
    object-fit: cover;
    object-position: 82% 50%;
    grid-column-start: 2;
    margin: 0px 0px 0px 0px;
  }
  .state-pas-text-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    grid-column-start: 1;
    grid-row-start: 1;
    margin: 0px 0px 0px 0px;
  }
  .state-pas-text-container ul,
  .brain-injury-pas-text-container p,
  .vr-pas-text-container ul {
    margin-bottom: 0px;
  }
  .brain-injury-pas-image {
    width: 100%;
    /* height: 100%; */
    min-height: 300px;
    object-fit: cover;
    grid-column-start: 1;
    grid-row-start: 2;
    margin: 0px 0px 0px 0px;
  }
  .brain-injury-pas-text-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    grid-column-start: 2;
    grid-row-start: 2;
    margin: 0px 0px 0px 0px;
  }
  .vr-pas-image {
    height: 100%;
    min-height: 300px;
    object-fit: cover;
    object-position: 54% 50%;
    grid-column-start: 2;
    grid-row-start: 3;
    margin: 0px 0px 0px 0px;
  }
  .vr-pas-text-container {
    display: flex;
    justify-content: center;
    flex-direction: column;
    grid-column-start: 1;
    grid-row-start: 3;
    margin: 0px 0px 0px 0px;
  }
  .pas-lower-image {
    width: 100%;
    height: 475px;
    object-fit: cover;
    object-position: 50% 25%;
    margin: 150px 0px 0px 0px;
  }
  .pas-services-include {
    font-size: 24px;
    line-height: 32px;
  }
  .pas-services-listing {
    /* font-size: 24px; */
    line-height: 32px;
  }
}

@media screen and (min-width: 1200px) {
  .pas-services-include {
    font-size: 24px;
    line-height: 32px;
  }
  .pas-services-listing {
    font-size: 24px;
    line-height: 32px;
  }
  .pas-general-eligibility-text {
    font-size: 22px;
  }
}




#return-to-top {
  position: fixed;
  bottom: 20px;
  right: 20px;
  width: 30px;
  height: 30px;
  display: block;
  text-decoration: none;
  -webkit-border-radius: 15px;
  -moz-border-radius: 15px;
  border-radius: 15px;
  display: none;
  -webkit-transition: all 0.3s linear;
  -moz-transition: all 0.3s ease;
  -ms-transition: all 0.3s ease;
  -o-transition: all 0.3s ease;
  transition: all 0.3s ease;
  z-index: 1;
}

#return-to-top i {
    color: #fff;
    margin: 0;
    position: relative;
    -webkit-transition: all 0.3s ease;
    -moz-transition: all 0.3s ease;
    -ms-transition: all 0.3s ease;
    -o-transition: all 0.3s ease;
    transition: all 0.3s ease;
}

#return-to-top:hover i {
    color: #fff;
    top: 5px;
}


/* Videos on index.htm page */
.videos-box {
  display: flex;
  justify-content: center;
  align-content: center;
  flex-direction: column;
  gap: 30px;
  background-color: rgb(240, 240, 240);
  width: 100%;
  height: 100%;
  padding: 30px 30px 30px 30px;
  margin: 0px 0px 100px 0px;
}
.vid-box-vid-01 {
  position: relative;
  width: 100%;
  height: 0;
  padding-bottom: 56.22%;  
}
.vid-box-vid-01 iframe {
  position: absolute;
  width: 100%;
  height: 100%;
  border: 0px;
  margin: 0px auto 0px auto;  
}
@media screen and (min-width: 576px) {
  .videos-box {
    gap: 50px;
    padding: 50px 50px 50px 50px;
    margin: 0px 0px 150px 0px;
  }
}
@media screen and (min-width: 1000px) {
  .videos-box {
    display: flex;
    justify-content: space-between;
    align-content: center;
    flex-direction: row;
    gap: 50px;
    background-color: rgb(240, 240, 240);
    width: 100%;
    max-height: 415px;
    padding: 50px 50px 50px 50px;
  }
  .vid-box-vid-01 {
    position: relative;
    width: 100%;
    height: 0;
    padding-bottom: 26.9%;  
  }
  .vid-box-vid-01 iframe {
    position: absolute;
    width: 100%;
    height: 100%;
    margin: 0px auto 0px auto;  
  }
}


/* AUXILIARY GRANT - START */
.ag-opening-photo {
  position: relative;
  width: 100%;
  max-height: 475px;
  object-fit: cover;
  object-position: 50% 28%;
}
.middle-photo-01 {
  position: relative;
  width: 100%;
  max-height: 546px;
  object-fit: cover;
  object-position: 50% 50%;
}

.ag-links-group {
  position: relative;
  display: flex;
  flex-direction: row;
  justify-content: center;
  flex-wrap: wrap;
  column-gap: 25px;
  row-gap: 25px;
  margin: calc(20px + 2.0%) auto 47px auto;
}
.ag-links-group a {
  font-weight: 700;
  text-align: left;
  width: 425px;
  border: 0px;
  text-decoration: none;
}
.ag-link-box {
  position: relative;
  display: flex;
  align-items: center;
  justify-content: space-between;
  background-color: rgb(245 245 245);
  border-left: 8px solid rgb(245 245 245);
  height: 60px;
  color: rgb(210, 210, 210);
  padding: 0px 25px 0px 0px;
}
.ag-link-box:hover {
  box-shadow: 5px 5px 15px rgba(0, 0, 0, .15);
  border-left: 8px solid #222f7e;
  color: #222f7e;
  transition: 0.3s;
}
.ag-link-box p {
  color: rgb(0 0 0);
  font-weight: 700;
  line-height: 20px;
  margin: 0px 0px 0px 15px;
}
.ag-links-group a:nth-child(4) .ag-link-box p {
  letter-spacing: -.35px;
}
.ag-link-box .r-arrow {
  font-size: 30px;
  color: inherit;
}
.ag-contact-us-outer {
  background-color: rgb(245, 245, 245);
  position: relative;
  display: block;
  width: 100%;
  padding: 35px 10% 45px 10%;
}
.ag-contact-us-inner {
  position: relative;
  max-width: 1200px;
  margin: 0px auto 0px auto;
}
.ag-contact-us-outer .ag-contact-us-inner header h2 {
  font-weight: 700;
}
.ag-contact-us-text {
  display: flex;
  justify-content: flex-start;
  flex-direction: row;
  flex-wrap: wrap;
  column-gap: 50px;
}
.ag-contact-us-text p {
  margin-bottom: 0px;
}
.ag-contact-us-text p a {
  text-decoration: none;
  font-weight: 700;
}
.ag-contact-us-text p:nth-child(1) {
  flex-basis: 100%;
  margin: 0px 0px 35px 0px;
}
.closing-photo-01 {
  width: 100%;
  max-height: 724px;
  object-fit: cover;
}
.ag-eligibility {
  margin: 6.5% 0px 6.5% 0px;
}
.ag-eligibility header h2,
.ag-forms-documents header h2 {
  font-weight: 700;
  margin-top: 40px
}
.ag-forms-documents {
  margin: 0px 0px 100px 0px;
}

/* AUXILIARY GRANT ACCORDION - START */
.ag-accordion {
  margin-top: 35px;
  --bs-accordion-border-width: 0px;
}
.ag-accordion .accordion-body {
  background-color: rgb(250, 250, 250);
}
.ag-accordion .accordion-item .accordion-header .accordion-button {
  font-size: 18px;
  font-weight: 700;
  color: rgb(255, 255, 255);
  background-color: #222f7e;
  margin: 25px 0px 0px 0px;
}
.ag-accordion .accordion-item .accordion-header .collapsed {
  color: rgb(0, 0, 0);
  background-color: rgb(245, 245, 245);
}
.ag-accordion .accordion-item .accordion-header .collapsed:hover {
  color: rgb(255, 255, 255);
  background-color: #222f7e;
}
.ag-accordion .accordion-item .accordion-header .collapsed::after {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23000000'><path 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'/></svg>") !important;
}
.ag-accordion .accordion-item .accordion-header .collapsed:hover::after {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path 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'/></svg>") !important;
}
.ag-accordion .accordion-item .accordion-header :not(.collapsed)::after {
  background-image: url("data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 16 16' fill='%23ffffff'><path 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'/></svg>") !important;
}
.ag-accordion .accordion-item .accordion-header .accordion-button:focus {
  box-shadow: none;
}
.accordion-body-heading-01 {
  font-weight: 700;
}
.ag-accordion .accordion-item:nth-child(2) .accordion-body .accordion-body-heading-01:nth-last-child(2),
.ag-accordion .accordion-item:nth-child(3) .accordion-body .accordion-body-heading-01 {
  /* outline: 1px solid red; */
  margin-top: 30px;
}
.ag-accordion ol li {
  margin-bottom: 20px;
}
.ag-accordion ul li {
  margin-bottom: 15px;
}
.break-long-words {
  word-break: break-all;
}
/* AUXILIARY GRANT ACCORDION - END */


/* AUXILIARY GRANT RESOURCES PAGE agresources.htm - START */
.ag-resources-photo {
  position: relative;
  width: 100%;
  max-height: 375px;
  object-fit: cover;
  object-position: 50% 75%;
}
.closing-photo-02 {
  width: 100%;
  max-height: 724px;
  object-fit: cover;
  object-position: 50% 75%;
}
.resources-heading {
  position: relative;
  margin: 7% 0px 3% 0px;
}
.resources-heading h1 {
  font-weight: 700;
}
.resources-subheading {
  font-size: 24px;
  font-weight: 700;
  margin: 50px 0px 10px 0px;
}
.resouces-section {
  margin-bottom: 100px;
}
.resouces-section ul li {
  margin-bottom: 13px;
}
.resouces-section .ag-man-accordion .accordion-body {
  padding-bottom: 0px;
  margin-bottom: 20px;
}
/* .resouces-section .ag-man-accordion ul li:last-child {
  margin-bottom: 0px;
} */
.ag-resources-photo-container {
  position: relative;
}
.ag-resources-photo-container-inner {
  position: absolute;
  top: 0px;
  left: 0px;
  right: 0px;
  bottom: 0px;
  display: flex;
  justify-content: center;
  align-items: center;
}
.ag-resources-photo-container p {
  position: relative;
  width: fit-content;
  font-size: 30px;
  font-weight: 700;
  color: #ffffff;
  background-color: rgba(0, 0, 0, .5);
  padding: 10px 20px 10px 20px;
  margin: 0px 10% 0px 10%;
}

@media screen and (max-width: 625px) {
  .ag-resources-photo-container p {
    font-size: 24px;
}
}

.resouces-section ul li {
  font-weight: 700;
  /* color: #000000; */
  color: #0D6EFD;
  /* color: rgba(0, 0, 0, .6); */
  /* color: #4E4E4E; */

}
.resouces-section ul li a {
  font-weight: 700;
  /* color: #000000; */
  color: #0D6EFD;
  /* color: rgba(0, 0, 0, .6); */
  /* color: #4E4E4E; */
  text-decoration: none;
  text-underline-offset: 5px;
  /* border-left: 4px solid #ffffff; */
  /* padding-left: 5px; */
}
.resouces-section ul li a:hover {
  color: #0D6EFD;
  text-decoration: underline;
  text-decoration-thickness: 3px;
  /* border-left: 4px solid #0D6EFD; */
}
.resource-btn-group {
  display: inline-block;
  position: relative;
}
.resource-btn-group .res-btn {
  font-size: 12px;
  font-weight: 700;
  line-height: 22px;
  /* color: #0B5FDE;  */
  /* color: #000000; */
  color: #0D6EFD; 
  background-color: rgba(235, 235, 235, 1);
  padding: 5px 10px 5px 10px;
  margin-left: 15px;
  /* border: 1px solid rgba(230, 230, 230, 1); */
  border: none;
  /* border-radius: 7px; */
}
.resource-btn-group .res-btn:hover {
  color: #ffffff;
  background-color: #0D6EFD;
  text-decoration: none;
}
.resouces-section ul li .ag-man-accordion {
  max-width: 375px;
  --bs-accordion-border-width: 0px;
}
.resouces-section ul li .ag-man-accordion button {
  font-weight: 700;
  /* color: #000000; */
  color: #0D6EFD;
  text-decoration: none;
  padding: 5px 5px 5px 0px;
  /* margin-bottom: 13px; */
}
.resouces-section ul li .ag-man-accordion button.collapsed::after,
.resouces-section ul li .ag-man-accordion button::after {
  margin-left: 25px;
}
.ag-man-accordion ul {
  padding-left: 0px;
}
.resouces-section ul li .ag-man-accordion button:focus {
  box-shadow: none;
  background-color: #ffffff;
}
.resouces-section ul li .ag-man-accordion button:hover {
  color: #0D6EFD;
  text-decoration: underline;
  text-decoration-thickness: 3px;
  text-underline-offset: 5px;
  box-shadow: none;
  background-color: #ffffff;
}
.accordion-button:not(.collapsed) {
  background-color: #ffffff;
}
@media screen and (max-width: 576px) {
  .resources-subheading {
    font-size: 20px;
  }
}
/* AUXILIARY GRANT RESOURCES PAGE agresources.htm - END */


/* GUARDIAN TRAINING - START */
.guard-train-table {
  position: relative;
  max-width: 600px;
  margin: 35px auto 25px auto;
}
.guard-train-table .guard-train-table-head th {
  padding: 10px 10px 10px 10px;
}
.guard-train-table .guard-train-table-head th:nth-child(1) {
  width: 50%;
}
.guard-train-table .guard-train-table-head th:nth-child(2) {
  border-left: 1px solid rgba(255, 255, 255, .30);
}
.guard-train-table-head {
  color: #ffffff;
  background-color: #222f7e;
}
.guard-train-table tr td {
  vertical-align: top;
  padding: 10px 10px 10px 10px;
  /* border-left: 1px solid rgba(0, 0, 0, .10); */
  /* border-right: 1px solid rgba(0, 0, 0, .10);
  border-top: 1px solid rgba(0, 0, 0, .10);
  border-bottom: 1px solid rgba(0, 0, 0, .10); */
}
.guard-train-table tr td:nth-child(2) {
  border-left: 1px solid rgba(0, 0, 0, .10);
}
tr:nth-child(2) {
  background-color: rgba(34, 47, 126, .15);
  border-bottom: 1px solid rgba(0, 0, 0, .10);
}
tr:nth-child(3) {
  background-color: rgb(245, 245, 245);
}
table .guard-train-table-second-row {
  background-color: rgba(34, 47, 126, .15);
  border-bottom: 1px solid rgba(0, 0, 0, .10);
}
tr:nth-child(4) {
  background-color: rgb(245, 245, 245);
}

/* For istock photo: istockphoto-1283858620-1024x1024.jpg */
/* .guard-train-open-photo {
  position: relative;
  width: 100%;
  max-height: 475px;
  object-fit: cover;
  object-position: 50% 69%;
} */

.guard-train-open-photo {
  position: relative;
  width: 100%;
  max-height: 475px;
  object-fit: cover;
  object-position: 50% 50%;
}
.guard-train-text {
  font-size: 18px;
}
.guard-train-text p a {
  font-weight: 700;
  text-decoration: none;
}
.guard-train-subheader-text {
  font-weight: 700;
  margin: 0px 0px 10px 0px;
}
.guard-train-q-a h3 {
  font-weight: 700;
  margin-top: 50px;
}
.guard-train-q-a p {
  font-size: 1.00em;
}
.guard-train-pres-image {
  display: block;
  width: 100%;
  max-width: 600px;
  box-shadow: 0px 0px 25px rgba(0, 0, 0, .20);
  margin: 40px auto 20px auto;
}
.guard-train-opening-photo-01 {
  display: block;
  width: 100%;
  max-height: 475px;
  object-fit: cover;
  object-position: 50% 36%;
}
.guard-train-closing-photo-01 {
  display: block;
  width: 100%;
  max-height: 800px;
  object-fit: cover;
  object-position: 50% 52.5%;
}
.training-module-caption {
  text-align: center;
  font-weight: 700;
}
.gt-links-group {
  margin-top: calc(20px + 2.0%);
}
.gt-links-group a {
  width: 475px;
}
.gt-links-group a div p {
  line-height: 1.35em;
}
.gt-link-box {
  height: fit-content;
  padding-top: 10px;
  padding-bottom: 10px;
}

@media screen and (min-width: 450px) {
  .guard-train-table .guard-train-table-head th:nth-child(1) {
    width: 175px;
  }
}

@media screen and (min-width: 992px) {
  .guard-train-q-a p {
  font-size: 1.25em;     /* changed this from 1.0 to 1.25, per request from Ellie to make it larger */
  }
}
/* GUARDIAN TRAINING - END */

/* GUARDIAN TRAINING RESOURCES - START */
.guard-train-resouces-open-photo {
  position: relative;
  width: 100%;
  max-height: 475px;
  object-fit: cover;
  object-position: 50% 47%;
}
.guard-train-resouces-closing-photo-01 {
  width: 100%;
  max-height: 800px;
  object-fit: cover;
  object-position: 50% 50%;
}
.guardian-training-section-01 {
  /* margin-bottom: calc(4% + 50px); */
  margin-bottom: 75px;
}
.guardian-training-resources-section-01 {
  /* margin-bottom: calc(4% + 50px); */
  margin-bottom: 75px;
}
.guardian-training-section-01 a,
.guardian-training-resources-section-01 a {
  font-weight: 700;
  text-decoration: none;
}
.gt-resources-introduction {
  margin-bottom: 2.5%;
}
/* GUARDIAN TRAINING RESOURCES - END */

/* GUARDIAN TRAINING RESOURCES ACCORDION - START */
.gt-resources-accordion .accordion-item:nth-child(2) .accordion-body .accordion-body-heading-01:nth-last-child(2),
.gt-resources-accordion .accordion-item:nth-child(3) .accordion-body .accordion-body-heading-01 {
  margin-top: 0px;
}
.accordion-button svg {
  max-height: 40px;
  width: 45px;
  margin-right: 15px;
  float: left;
  pointer-events: none;
}

/* These CSS styles add interactivity to the accordion icons on the guardiantraining-resources.htm page. This CSS was created as a replacement for and simpler way of executing this interactivity. These CSS styles replace the functionality for these icons within the JS file entitled: custom-accordion.js Date: 07-17-2025 - START */
.ag-accordion .accordion-item .accordion-header .collapsed .icon-fill-01 {
  fill: #000000;
}
.ag-accordion .accordion-item .accordion-header .collapsed:hover .icon-fill-01 {
  fill: #ffffff;
}
.ag-accordion .accordion-item .accordion-header .icon-fill-01 {
  fill: #ffffff;
}
/* END */

/* The below CSS styles are used within the JS file entitled: custom-accordion.js in order for the accordion icons to work when this JS file is used instead of the CSS styles above. These CSS styles aren't necessary when the CSS styles above are being used and this JS file isn't being used. Their present state in remaining active doesn't interfere with the performace of the CSS styles above. Date: 07-17-2025 - START */
.icon-fill-01 {
    fill: #000000;
}
.icon-fill-02 {
    fill: #ffffff;
}
/* The style below is not used in above JS file. It was created for further experiments. */
.icon-fill-03 { 
    fill: #ffffff;
}
/* END */
/* GUARDIAN TRAINING RESOURCES ACCORDION - END */
