/* === START: utilities — spacing, sizing, color helpers, tables, misc === */

/* pads and spacing adjustments */
.pt-6   {padding-top:3.5rem!important;}
.pt-7   {padding-top:4rem!important;}
.pb-7   {padding-bottom:4rem!important;}
.pb-8   {padding-bottom:4.5rem!important;}
.pb-9   {padding-bottom:5rem!important;}
.pb-10  {padding-bottom:5.5rem!important;}
.px-6   {padding-left:3.5rem!important;padding-right:3.5rem!important;}
.py-6   {padding-top:3.5rem!important;padding-bottom:3.5rem!important;}
.py-10  {padding-top:5.5rem!important;padding-bottom:5.5rem!important;}
.px-10  {padding-left:5.5rem!important;padding-right:5.5rem!important;}

.mt-6   {margin-top:3.5rem!important;}
.mt-7   {margin-top:4rem!important;}
.mb-6   {margin-bottom:3.5rem!important;}
.mb-8   {margin-bottom:4.5rem!important;}

.h-34px { height: 34px !important; }
.h-80px { height: 80px !important; }
.h-100px { height: 100px !important; }
.h-1rem { height: 1rem !important; }
.fhpx-5 { height: 5px !important; line-height: 5px !important;}
.fhpx-5 td {padding: 0 !important;font-size: 0 !important;}
.fhpx-10 { height: 10px !important; line-height: 10px !important;}
.fhpx-10 td {padding: 0 !important;font-size: 0 !important;}
.min-h-9em { min-height:9em; }
.min-h-38px { min-height: 38px; }
.min-h-300px { min-height: 300px; }
.max-h-80px { max-height: 80px; }
.max-vh-35 { max-height: 35vh; }
.max-vh-55 { max-height: 55vh; }
.max-vh-65 { max-height: 65vh; }

#awardsOffered {
  table-layout:fixed;
  width:100%;
  border-collapse:collapse;
}

#awardsOffered td {
  box-sizing: border-box; /* Makes width calculations include padding/borders */
}

.vh-25 { height: 25vh; }
.vh-35 { height: 35vh; }
.vh-50 { height: 50vh; }
.vh-65 { height: 65vh; }
.vh-75 { height: 75vh; }

.top-150 { top: 150px; }

.z-index-neg-9999 { z-index: -9999; }

.overflow-ellipsis { text-overflow: ellipsis; white-space: nowrap; overflow: hidden; }

.table>:not(caption)>*>* {border-bottom-width:0px;}/*bs 5 moved default td border to bottom - this sets it to 0 */
.table td {border-top: 1px solid var(--bs-gray-300);} /* bs5 removed top border this restores top border on td */
.table .table-borderless td {border-top: none;} /* removes border top if table-borderless is specified on table */

.last-row-border-bottom tbody tr:last-child td {
  border-bottom: var(--bs-border-width) var(--bs-border-style) var(--bs-border-color) !important;
}


.medium {font-size:0.875rem; line-height:1.5}
.text-1rem {font-size:1.0rem !important}
.text-sizeadjust-sm { font-size:0.875rem; line-height:1.5 }
/*.text-sizeadjust-lg-1 { font-size: 1.2rem; }*/
.text-sizeadjust-lg-1 {font-size: clamp(1.05rem, 1.02rem + 0.3vw, 1.12rem); };
.text-larger  { font-size: 1.25rem !important; }  /* 125% → 1.25rem */
.text-large   { font-size: 1.75rem; }
.text-medium  { font-size: 0.92rem !important; line-height: 1.6; }
.text-small   { font-size: 0.85rem !important; }
.text-smaller { font-size: 0.75rem !important; }
.text-xsmall  { font-size: 0.60rem !important; }
.text-sm      {font-size: 14px !important;}
.text-12px    {font-size: 12px !important;}
.text-white-normal { color: #ffffff !important; font-weight:normal !important;}



.text-fixed16 {font-size:16px;line-height:28px}

/* size adjustments */
.xx-small     {font-size: 0.65rem!important}
.x-small      {font-size: 0.75rem!important} /* default small is .875 */
.large        {font-size: 1.2rem!important}
.x-large      {font-size: 1.4rem!important}
.xx-large     {font-size: 2.2em!important}
.xxx-large    {font-size: 3em!important}
.large-pct    {font-size: 125%!important;}
.text-lead    {font-size: 1.0625rem!important}
.text-defalt-sz {font-size:1.0rem!important}

p.small {line-height:1.35;}
div.help-text {line-height:1.35;}

label.small {font-size:0.95rem!important;}

.text-height-0 {line-height: 1!important;}
.text-height-1 {line-height: 1.5!important;}
.text-height-2 {line-height: 2!important;}
.text-height-3 {line-height: 2.5!important;}
.text-height-4 {line-height: 3!important;}
.text-height-5 {line-height: 3.5!important;}

sup>i {
  font-size:9px;
}

#termsModal h3 {font-size:1.0rem;line-height:1.5}
#termsModal p  {font-size:0.875rem;line-height:1.5}

.text-strikeout {text-decoration: line-through;}
.text-underline {text-decoration: underline;}

#studentAvailableActions a {text-decoration: underline;}

.vertical-center {
  display: flex;
  align-items: center;
}

.alert-bonus     { background-color:rgba(243,243,243,.4); border-color:var(--site-base-500); color:rgb(33,37,41) !important }
.alert-cactus    { background-color:#164A41; border-color:#041f1a; color:#FFFFFF !important }
.alert-caribbean { background-color:#07ABA0; border-color:#057f77; color:#ffffff !important }
.alert-dksage    { background-color:#036A96; border-color:#01405b; color:#ffffff !important }
.alert-dksage a  {color: var(--site-base-500) !important}
.alert-dksage a:hover {color: var(--site-base-400) !important}
.alert-fuscia    { background-color:#e32040; border-color:#a51930; color:#ffffff !important }
.alert-ltsage    { background-color:var(--site-base-100); border-color:var(--site-base-500); color:#1b1e21 !important }
.alert-mango     { background-color:var(--site-base-500); border-color:var(--site-base-600); color:#ffffff !important }
.alert-mustard   { background-color:#e4b809; border-color:#b69d3b; color:#ffffff !important }
.alert-rsc       { background-color:var(--site-base-100); border-color:var(--site-base-500); color:#3f3825 !important }
.alert-steel     { background-color:#444b55; border-color:#333a44; color:#ffffff !important }
.alert-tomato    { background-color:#e44b09; border-color:#db4f04; color:#ffffff !important }

/* .badge-* live in style.css (token-based) */

.badge--alerts {
  font-size: 14px;
  padding: 2px 8px;
  border: 1px solid #e32040;
  border-radius: 10px;
  position: absolute;
  left:4px;
}

.badge--warning {
  background: #e32040;
  border-color: #e32040;
  color:#FFFFFF;
}

.bg-altsage       {background-color:var(--bs-altsage)!important;}
.bg-black         {background-color:#151b25!important;}
.bg-dkblue        {background-color:#00467f!important;}
.bg-dkdkblue      {background-color:#1c2535!important;}
.bg-foggy         {background-color:#e6e6eb!important;}
.bg-gray100       {background-color:var(--bs-gray-100,inherit)!important;}
.bg-gray200       {background-color:var(--bs-gray-200,inherit)!important;}
.bg-gray300       {background-color:var(--bs-gray-300,inherit)!important;}
.bg-gray400       {background-color:var(--bs-gray-400,inherit)!important;}
.bg-gray500       {background-color:var(--bs-gray-500,inherit)!important;}
.bg-gray600       {background-color:var(--bs-gray-600,inherit)!important;}
.bg-gray700       {background-color:var(--bs-gray-700,inherit)!important;}
.bg-gray800       {background-color:var(--bs-gray-800,inherit)!important;}
.bg-gray900       {background-color:var(--bs-gray-900,inherit)!important;}
.bg-sage          {background-color:var(--bs-sage,inherit)!important;}
.bg-royal-mid     {background-color:var(--bs-royal-mid,inherit)!important;}
.bg-sage-subtle   {background-color:var(--bs-sage-bg-subtle,inherit)!important;}
.bg-ltgray        {background-color:rgba(240,240,240,1)}
.bg-mango         {background-color:var(--site-base-500)!important;}
.bg-mint          {background-color:#daf7e4!important;}
.bg-prime         {background-color:var(--bs-prime,inherit)!important;}
.bg-danger-subtle {background-color:var(--bs-danger-bg-subtle,inherit)!important;}

.bg-salmon        {background-color:#e35959!important;}
.bg-steel         {background-color:#444b55!important;}
.bg-link-red      {background-color:rgba(204,0,0,0.2)!important;}
.bg-link-warning  {background-color:rgba(var(--site-base-500-rgb),0.25)!important;}
.bg-sage-lightest {background-color:rgba(var(--site-base-500-rgb),.12)!important;}

.bg-mcag          {background-color:#8CC63F!important;}
.bg-pale          {background-color:var(--bs-bg-pale,inherit)!important;}
.bg-royal         {background-color:var(--bs-royal,inherit)!important;}
.bg-platinum      {background-color:#F1F1E6!important;}

.border-sage  {border-color: var(--bs-sage,inherit) !important;}
.border-royal {border-color: var(--bs-royal,inherit) !important;}
.border-gray600 {border-color: var(--bs-gray-600,inherit) !important;}
.border-mango {border-color: var(--site-base-500) !important;}
.border-form-header {border-color:var(--site-base-500) !important; border-width: 3px !important; }
.border-top-gray400 {border-top: 2px solid var(--bs-gray-400)}
.border-top-mango {border-top: 2px solid var(--site-base-500)}
.border-bottom-mango {border-bottom: 2px solid var(--site-base-500)}
.border-left-mango {border-left: 3px solid var(--site-base-500)}
.border-2 {border-width:2px !important;}
.border-3 {border-width:3px !important;}

.border-left-sage-2   {border-left: 2px solid rgb(255,183,0)}
.border-left-mango-2  {border-left: 2px solid rgb(255, 183, 0)}

.border-dashed { border-style: dashed !important; }

.border-form-default  {
  border-top:4px solid rgb(255,183,0);
  border-right:1px solid rgb(255,183,0);
  border-bottom:1px solid rgb(255,183,0);
  border-left:1px solid rgb(255,183,0);
}

.border-gradient-blue-right {
  border-right: 2px solid transparent;
  border-image-source: linear-gradient(to bottom,rgba(var(--site-base-500-rgb),1) 0%,rgba(var(--site-base-500-rgb),0.4) 100%);
  border-image-slice: 1;
}
.border-gradient-blue-top {
  border-top: 2px solid transparent;
  border-image-source: linear-gradient(to right,rgba(var(--site-base-500-rgb),1) 0%,rgba(var(--site-base-500-rgb),0.4) 100%);
  border-image-slice: 1;
  margin: 2rem 0;
}

.border-gradient-blue-top-2 {
  border-top-width: 3px;
  border-top-style: solid;
  border-image: linear-gradient(to right,rgb(255,255,255) 8%, rgba(var(--site-base-500-rgb),1) 15%, rgb(9,131,208) 80%, rgb(255,255,255) 92%) 1;
  margin: 2.5rem 0 1rem 0;
}



.border-gradient-blue-left {
  border-left: 2px solid transparent;
  border-image-source: linear-gradient(to bottom,rgba(var(--site-base-500-rgb),1) 0%,rgba(var(--site-base-500-rgb),0.4) 100%);
  border-image-slice: 1;
}

.gradient-blue-left-2 {
  border-left-width:2px;
  border-left-style: solid;
  border-image: linear-gradient(rgb(255,255,255) 20%, rgba(var(--site-base-500-rgb),1) 45%, rgb(9,131,208) 50%, rgb(255,255,255) 80%) 20;
}

.text-normal         {font-size: calc(15px + 1.1 * ((100vw - 320px) / 680)); line-height:1.65em;color:var(--bs-base-color,inherit)!important;}
.text-color-default  {color:var(--bs-base-color,inherit)!important;}
.text-mango          {color:var(--site-base-500)!important;}/* mango discrepancy!  AG has ffb700 and Ive been using ffae00 */
.text-royal          {color:var(--bs-royal,inherit)!important;}
.text-royal-soft     {color:var(--bs-royal-soft,inherit) !important;}
.text-orange         {color:#ff8400!important;}
.text-salmon         {color:#e35959!important;}
.text-gray           {color:var(--bs-altsage)!important;}
.text-gray5          {color:var(--bs-gray-500)!important;}
.text-gray7          {color:var(--bs-gray-700)!important;}
.text-green          {color:var(--bs-green,inherit);}
.text-fuscia         {color:#e32040!important;}
.text-red            {color:#ff001e!important;}
.text-orangered      {color:orangered!important;}
.text-indigo         {color:indigo!important;}
.text-prime          {color:#036A96!important;}
.text-link           {color:var(--site-sage-link)!important;}
.text-dkblue         {color:#00467f!important;}
.text-bonus          {color:#009966!important; font-weight: 700; font-size: 75%; }
.text-mcag           {color:#8CC63F!important;}
.text-gray300        {color:var(--bs-gray-300,inherit);}
.text-gray400        {color:var(--bs-gray-400,inherit);}
.text-gray500        {color:var(--bs-gray-500,inherit);}
.text-gray600        {color:var(--bs-gray-600,inherit);}
.text-gray700        {color:var(--bs-gray-700,inherit);}

.btn-dkgray {background-color:var(--bs-altsage); color:white;}
.btn-dkgray:hover {border-color:var(--bs-altsage); color:var(--bs-altsage);}

.btn-input {
  background-color: rgb(255,255,255);
  color:rgb(58,77,89)!important;
  border-color:rgb(216,216,216);
}
.btn-input:hover, .btn-input-dark:hover {
  border-color:rgb(104,104,104);
}
.btn-input-dark {
  background-color: rgb(255,255,255);
  color:rgb(33,37,41)!important;
  border-color:rgb(216,216,216);
}
.btn-input-dark.has-selections {
  background-color: rgb(175,230,255)!important;
}

/* font sizing responsive for college search page */
@media (max-width: 991.98px){
  #college-search-header .saved-colleges-link{ font-size:1.30rem; }   /* h5 */
  #college-search-header .college-search-title{ font-size:1.30rem; }
}

/* sm (and below) → h6 size */
@media (max-width: 767.98px){
  #college-search-header .saved-colleges-link{ font-size:1.15rem; }      /* h6 */
  #college-search-header .college-search-title{ font-size:1.15rem; }
}



table.table tr.primary-contact {background-color:#00aa6440 !important}
table.table tr.self-contact {background-color:#baeaff40 !important}

/* broker agent classes - there are more in nav menu classes too */
table.agent-product-list td {vertical-align: middle!important;}
td.bg-late-4 {--bs-table-bg: rgba(220, 53, 69, 0.15) !important;}
td.bg-late-3 {--bs-table-bg: rgba(255, 193, 7, 0.18) !important;}
td.bg-late-2 {--bs-table-bg: rgba(255, 140, 0, 0.12) !important;}
td.bg-late-1 {--bs-table-bg: rgba(220, 53, 69, 0.05) !important;}
.table tbody tr:hover td.bg-late-1,
.table tbody tr:hover td.bg-late-2,
.table tbody tr:hover td.bg-late-3,
.table tbody tr:hover td.bg-late-4 { filter: brightness(1.05);}
td.bg-late-1,td.bg-late-2,td.bg-late-3,td.bg-late-4 {
  border-top: 1px solid var(--bs-table-border-color) !important;
  border-bottom: 1px solid var(--bs-table-border-color) !important;
  border-left: 1px solid var(--bs-table-border-color) !important;
  border-right: 1px solid var(--bs-table-border-color) !important;
}
td.update-icon { border-right: 0 !important;}
td.update-icon.bg-late-1,
td.update-icon.bg-late-2,
td.update-icon.bg-late-3,
td.update-icon.bg-late-4 {border-right: 0 !important;}
td.update-date { border-left: 0 !important;}
td.update-date.bg-late-1,
td.update-date.bg-late-2,
td.update-date.bg-late-3,
td.update-date.bg-late-4 { border-left: 0 !important;}


/* 2026 newsroom newsroom-section-bg */
.newsroom-section-bg {
  background-color: var(--site-base-100);
  border: 1px solid rgba(var(--site-base-500-rgb), 0.1);
  border-radius: 6px;
  transition: border-color 0.2s, box-shadow 0.2s;
}

.newsroom-section-bg:hover {
  border-color: rgba(var(--site-base-500-rgb), 0.35);
  box-shadow: 0 2px 12px rgba(var(--site-base-500-rgb), 0.08);
}

.newsroom-section-bg .border-gradient-blue-left h4 {
  font-size: 1.05rem;
  font-weight: 600;
  line-height: 1.25;
  margin-bottom: 0;
  letter-spacing: -0.01em;
}

.newsroom-section-bg .small {
  color: rgb(75, 85, 99);
  line-height: 1.5;
}
.newsroom-section-bg h4 {
  margin-top: 0;
}


/* overrides with more specificity than BS to force a custom header bg and text color */
.table thead.table-altsage >tr >th  {
  background-color:var(--bs-altsage-bg,inherit);
  color:var(--bs-white,inherit);
}

div#aggregation-buckets .pointer {cursor:pointer;}

.fa-invisible {visibility: hidden;}

.fa-3xl {
  font-size: 2.5em;
  line-height: .04125em;
  vertical-align: -0.1875em;
}

/* application fee waiver badge on card display full school list */
.fee-waiver {
  background-color:var(--site-base-500);
  border-radius:50%;
  display:inline-flex;
  align-items:center;
  justify-content:center;
  width:24px;
  height:24px;
}

#hidden_input { top: 0; left: 0; opacity: 0; }

.form-text {
  font-size: 0.8rem;      /* ~14.4px with 18px base */
  line-height: 1.4;
  color: #6B7280;         /* softer neutral gray */
}

.was-validated .form-check-input.no-validate:valid {
  border-color: var(--bs-gray-400)!important;
}
.form-check-input.is-valid~.form-check-label.no-validate, .was-validated .form-check-input:valid~.form-check-label.no-validate {
  color:rgb(21,27,38)!important;
}

#accelerated_classes label.form-check-label {
  margin-left: 1rem;
  padding-top: .20rem;
}

.form-checkbox-lg {
  transform: scale(1.25);
}

#accelerated_classes .form-check-lg {
  height: 1.5rem;
  width: calc(2rem + 0.75rem);
  border-radius: 3rem;
}

/* volendam */
img.jumbotron_image {
  width:100%;
  max-height:440px;
  object-fit: cover;
}

a.youtube     { color:#FF0000; }
a.vimeo       { color:#1AB7EA; }
a.facebook    { color:#4267B2; }
a.messenger   { color:#00B2FF; }
a.snap        { color:#000000; }
a.twitter     { color:#000000; }
a.insta       { color:#d62976; }
a.linkedin    { color:#0A66C2; }
a.pinterest   { color:#F0002A; }
a.flickr      { color:#0063DC; }
a.vtour       { color:#229454; }

/* use slighly smaller font on vertical nav to prevent wrapping */
.college-profile-nav a {
  white-space: nowrap;
  font-size: 0.92rem;
}


ul.college-profile-nav {
  list-style-type: none;
}
ul.college-profile-nav li {
  margin:0.3125rem 0;
  border: none;
  padding: 0;
}

/*
@media only screen and (min-width:65rem) {
  ul.college-profile-nav li .active {
    margin-left:-1.0rem;
  }
}*/

ul.college-profile-nav li a {
  text-decoration: none;
  color: var(--bs-base-color);
  border-left: 0.25rem solid #ffffff;
  padding-left: 0.6rem;
}

#event-btn-group span.active {
  background-color:var(--site-complete) !important;
  font-weight:bold;
}

/* college profile image gallery breakpoints for image sizes */
@media (min-width: 320px) {
  #college-profile-images-section img.gallery-image {
    height:20vw;
    width:40vw;
  }
  #college-profile-prime-section img.prime-image {
    height:26vw;
    width:56vw;
  }
}

@media (min-width: 768px) {
  #college-profile-images-section img.gallery-image {
    height:20vw;
    width:24vw;
  }
  #college-profile-prime-section img.prime-image {
    height:16vw;
    width:16vw;
  }
}

@media (min-width: 1200px) {
  #college-profile-images-section img.gallery-image {
    height:14vw;
    width:14vw;
  }
  #college-profile-prime-section img.prime-image {
    height:14vw;
    width:14vw;
  }
}

@media (min-width: 1400px) {
  #college-profile-prime-section img.prime-image {
    height:18vw;
    width:18vw;
  }
}

@media (min-width: 1800px) {
  #college-profile-images-section img.gallery-image {
    height:10vw;
    width:10vw;
  }
  #college-profile-prime-section img.prime-image {
    height:12vw;
    width:12vw;
  }
}

@media (min-width: 2200px) {
  #college-profile-prime-section img.prime-image {
    height:8vw;
    width:8vw;
  }
}

.lead-dark    {font-size: 1.25rem;font-weight:500;}
.lead-bold    {font-size: 1.25rem;font-weight:bold;}

.border-gray500  {border:1px solid var(--bs-gray-500)!important;}

/*volendam*/

#supportForm small.fixed-lh {line-height: 16px!important;}

.form-check-label.no-validate:valid {
  color:tomato;
}

.nounderline {
  text-decoration: none !important;
}

.passtrengthMeter {
  margin-bottom: 5px;
}

blockquote.quotebox {
  border-left: .5rem solid var(--site-base-500);
  background-color: var(--bs-gray-100,inherit)!important;
  padding:.85rem 1.5rem .85rem 1rem;
  font-size:1.2rem;
  color:#272727;
}

blockquote.quotebox-sage {
  border-radius:10px;
  border-left: .5rem solid var(--site-base-500);
  background-color: rgba(var(--site-base-500-rgb),0.2);
  color: rgb(33,37,41);
  padding:.85rem 1.5rem .85rem 1rem;
  font-size:1.2rem;
}

blockquote.quotebox-sage .blockquote-footer {
  color: rgb(33,37,41);
  text-align:right;
}

.quotebox-sage .fa-regular {
  color:var(--site-base-500);
  font-size:150%;
}

.blockquote-footer {
  color: rgb(33,37,41);
  text-align:right;
}

.news-card-title {
  margin-bottom: 1.5rem;
  text-align:center;
}

.news-card-text {
  line-height: 1.35;
}

.news-card-header {
  height:130px!important;
}

.news-card-header img {
  margin-top:10px;
  max-height:90px;
  width:auto;
}

/*****
*
*  Callouts - pulled from bootstrap 4.x
*
*******/

.input-readonly {
  background-color: var(--bs-gray-100);
}

.input-readonly-success {
  --bd-callout-bg: var(--site-complete-subtle);
}

.input-readonly-info {
  --bd-callout-bg: var(--bs-gray-500);
}

.input-readonly-danger {
  --bd-callout-bg: var(--bs-danger-bg-subtle);
}

/* READ ONLY fields */
.input-readonly[readonly] { background-color: var(--bs-gray-100); cursor: not-allowed; }
input[readonly][disabled]#st_dob {cursor: not-allowed;background-color: var(--bs-gray-100); /* optional, for consistency */}
.form-control:read-only, .form-control[readonly] {           /* or:  .form-control[readonly] */
  background-color:var(--bs-gray-100,inherit);        /* pick any subtle shade you like */
  opacity: 1;                       /* keep text fully opaque */
}
.form-control:read-only:focus {
  border-color:var(--bs-gray-500,inherit);
}


.bd-callout {
  padding: 1.25rem;
  margin-top: 1.25rem;
  margin-bottom: 1.25rem;
  color: var(--bd-callout-color, inherit);
  background-color: var(--bd-callout-bg, var(--bs-gray-100));
  border-left: 0.25rem solid var(--bd-callout-border, var(--bs-gray-300));
}

.bd-callout h4 {
  margin-bottom: .25rem
}

.bd-callout>:last-child {
  margin-bottom: 0
}

.bd-callout+.bd-callout {
  margin-top: -.25rem
}

.bd-callout-emphasized {
  font-size: 1.15em;
}

.bd-callout-sage {
  --bd-callout-color: var(--bs-base-color);
  --bd-callout-bg: var(--bs-sage-bg-subtle);
  --bd-callout-border: var(--bs-sage-border);
  background-color: var(--bd-callout-bg);
  padding: 1.25rem 1.25rem 1.25rem 1.5rem;
  max-width: 95%;
  margin-left: auto;
  margin-right: auto;
  margin-top: 1.5rem;
  margin-bottom: 1.5rem;
  border: 1px solid #e2e6ea;
  border-left: none;
  position: relative;
}

.bd-callout-sage::before {
  content: '';
  position: absolute;
  top: 0;
  left: -1px;
  width: 2px;
  height: 100%;
  background: linear-gradient(to bottom, rgba(var(--site-base-500-rgb),1) 0%, rgba(var(--site-base-500-rgb),0.4) 100%);
}

.bd-callout-sage h4 {
  color: var(--bs-sage);
  font-size: 1.3rem;
  margin-bottom: 0.4rem;
  margin-top:0;
}
.bd-callout-sage-emphasized  {
  font-size:1.3em;
  background-color:var(--bs-sage-bg-subtle, var(--bs-gray-100));
}

.bd-callout-success {
  --bd-callout-color: var(--bs-base-color);
  --bd-callout-bg: var(--site-complete-subtle);
  --bd-callout-border: var(--site-complete);
}
.bd-callout-success h4     {
  color:var(--site-complete, inherit)
}
.bd-callout-success-emphasized  {
  font-size:1.3em;
  background-color:var(--site-complete-subtle, var(--bs-gray-100));
}


.bd-callout-danger {
  --bd-callout-color: var(--bs-base-color);
  --bd-callout-bg: var(--bs-danger-bg-subtle);
  --bd-callout-border: var(--bs-danger-border);
}
.bd-callout-danger h4     {
  color:var(--bs-danger, inherit)
}
.bd-callout-danger-emphasized  {
  font-size:1.3em;
  background-color:var(--bs-danger-bg-subtle, var(--bs-gray-100));
}

.bd-callout-warning {
  --bd-callout-color: var(--bs-warning-text-emphasis);
  --bd-callout-bg: var(--bs-warning-bg-subtle);
  --bd-callout-border: var(--bs-warning-border-subtle);
}


.bd-callout-orangered {
  --bd-callout-color: var(--bs-base-color);
  --bd-callout-bg: var(--bs-orangered-bg-subtle);
  --bd-callout-border: var(--bs-orangered-border);
}
.bd-callout-orangered h4     {
  color:var(--bs-orangered, inherit)
}




/* using ID gives a score +100 over 10 points for classes and pseudo-classes and 1 point for tag selectors and pseudo-elements
 * inline style= is +1000 and automatically wins out */
#section_score {padding: 0.75rem;}

.custom-alert {
    display: flex;
    align-items: flex-start;
    background-color: #fbeaea;
    border: 2px solid #d9534f;
    border-radius: 8px;
    padding: 20px;
    margin-bottom: 20px;
    color: #a94442;
    font-size: 1rem;
  }

  .custom-alert-icon {
    flex: 0 0 auto;
    font-size: 2.5rem;
    margin-right: 15px;
    color: #d9534f;
  }

  .custom-alert-content {
    flex: 1;
  }

  .custom-alert ul {
    margin-top: 0.5rem;
    margin-bottom: 1rem;
  }
  .custom-alert .row {
    width: 100%;        /* let row span full width */
    margin-left: -45px; /* cancel out icon spacing so button re-centers */
  }

/* Callout base */
.callout{border:1px solid var(--bs-border-color);border-left-width:6px;border-radius:.5rem;background:#fff}
.callout .icon{width:2.25rem;height:2.25rem;display:flex;align-items:center;justify-content:center;border-radius:50%}
.callout h4{margin:0 0 .25rem 0;font-size:1.05rem}
.callout .body{font-size:.95rem}
.callout .meta{font-size:.825rem;color:var(--bs-gray-700)}
.callout .items{margin:.25rem 0 .25rem 1.25rem}

/* Variants */
.callout-success{border-left-color:var(--site-success)}.callout-success .icon{background:var(--site-success-subtle);color:var(--site-success)}
.callout-warning{border-left-color:var(--site-warning)}.callout-warning .icon{background:var(--site-warning-subtle);color:var(--site-warning)}
.callout-info   {border-left-color:var(--site-info)}.callout-info .icon{background:var(--site-info-subtle);color:var(--site-info)}
.callout-danger {border-left-color:var(--site-danger)}.callout-danger .icon{background:var(--site-danger-subtle);color:var(--site-danger)}
.callout-neutral{border-left-color:var(--bs-gray-400)}.callout-neutral .icon{background:var(--site-neutral-subtle);color:var(--site-neutral)}

/* Optional mini progress */
.callout .mini-progress{height:.5rem;background:var(--bs-gray-200);border-radius:999px;overflow:hidden}
.callout .mini-progress>span{display:block;height:100%;background:var(--site-info)}






/* === START: jquery-UI overrides, search, BS5 fixes, dynamic alignment === */

/* jquery UI overrides */
.ui-autocomplete {
  z-index: 9999 !important;
  max-height: 420px;
  overflow-y: auto;
  /* prevent horizontal scrollbar */
  overflow-x: hidden;
  /* add padding to account for vertical scrollbar */
  padding-right: 10px;
}

/* SEARCH */
div.search div.filters {
  max-width: 30%;
  min-width: 14rem;
}

.breadcrumb {
  background-color: rgba(255,255,255,1);
  font-size:80%;
}

ol.breadcrumb {
  padding-left: 0;
  margin-bottom: 0;
}

.social-icon {
  max-width: 2rem;
}

/* dynamic alignment */
.text-xs-left {
  text-align: left !important;
}

.text-xs-right {
  text-align: right !important;
}

.text-xs-center {
  text-align: center !important;
}

.text-xs-justify {
  text-align: justify !important;
}

@media (min-width: 768px) {
  .text-sm-left {
      text-align: left !important;
  }

  .text-sm-right {
      text-align: right !important;
  }

  .text-sm-center {
      text-align: center !important;
  }

  .text-sm-justify {
      text-align: justify !important;
  }
}

@media (min-width: 992px) {
  .text-md-left {
      text-align: left !important;
  }

  .text-md-right {
      text-align: right !important;
  }

  .text-md-center {
      text-align: center !important;
  }

  .text-md-justify {
      text-align: justify !important;
  }
}

@media (min-width: 1200px) {
  .text-lg-left {
      text-align: left !important;
  }

  .text-lg-right {
      text-align: right !important;
  }

  .text-lg-center {
      text-align: center !important;
  }

  .text-lg-justify {
      text-align: justify !important;
  }
}

.opacity-5 {
  opacity:1!important;
}

.blended-icon {
  background-color: transparent!important;
  opacity: .75;
}

#flash.flash-fixed {
  z-index: 9999;
  top: 5rem;
}

#vnav a {
  color:rgb(33,37,41)
}

.vnav_wrapper {height: 100vh;}
.vnav_header {height: 2vh;}
.vnav_nav {height: 100%;}

ul.v-spaced li, ol.v-spaced li {
  margin-bottom:1.5rem;
}

ul.v-spaced li:first-child, ol.v-spaced li:first-child {
  margin-top:1.5rem;
}

ul.h-spaced li, ol.h-spaced li {
  padding-left:1.5rem;
}

.cursor-pointer { cursor: pointer; }

/* === END: utilities === */