/* ============================================
   NJDOC CUSTOM STYLES (extracted from bootstrap-4.0.0_DOC.css)
   ============================================ */

/* --- Layout / footer helpers --- */
#page-container { position: relative; min-height: 100vh; }
#content-wrap { padding-bottom: 2.5rem; }
#footer { position: absolute; bottom: 0; width: 100%; height: 2.5rem; }
.New-DOC-Fixed-footer { position: fixed; left: 0; bottom: 0; width: 100%; }

/* --- Carousel captions (custom variants) --- */
.carousel-caption-20 {
  position: absolute; right: 15%; bottom: 60px; left: 15%; z-index: 10;
  padding-top: 20px; padding-bottom: 20px; color: #fff; font-size: 25pt; text-align: center;
}
.carousel-caption-DOC-LEFT {
  position: absolute; right: 20%; bottom: 30px; left: 10%; z-index: 10;
  padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: left;
}
.carousel-caption-DOC-RIGHT {
  position: absolute; right: 20%; bottom: 20px; left: 20%; z-index: 10;
  padding-top: 20px; padding-bottom: 10px; color: #fff; text-align: right;
}
.carousel-caption-NEWS12 {
  font-family: Gotham, "Helvetica Neue", Helvetica, Arial, "sans-serif";
  font-size: 2vw; position: relative; right: 20%; bottom: 30px; left: 10%; z-index: 10;
  padding-top: 20px; padding-bottom: 20px; color: #fff; text-align: left;
}

/* --- Forms --- */
.form-group.required .control-label:after { content: "*"; color: red; }

/* --- Google Translate widget --- */
header.sonj .statewide .drop #google_translate_element { float: left; clear: left; width: 100%; }
.goog-te-combo.form-control { max-height: 2.125rem; }

/* --- Dropdown submenu (multi-level menus) --- */
.dropdown-submenu { position: relative; }
.dropdown-submenu > .dropdown-menu {
  top: 0; left: 100%; margin-top: -6px; margin-left: -1px;
  border-radius: 0 6px 6px 6px;
}
.dropdown-submenu:hover > .dropdown-menu { display: block; }
.dropdown-submenu > a:after {
  display: block; content: " "; float: right; width: 0; height: 0;
  border-color: transparent; border-style: solid; border-width: 5px 0 5px 5px;
  border-left-color: #ccc; margin-top: 5px; margin-right: -10px;
}
.dropdown-submenu:hover > a:after { border-left-color: #fff; }
.dropdown-submenu.pull-left { float: none; }
.dropdown-submenu.pull-left > .dropdown-menu {
  left: -100%; margin-left: 10px; border-radius: 6px 0 6px 6px;
}

/* --- Cards --- */
.doc-card-img-top {
  border-top-left-radius: calc(0.25rem - 1px);
  border-top-right-radius: calc(0.25rem - 1px);
}
.card-header .fa { transition: .3s transform ease-in-out; }
.card-header .collapsed .fa { transform: rotate(180deg); }

/* --- Buttons --- */
.btn-DOC { color: #ffffff; background-color: #003366; border-color: #003366; }

/* --- Sticky social --- */
.sticky-social { position: fixed; right: 0px; top: 25%; z-index: 10; }
.sticky-social a {
  float: right; clear: right; background-color: rgba(255,255,255,1);
  padding: 0px .75rem 0 3px; margin-bottom: 1px; margin-right: 0;
}
.sticky-social a.toggle-sticky { padding-left: 17px; }
.sticky-social a:first-child { border-radius: 5px 0px 0px 0px; }
.sticky-social.closed a:first-child { border-radius: 5px 0px 0px 5px; padding-left: 3px; }
.sticky-social a:last-child { border-radius: 0px 0px 0px 5px; }

/* --- Blog carousel indicators --- */
.blog .carousel-indicators { left: 0; top: auto; bottom: -5px; }
.blog .carousel-indicators li { background: #FFFF00; border-radius: 0%; width: 25px; height: 8px; }
.blog .carousel-indicators .active { background: orange; }

/* --- Custom tables --- */
.table-DOC { max-width: 100%; margin-bottom: 1rem; background-color: transparent; }
.table-DOC .thead-dark-DOC th { color: #fff; background-color: #003366; border-color: #32383e; }

/* --- Custom background colors --- */
.bg-docOrange { background-color: #DD8A00; }
a.bg-docOrange:hover { background-color: #DD8A00 !important; }
.bg-docBlue { background-color: #003366; }
a.bg-docBlue:hover { background-color: #1d2124 !important; }

/* --- Custom carousel indicators --- */
.carousel-indicators li {
  border-radius: 12px; width: 12px; height: 12px;
  text-indent: -999px; background-color: gray;
}
.carousel-indicators .active { background-color: darkorange; }
.carousel-indicators { bottom: -15px; }  /* stock is 15px (positive) */

/* --- Custom Link Hover Overwrite  --- */
a { color: #0000EE; text-decoration: none; background-color: transparent; }
a:hover { color: #F0612A; }  /* orange hover */

/* --- Custom Nav Bar Overwrite to white --- */
.navbar-dark .navbar-nav .nav-link { color: white; }
.navbar-dark .navbar-text { color: white; }

/* --- Custom Dark Background Overwrite --- */
.bg-dark { background-color: #003366; }

/* --- Custom Container max-width at XL Stock is 1140px. --- */
@media (min-width: 1200px) {
  .container { max-width: 95%; }
}

/* --- Custom Navbar-collapse flex-basis Minor tweak from 100%: --- */
.navbar-collapse { -ms-flex-preferred-size: 90%; }
(Note: this only affects old IE/Edge -ms- prefix; modern browsers use the flex-basis: 100% that follows it, so this edit is nearly a no-op. You can skip it.)

/* --- Custom Card body padding Stock is 1.25rem. --- */
.card-body { padding: 0.5rem; }

/* --- Custom .nav-item > li padding Non-standard selector, likely custom: --- */
.nav-item > li { padding-left: 50px; padding-right: 50px; }