:root{
  --nav-blue: #9CC7F6;
}

html {
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;
}


#accordionTab .card-body a:link,
li.breadcrumb-item a:link,
.intro a:link {
  color: #195f92;
  outline: none;
  text-decoration: underline;
}

#accordionTab .card-body a:visited,
li.breadcrumb-item a:visited,
.intro a:visited {
  color: #195f92;
  outline: none;
  text-decoration: underline;
}

#accordionTab .card-body a:hover,
li.breadcrumb-item a:hover,
#accordionTab .card-body a:active,
li.breadcrumb-item a:active,
.intro a:hover,
.intro a:active {
  color: #212529;
  outline: none;
  text-decoration: underline;
}

#accordionTab .card-body a.dddaccHeader:link,
#accordionTab .card-body a.dddaccHeader:visited,
#accordionTab .card-body a.dddaccHeader:hover,
#accordionTab .card-body a.dddaccHeader:active {
  color: #195f92;
  outline: none;
  text-decoration: none !important;
}

.sticky-button {
  cursor: pointer;
  position: fixed;
  bottom: 25px;
  right: 10px;

  background-color: #cdb04f;
  color: #000 !important;
  border-radius: 5px;
  border: 1px solid #888888;

  font-size: 0.9rem;
  line-height: 1rem;
  outline: none;
  padding: 10px 10px;
  z-index: 99;
}

.carousel-caption {
  position: absolute;
  right: 0%;
  bottom: 0px;
  left: 0%;
  z-index: 10;
  padding-top: 20px;
  padding-bottom: 20px;
  color: #fff;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.5) !important;
  border
}



.text-orange {
  color: #cf7129 !important;
}

.bg-darkblue {
  background-color: #115e8f !important;
  color: #fff;
}

.bg-yellow {
  background-color: #FCD416 !important;
  color: #000000;
}

.bg-gray {
  background-color: #f5f6f6;
  color: #111;
}

.bg-gray h2 {
  color: #cf7129 !important;
}

.bg-orange {
  background-color: #f68936
}

#site-name figcaption {
  font-size: 1.1rem !important;
  color: #222;
  font weight: 500 !important
}

span.h5 {}



.rec-section h6.card-title,
.covid-section h6.card-title,
a h6.card-title,
a.text-wrap,
li.posteddate a:link {
  color: #0056b0;
  text-transform: uppercase;
  outline: none;
}


.lead p {
  font-size: 1.4rem;
  font-weight: 400;
}

.intro-img {
  max=width: 100px;
  height: auto;
  width: 80px;
  margin: 0 auto;
}

.h2 a.navbar-brand {
  color: #111
}

.reachnj-nav {
  background-color: #ffffff !important;
  font-size: .9575rem;
  color: #10537e !important
}

#rnj .footer .rnj {
  background-color: #115e8f !important;
  padding: 15px 0;
  color: #fff;
  font-size: 14px;
  margin-top: 30px;
  font-weight: 300;
}

.card0 {
  text-align: left;
  background-color: #f5f6f6 !important;
}

.card1 {
  background-color: #115e8f !important;
  color: #fff !important;
  float: right
}

.card2 {
  text-align: left;
  background-color: #ffffff !important;
}



.tsocial {
  background-color: #0F3F61;
  color: #ffffff;
}

.fsocial {
  background-color: #17548d;
  color: #ffffff;
}





form.news .btn-sm {
  position: absolute;
  top: 0;
  right: 0;
  bottom: 0;
  border: 0;

  margin: 1px;
  background-color: #cdb04f;
  color: #000 !important;
  font-weight: 500;
  text-transform: uppercase;
  -webkit-font-smoothing;
  padding: 0.3rem 1.5rem;

  border-radius: 4px;
  font-size: 98%;
}

form.news .required {
  color: #6d2303;
}

.nav-down {
  bottom: -40px;
}

strong {
  font-weight: 500;
}

ul.check li {
  padding: 0;
  margin: 0;
  list-style: none;
}

ul.check {
  margin: 2em 0;
}

ul.check li {
  margin: 1em;
  margin-left: 3em;
}

ul.check li:before {
  content: '✔';
  font-family: 'FontAwesome';
  float: left;
  margin-left: -1.5em;
  color: #333;
}

.link {
  font-size: 0.45em;
}

.border-dark {
  border-right: 1px solid #132553;
}

.border-btm-dark {
  border-bottom: 5px solid #132553;
}



div.hr hr {
  display: none;
}

.list-group.list-group-horizontal-md {
  display: flex;
  flex-direction: row;
}

.list-group.list-group-horizontal-md .list-group-item {
  margin-bottom: 0;
  margin-right: 0;
  border-right-width: 0;
  border: none;
  background-color: transparent !important;
}

ul.list-group.list-group-striped li:nth-of-type(odd) {
  background: #fcfcfc;
}

ul.list-group.list-group-striped li:nth-of-type(even) {
  background: #fff;
}

ul.list-group.list-group-hover li:hover {
  background: #fcfcfc;
}

/*ul .btn-sm, .list-group-striped.btn-link {padding-left:0!important;}*/

.infobox .list-group-flush:last-child .list-group-item:last-child {
  border-bottom: 1px solid red !important;
}

@-moz-document url-prefix() {
  .date {
    padding: 0px 0 0 0;
  }

  .date p span {
    padding: 2px 0 3px 0;
  }
}


/* CSS Document */
h2.h2title {
  color: #01365e;
  font-size: 2.0rem;
  font-weight: 400, margin-top:3rem;
  text-transform: uppercase;
  font-weight: 400;
}

h2.home-subtitle {
  font-size: 1.6rem;
  padding-bottom: 0;
  color: #01365e;
}

h4.section-title {
  color: #222;
  font-size: 1.5rem;
  font-weight: 400
}

h4.section-title .text-muted {
  font-size: 1.5rem;
  font-weight: 400
}

h4.section-title br {
  display: none;
}

h5.section-subtitle {
  font-size: 1.4rem;
  color: #333;
  font-weight: 400
}

table.custom {
  border-collapse: separate;
  background: #fff;
  @include border-radius(5px);
  margin: 10px;
  @include box-shadow(0px 0px 5px rgba(0, 0, 0, 0.3));
}

thead {
  @include border-radius(5px);
}

thead th {

  font-size: 1.1em;
  font-weight: 400;
  color: #333;
  @include text-shadow(1px 1px 0px rgba(0, 0, 0, 0.5));
  text-align: left;
  padding: 20px;
  background-color: #dfe0e7;
  border-bottom: 1px solid #858d99;

  &:first-child {
    @include border-top-left-radius(5px);
  }

  &:last-child {
    @include border-top-right-radius(5px);
  }
}

tbody tr td {

  font-weight: 400;
  color: #5f6062;
  font-size: 13px;
  padding: 20px 20px 20px 20px;
  border-bottom: 1px solid #e0e0e0;

}

tbody tr:nth-child(2n) {
  background: #fff;
}

tbody tr:last-child td {
  border-bottom: none;

  &:first-child {
    @include border-bottom-left-radius(5px);
  }

  &:last-child {
    @include border-bottom-right-radius(5px);
  }
}

tbody:hover>tr td {
  @include opacity(0.5);

  /* uncomment for blur effect */
  /* color:transparent;
  @include text-shadow(0px 0px 2px rgba(0,0,0,0.8));*/
}

tbody:hover>tr:hover td {
  @include text-shadow(none);
  color: #2d2d2d;
  @include opacity(1.0);
}


.nj-gray {
  color: #888888;
}

.fa-twitter-square:hover {
  color: #1da1f2;
}

.fa-facebook-square:hover {
  color: #3b5998;
}

strong {
  font-weight: 500;
}

.nj-nav {
  background-color: #90c2f3 !important;
  font-size: .9375rem;
}

.navbar-dark .navbar-brand {
  color: #000 !important;
}

.nj-nav .navbar-nav .nav-link {
  color: #010103 !important;
  padding-right: .5rem;
  /*Default BT is to go to 0 on collapsed nav this sets this back to desired padding*/
  padding-left: .5rem;
  /*Default BT is to go to 0 on collapsed nav this sets this back to desired padding*/
  font-weight: 400;

}

#navbarSupportedContentona .nav-link.active,
.nj-nav .show>.nav-link,
a.nav-link:hover {
  background-color: #e2eefc !important;
  color: #010103 !important;
  border-radius: .25rem;
}

a.nav-link:active {
  color: #010103;
}


a[aria-expanded=true] .fa-chevron-circle-down {
  display: none;
}

a[aria-expanded=false] .fa-chevron-circle-up {
  display: none;
}

.acc {
  background-color: #90c2f3;

}

.ddhhacc {
  background-color: #fff;
}

.dddacc {
  background-color: #798f4e;
}

.dddaccSub {
  background-color: #1e57A4;
}

.iconClassBlue {
  color: #1e57A4;
}


ul.right-links {
  border: 0 none;
}

.list-group-item {
  position: relative;
  display: block;
  padding: .75rem 1.25rem;
  padding-left: 1.25rem;
  margin-bottom: -1px;
  background-color: #fff;
  border-left: 0 border-top:0 border-right:0 border-bottom:3px solid red;
}

#site-name h1,
#site-name .department {
  color: #cf7129 !important;
  font-size: 2.5rem !important;
  font-weight: bold;
}

#site-name .department .header-subline {
  color: #000000 !important;
  font-size: 1.1rem !important;
  font-weight: 500 !important;
  line-height: 1.5 !important;
}

#site-name img{
  max-width: 21rem;
  height: auto
}

/*----------------- page elements----------*/
#contentHeader {
  color: #798f4e;
}

.bg-blue {
  background-color: #e2eefc;
}

.bg-lblue {
  background-color: #e2eefc;
}

h2.text-green,
#spotlight h2,
#assist h2,
#links h2,
h1.green {
  color: #798f4f !important;
  font-size: 2rem;
}

.icon {
  color: #90c2f3 !important;
}

a.btn-link {
  text-transform: uppercase;
  font-weight: 600;
}

.alert .alert-icon-col {
  min-width: 25px;
  max-width: 25px;
  margin-left: 0;
  padding: 0 !important;

}

.btn-sm {}

#links .card {
  border: 0 none;
  line-heigh: normal;
}

#links .card-img-top {
  border: 1px solid #ccc;
}

#links .card-title {
  font-size: 1.0rem;
  margin-top: 1rem;
}

/*----------------- Carousel----------*/
.carousel.nj iframe {
  ax-height: 598px
}

.carousel-item {
  bottom: 0px;
  background-size: cover;
  background-position: center center;
  height: 100%;
  width: 100%;

}

.carousel-item-card {
  bottom: 0px;
  background-size: cover;
  background-position: center center;
  height: 100%;
  width: 100%;

}

carousel-inner>.carousel-item>img {
  width: 100%;
  /* to make smaller images look full */
}

.carousel.nj .carousel-control-next-icon,
.carousel.nj .carousel-control-prev-icon {
  background-color: rgba(0, 0, 0, .5);
  background-size: 50% 50%;
  border-radius: 1rem;
}

.carousel.nj .carousel-indicators {}

.carousel.nj .carousel-indicators li {
  width: 10px;
  height: 10px;
  margin-right: 3px;
  margin-left: 3px;
  border-radius: 100%;

}

.carousel.nj .carousel-indicators li.active {
  background-color: rgba(0, 0, 0, .75);
  border: 2px solid white;
}


.carousel.nj .carousel-caption,
.carousel.nj .carousel-caption.default {
  background: rgba(0, 0, 0, 0.4);
  position: absolute;
  bottom: 0;
  left: 0;
  right: 0;
  width: 100%;
  align-items: center;
  padding-bottom: 0rem;
}


.carousel.nj .carousel-caption.left {
  width: 25%;
  top: 50%;
  transform: translateY(-50%);
  right: auto;
  left: 15%;
  bottom: auto;
  padding-bottom: 20px;
}

.carousel.nj .carousel-caption.right {
  width: 25%;
  top: 50%;
  transform: translateY(-50%);
  right: 15%;
  left: auto;
  bottom: auto;
  padding-bottom: 20px;
}

.card-img-top,
.img-icon {
  width: 100%;
  height: auto !important;

}

*.card-img-top,
*.img-icon {
  min-height: 0.01px;
}

.object-fit_fill {
  object-fit: fill
}

.object-fit_cover {
  background-size: cover
}

.object-fit_none {
  object-fit: none
}

.object-fit_scale-down {
  object-fit: scale-down
}

.list-unstyled {
  text-indent: 1.5rem;
}

.img-icon {
  max-width: 60px;
  max-height: 80px;
  height: auto;
}

.carousel .btn-primary {
  text-transform: uppercase;
}

.carousel-indicators ul {
  position: absolute;
  bottom: 1rem;
}

/****CSS for social boxes*/
.social-box>h4 {
  color: white;
  margin: 0;
  padding: .7em 1em;
  font-weight: bold;
  text-align: left;
  font-size: 1.2rem;
}

.news-box>h4 {
  background-color: #253341;
}

.facebook-box>h4 {
  background-color: #3b5998;
}

.facebook-box .wrapperfb {
  text-align: center;
}

.twitter-box>h4 {
  background-color: #42a9e9;
}

.social-box>.wrapper {
  border: 1px solid #eef0f1;
  max-height: 500px;
  height: 500px;
  overflow: hidden;
  background-color: #e2eefc;

}

.social-box>.wrapperfb {
  border: 0px solid #eef0f1;
  max-height: 500px;
  height: 500px;
  overflow: hidden;
  background-color: #e2eefc;

}

.biobtn {
  color: #000;
  background-color: #90c2f3;
}

/*CSS for new archives page***/
.press-item {
  display: block;
  padding: 14px;
  overflow: auto;
}

.press-item.odd {
  background-color: #e2eefc;
}

.press-item.even {
  background-color: #fff;
}

.press-item .date {
  display: inline-block;
  background-color: #798f4e;
  color: white;
  border-radius: 10px;
  text-align: center;
  padding: 5px;
  font-weight: bold;
  width: 62px;
  float: left;
  margin-right: 14px;

}

.press-item .date .day {
  display: block;
  background-color: white;
  color: #798f4e;
  border-radius: 10px;
  font-weight: bold;
  font-size: 14px;
  line-height: 28px;
}

.press-item .content {
  float: none;
  /* not needed, just for clarification */
  /* the next props are meant to keep this block independent from the other floated one */
  width: auto;
  overflow: hidden;
}

.press-title {
  font-size: 20px;
}

.right-image {
  border-radius: 0.25rem;
}

/*CSS for new archives page***/
.press-item {
  display: block;
  padding: 14px;
  overflow: auto;
}

.press-item.odd {
  background-color: #e2eefc;
}

.press-item.even {
  background-color: #fff;
}

.press-item .date {
  display: inline-block;
  background-color: #798f4e;
  color: white;
  border-radius: 10px;
  text-align: center;
  padding: 5px;
  font-weight: bold;
  width: 62px;
  float: left;
  margin-right: 14px;

}

.press-item .date .day {
  display: block;
  background-color: white;
  color: #798f4e;
  border-radius: 10px;
  font-weight: bold;
  font-size: 14px;
  line-height: 28px;
}

.press-item .content {
  float: none;
  /* not needed, just for clarification */
  /* the next props are meant to keep this block independent from the other floated one */
  width: auto;
  overflow: hidden;
}

.press-title {
  font-size: 20px;
}

.right-image {
  border-radius: 0.25rem;
}

.infobox .list-group-flush:last-child .list-group-item:last-child {
  border-bottom: 1px solid red !important;
}


@include media-breakpoint-up(xs) {
  h2.h2title {
    color: #01365e;
    font-size: 1.3rem;
    font-weight: 400, margin-top:3rem;
    text-transform: uppercase;
    font-weight: 400;
  }
}

@include media-breakpoint-up(sm) {
  h2.h2title {
    color: #01365e;
    font-size: 1.3rem;
    font-weight: 400, margin-top:3rem;
    text-transform: uppercase;
    font-weight: 400;
  }
}

@include media-breakpoint-up(md) {
  ...
}

@include media-breakpoint-up(lg) {
  ...
}

@include media-breakpoint-up(xl) {
  ...
}


@import url('https://fonts.googleapis.com/css?family=Roboto:300,400,500');

body {
  font-family: 'Roboto', sans-serif;
  margin: 0px;
  font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;

}



/*SoNJ Alert*/
.sonj-alert {}

.sonj-alert.alert {
  border: 0px;
  color: #000;
  border-radius: 0px;
  margin: 0px;
}

.sonj-alert.alert .red {
  color: #E62139;
}

.sonj-alert.alert h1 {
  font-size: 1.25rem;
  margin-bottom: 0px;
}

.sonj-alert .alert-close {
  font-size: .875rem;
  color: #000;
}

.banner-top a:link {
  color: #fff;
  outline: none;
  text-decoration: underline;
}

.banner-top a:hover {
  color: #fff;
  outline: none;
  text-decoration: underline;
}

.banner-btm a:link {
  color: #111;
  outline: none;
  text-decoration: none
}

.banner-btm a:hover {
  color: #111;
  outline: none;
  text-decoration: underline;
}

.home-card,
.card0,
.card1,
.card2,
.card3 {
  background-color: transparent !important;
  border: 0px !important;
}

.border-blue {
  border-top: 7px solid #115e8f !important;
  background-color: #f5f6f6 !important;
  padding-top: 2rem !important;
  padding-bottom: 0rem !important;
}

.card-gray {
  background-color: #f5f6f6;
}



blockquote {

  position: relative;
  margin: 0.5em;
  padding: 1em 0em 1.5em 0em;

  font-size: 1.17rem !important;

}

blockquote:before {
  font-family: Georgia, serif;
  position: absolute;

  font-size: 5em;
  line-height: 1;
  top: -1.9rem;
  left: 0;
  content: "\201C";
  color: #cf7129;
}

blockquote:after {
  font-family: Georgia, serif;
  position: absolute;
  /* display: block; don't use this, it raised the quote too high from the bottom - defeated line-height? */
  float: right;
  font-size: 5em;
  line-height: 1;
  right: 0;
  bottom: -0.6em;
  content: "\201D";
  color: #cf7129;
}

blockquote footer {
  padding: 0 2em 0 0;
  text-align: left;
  font-size: 1em !important;
  margin: 0;
}

/*blockquote cite:before {
    content: "\2013";
} */


.text-orange {
  color: #cf7129 !important;
}

.bg-darkblue {
  background-color: #115e8f !important;
  color: #fff;
}

.bg-gray {
  background-color: #f5f6f6;
  color: #111;
}

.bg-white {
  background-color: #ffffff;
  color: #111;
}

.bg-gray h2 {
  color: #f68936;
}

.bg-white h2 {
  color: #195f92;
}

.bg-orange {
  background-color: #f68936
}

.banner-top a:link {
  color: #fff;
  outline: none;
  text-decoration: underline
}

.banner-top a:hover {
  color: #fff;
  outline: none;
  text-decoration: underline;
}

.banner-btm a:link {
  color: #111;
  outline: none;
  text-decoration: underline
}

.banner-btm a:hover {
  color: #111;
  outline: none;
  text-decoration: underline;
}

.btn-outline-warning {
  color: #115e8f;
  background-color: #ffffff !important;
  border: 2px solid #f68936;
}

#site-name figcaption {
  font-size: 1.1rem !important;
  color: #222;
  font weight: 500 !important
}

span.h5 {}

}

.caption-small {
  font-weight: 500
}

.accordion a:link,
.accordion a:visited,
.accordion a:active,
.accordion a:hover {
  text-decoration: none !important;
}

.ddhhacc {
  background-color: #fff;
}

.dddacc {
  background-color: #fff;
}

.dddaccSub {
  background-color: #93c1e7
}

.dddaccSub .card-body {
  background-color: #fff;
}

.icon-orange {
  color: #cf7129;
}

.icon-blue {
  color: #93c1e7 !important;
}

.accordianAnc {
  color: #000;
}

.dddaccHeader {
  background-color: #fff;
  border-top: 1px solid rgba(0, 0, 0, .125);
  border-top: 1px solid rgba(0, 0, 0, .125);
  border-right: 1px solid rgba(0, 0, 0, .125);
  border-left: 7px solid #195f92;
}

a.accordianDDDAnc h5,
a.accordianDDDAnc:hover h5 {
  color: #000;
  text-decoration: none !important;
}

.accordianDDDAnc h6 {
  color: #000;
}

#accordionTab th {
  font-size: 0.95rem !important;
  font-weight: 400;
  background-color: #e2e1e1 !important;
}

.lead,
.lead p {
  font-size: 1.4rem;
  font-weight: 500;
}


/*Header*/
header.sonj {
  background-color: #363636;
  color: #fff;
  padding: 4px 0;
  z-index: 1;
  margin-bottom: 0px;
}

header.sonj #logo img {
  padding: 0;
  margin: 0 5px 0 0px;
  max-height: 41px;
  display: inline-block;
}

header.sonj #logo h1 {
  font-size: .75rem;
  margin: 0;
  padding: 0 0 0 0;
  line-height: 1;
  width: auto;
  font-weight: normal;
  text-transform: uppercase;
  color: #fff;
}

header.sonj a {
  color: #fff;
}


header.sonj .gov-bar {
  font-size: .9375rem;
  font-weight: 500;
}

header.sonj .social {
  font-size: .875rem;
  font-weight: 300;
}

header.sonj ul.statewide {
  margin: 0px;
}

header.sonj ul.statewide li {
  border-right: 1px solid #fff;
  font-size: 14px;
  display: inline-block;
  margin: 0;
  padding: 0 6px;
}

header.sonj ul.statewide li:last-of-type {
  border-right: none;
  margin-right: 0;
  padding-right: 0;
}

header.sonj .statewide {
  position: relative;
}

header.sonj .statewide .drop {
  position: absolute;
  right: 0px;
  /*top: 35px;*/
  background: #363636;
  width: 500px;
  display: none;
  z-index: 10;
}

/*XS only*/
@media screen and (max-width: 575px) {
  body header.sonj .statewide .drop {
    max-width: 100%;
  }
}

header.sonj .statewide .drop button.drop-close {
  color: #999999;
}

header.sonj .statewide .drop p.disclaimer {
  float: left;
  clear: left;
  width: 100%;
  text-align: left;
}

header.sonj .statewide .drop #google_translate_element {
  float: left;
  clear: left;
  width: 100%;
}

.goog-te-combo.form-control {
  max-height: 2.125rem;
}




/*Navigation*/


.navbar-dark .navbar-brand {
  color: #000;
}

.sonj-nav,
.reachnj-nav {
  background-color: #ffff;
  font-size: .9575rem;
  color: #10537e !important
}

h2 a.navbar-brand {
  color: #363636;
}

.reachnj-nav .navbar-nav a.nav-link;
.reachnj-nav .navbar-nav h2 a.nav-link;

  {
  color: #10537e !important;
  outline: none;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 400;
}
}

.reachnj-nav .navbar-nav a.nav-link:hover {
  color: #ffffff !important;
  outline: none;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 400;
}
}

.sonj-nav {
  background-color: #90c2f3 !important;
  font-size: .9375rem;
}

.sonj-nav .navbar-brand {
  /* color: #10537e !important; */
}

.navbar-dark .navbar-brand:focus,
.navbar-dark .navbar-brand:hover {
  color: #363636;
}

.sonj-nav .navbar-nav .nav-link {
  color: #10537e;
  outline: none;
  text-decoration: none;
  text-transform: uppercase;
  font-weight: 500;
  padding-right: 1rem;
  /*Default BT is to go to 0 on collapsed nav this sets this back to desired padding*/

  padding-left: 1rem;
  /*Default BT is to go to 0 on collapsed nav this sets this back to desired padding*/
}

.sonj-nav .nav-link.active,
.sonj-nav .show>.nav-link,
.sonj-nav .nav-link:hover {
  color: #ffffff !important;
  outline: none;
  text-decoration: none;
  text-transform: uppercase;
  /* font-weight: 400; */
  background: #10537e !important;
  border-radius: .25rem;
  padding-right: 1rem;
  /*Default BT is to go to 0 on collapsed nav this sets this back to desired padding*/

  padding-left: 1rem;
  /*Default BT is to go to 0 on collapsed nav this sets this back to desired padding*/
}

.navbar-dark .navbar-toggler {
  color: rgba(0, 0, 0, 1);
  border-color: rgba(0, 0, 0, 1);
}


.navbar-dark .navbar-toggler-icon {
  background-image: url(/humanservices/reachnj/assets/css/"data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http:/www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");
}

.sonj-nav .dropdown-item:focus,
.sonj-nav .dropdown-item:hover {

  color: #fff;
  text-decoration: none;
  background-color: #195f92;

}

li.dropdown-item:hover {
  background-color: #195f92;
}


/*FOOTER*/
footer.nj {
  background-color: #363636 !important;
  padding: 15px 0;
  color: #fff !important;
  font-size: 1rem !important;
  font-weight: 300 !important;
}

footer.site {
  background: #115e8f !important;
  padding: 15px 0;
  color: #fff !important;
  font-size: 1rem !important;
  margin-top: 30px;
  font-weight: 300 !important;
}


.footer.site ul.statewide a {
  color: #ffffff !important;
  font-weight: 500 !important;
  font-size: 14px !important;
}


.footer.site h3 {
  padding: 20px 0 10px 0px;
  color: #fff !important;
  width: 100%;
  border-bottom: 2px solid #fff !important;
  font-size: 1.25rem !important;
  ;
}

.footer.site h3 a,
.footer.site .columned a {
  color: #ffffff !important;
}



.footer.site .columned>ul>li>h5 {
  border-bottom: 1px solid #fff !important;
  font-size: 1rem;
  font-weight: 500;
}



/*column solution for footer*/










.navbar-brand,
h2 a {
  color: #010103;

  margin-right: 0px;
  white-space: normal;
}

}



@media (min-width: 1301px) {



  // Extra small devices (portrait phones, less than 576px)
  @media (max-width: 575.98px) {

    .navbar-brand,
    h2 a {
      color: #010103;

      margin-right: 0px;
      white-space: normal;
    }

    .lead p {
      margin-0;
      padding: 0;
    }
  }

  // Small devices (landscape phones, less than 768px)
  @media (max-width: 767.98px) {
    .banner-top h3 {
      font-size: 1.1rem;
    }

    .home-card,
    .card0,
    .card1,
    .card2,
    .card3 {
      width: 95% !important;
    }

    .card0 h2.mb-5 {
      margin-bottom: 2rem !important;
    }

    .card1 h2.mb-5 {
      margin-bottom: 2rem !important;
    }

    .card2 h2.mb-5 {
      margin-bottom: 2rem !important;
    }

    .navbar-brand,
    h2 a {
      color: #010103;

      margin-right: 0px;
      white-space: normal;
    }

    .lead p {
      margin-0;
      padding: 0;
    }

  }

  // Medium devices (tablets, less than 992px)
  @media (max-width: 991.98px) {

    .home-card,
    .card0,
    .card1,
    .card2,
    .card3 {
      width: 95% !important;
    }

    .banner-top h3 {
      font-size: 1.1rem;
    }
  }

  // Large devices (desktops, less than 1200px)
  @media (max-width: 1199.98px) {

    .home-card,
    .card0,
    .card1,
    .card2,
    .card3 {
      width: 75% !important;
    }
  }


  @media (min-width: 576px) and (max-width: 767.98px) {

    .home-card,
    .card0,
    .card1,
    .card2,
    .card3 {
      width: 95% !important;
    }

    .card0 .mb-5 {
      margin-bottom: 2rem !important;
    }

    .card1 .mb-5 {
      margin-bottom: 2rem !important;
    }

    .card2 .mb-5 {
      margin-bottom: 2rem !important;
    }

    .navbar-brand,
    h2 a {
      color: #010103;

      margin-right: 0px;
      white-space: normal;
    }
  }

  ul .text-right {
    text-align: left !important;
  }

  .banner-top h3 {
    font-size: 1.1rem;
  }
}


.nj-nav .navbar-toggler {
  color: rgba(255, 255, 255, 1);
  border-color: rgba(255, 255, 255, 1);
  margin-left: auto;
}

.nj-nav .navbar-toggler-icon,
.reachnj .navbar .navbar-toggler .navbar-toggler-icon {
  background-image: url(/humanservices/reachnj/assets/css/"data:image/svg+xml;charset=utf8,%3Csvg viewBox='0 0 30 30' xmlns='http:/www.w3.org/2000/svg'%3E%3Cpath stroke='rgba(0,0,0, 1)' stroke-width='2' stroke-linecap='round' stroke-miterlimit='10' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E") !important;
}

.nj-nav .dropdown-item:focus,
.nj-nav .dropdown-item:hover {

  color: #010103;
  text-decoration: none;
  background-color: #e2eefc;

}

.sonj-nav .navbar-nav .nav-link {
  color: #10537e !important;
}

.sonj-nav .navbar-nav .nav-link.active {
  color: #ffffff !important;
}

.sonj-nav .navbar-nav .nav-link:hover {
  color: #ffffff !important;
}

.reachnj.department-level {
  color: #ffffff !important;
}

@media (max-width: 991px) {
  .reachnj.department-level {
    background-color: var(--nav-blue);
    color: #ffffff !important;
  }
}

.nj-nav .navbar-toggler,
.reachnj .navbar .navbar-toggler {
  color: #000000 !important;
  border-color: #000000 !important;
  padding: .25rem .75rem !important;
  font-size: 1.25rem !important;
}

.reachnj  .navbar .navbar-nav .nav-item.dropdown.pr-4.show>a {
  color: #ffffff !important;
}

footer.site, footer .site-footer {
  margin-top: 0 !important;
  background: #115e8f !important;
}

.reachnj .navbar .nav-item .nav-link:focus-visible {
  outline: 0.125rem solid #000000 !important;
  border-radius: 0.25rem;
}

a:focus-visible {
  outline: 0.125rem solid #000000 !important;
  border-radius: 0.25rem;
}

.h1, .h2, .h3, .h4, .h5, .h6, h1, h2, h3, h4, h5, h6, p {
  line-height: 1.5 !important;
}

main .blockquote-footer {
  color: #687179 !important;
}

.fentanyl-list-border-right {
  border-right: 3px solid #000000;
}

@media (max-width: 767px) {
  .fentanyl-list-border-right {
    border-right: none;
  }
  .fentanyl-section .col-12.col-md-4 {
  order: 2;
}
}

.fentanyl-banner-wrapper .fentanyl-banner-img {
  background-image: url("/humanservices/reachnj/library/friends.jpg");
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  height: 30rem;
  min-height: 100%;
}

.fentanyl-banner-wrapper .fentanyl-banner-text {
  background-color: #FCD416;
  padding: 2rem 2.5rem;
}

.fentanyl-banner-wrapper .fentanyl-banner-text .section-title,
.fentanyl-banner-text .section-title {
 background-color: #000 !important;
 color: #ffffff;
 padding: 0.75rem 1rem;
 margin-bottom: 0.25rem !important;
}

.fentanyl-banner-wrapper .fentanyl-banner-header{
  background-color: #000000 !important;
  color: #ffffff !important;
}