/* accessible-helper-bootstrap.css */
/* Ensure [hidden] panels are always hidden even if site CSS sets display on child elements. The UA stylesheet omits !important so custom.css can win. */
 [hidden] {
     display: none !important;
}
/* Style fix for moving h1 header above content to fix heading order*/
 h1.page-title.pt-0 {
     font-size: 2em;
}
/*Style fix for slideshow h1 heading to div to fix heading order*/
 .title.slide-title {
     font-size: 2em;
}
/* BOOTSTRAP COMPONENTS */
/* Bootstrap CSS Updates Manual Accessibility */
/*fix carousel colors*/
 a.button.secondary.play {
     color: black !important;
     background-color: white !important;
}
 a.button.secondary.stop {
     color: black !important;
     background-color: white !important;
}
/* breadcrumbs */
/* fix to boot-33 - Urec - Breadcrumbs Slashes - Provide text equivalents for icon fonts */
/* Strongly override the text-based slash */
 nav[aria-label="breadcrumb"] .breadcrumb-item + .breadcrumb-item::before {
     content: "" !important;
    /* kills the "/" */
     background: none !important;
    /* neutralize any fills */
     background-color: transparent !important;
     width: 0 !important;
     margin: 0 !important;
    /* our hairline separator */
     position: absolute;
     left: .375rem;
     top: 50%;
     height: 0.9em;
     transform: translateY(-50%) rotate(20deg);
     border-left: 1px solid #6c757d;
}
/* Provide space for the separator */
 nav[aria-label="breadcrumb"] .breadcrumb-item + .breadcrumb-item {
     position: relative;
     padding-left: .75rem;
}
/* GLOBAL FOCUS */
 :focus {
     border: 1px solid #ffffff !important;
     outline: #003fbb solid 3px !important;
}
 footer a:focus {
     border: 0px solid #ffffff !important;
     outline: #ffffff solid 3px !important;
}
 .orange-bg a:focus {
     border: 2px solid #ffffff !important;
     outline: none !important;
}
/* Web form field border */
 .form-control {
     border: 1px solid #000000;
}
/* Video Transcript */
 #video-transcript {
     display: none;
}
/* Footer bottom row color contrast */
 .ultra-dark-bg {
     background-color: #181a1d !important;
     color: #fff!important;
}
 .js_year {
     background-color: #181a1d !important;
     color: #fff!important;
}
/* Web forms label margin fix for spacing when special instructions are added */
 #contact label {
     margin-bottom: 0rem;
}
 #contact span {
     font-size: 0.9em;
}
/* Specifying color contrast on menu dropdown desc text and background */
/* .nav-description – removed: empty ruleset, all declarations were already commented out */
/* Increase accessibility of pre-footer links */
 .pre-footer a {
     font-weight: 400;
}
 .pre-footer a:hover {
     font-weight: normal;
    /*color: #A43719;
    */
     color: #7f2006;
}
/* Nextgen Accessibility Fixes */
 .video-background, .video-background-banner {
     overflow: visible;
}
/* Calendar Event Focus */
 .event:focus {
     border: 0 !important;
     outline: #003fbb solid 3px !important;
}
/* Google maps, street view, and panoramas */
 .map:hover, .map:focus, .panorama:hover, .panorama:focus{
     outline: 5px solid blue;
}
/* owl carousel styles */
 .owl-controls {
     height: 60px;
     position: relative;
     padding: .8rem .5rem 
}
 .owl-auto, .owl-controls .owl-nav, .owl-dots {
     position: absolute 
}
 .owl-controls .owl-nav button, .owl-controls .owl-nav button span {
     border: 0;
     background-color: transparent;
     cursor: pointer 
}
 .owl-controls .owl-nav button span {
     display: block;
     width: 32px;
     height: 32px;
     margin: 0;
     padding: 0;
     text-indent: -9999px;
     top: 95%;
     background: url(//www.utrgv.edu/_files/images/accessibility/controls-w-pause.png) no-repeat 0 -32px 
}
 .owl-controls .owl-nav button.owl-prev span:hover, .owl-controls .owl-nav button.owl-prev:focus span {
     background-position: 0 0 
}
 .owl-controls .owl-nav button.owl-next span {
     background-position: -43px -32px 
}
 .owl-controls .owl-nav button.owl-next span:hover, .owl-controls .owl-nav button.owl-next:focus span {
     background-position: -43px 0 
}
 .owl-dots {
     visibility: hidden 
}
 .owl-item .item a:focus {
     border: 5px solid #003fbb;
    /* display: block */
}
 @media screen and (min-width:960px) {
     .owl-dots {
         visibility: visible;
         left: 50% 
    }
     .owl-dots .owl-dot {
         border: 2px solid #fff;
         border-radius: 5px;
         cursor: pointer;
         height: 13px;
         width: 13px;
         padding: 0;
         margin: 0 3px;
         background: #575757;
         width: 14px !important;
         height: 14px !important;
         margin: 0px 7px !important;
    }
     .owl-dots .owl-dot:focus {
         border: 2px solid #0226ff;
         margin: 0 3px 
    }
     .owl-dots .owl-dot:hover {
         background: #fff;
         border: 2px solid #000;
         margin: 0 3px 
    }
     .owl-dots .owl-dot.active {
         background: #cf4311;
         border: 2px solid #cf4311;
         margin: 0 3px 
    }
     .owl-auto {
         right: 1% 
    }
}
/* Owl carousel play and stop buttons */
 .owl-auto {
     position: absolute;
     right: .5rem;
}
 .owl-auto .button {
     display: block;
     text-indent: -9999px;
     height: 32px;
     width: 32px;
     background: url(https://www.utrgv.edu/_files/images/accessibility/stop-button-inverse.png) transparent no-repeat 0 0;
}
 .owl-auto .play {
     background: url(https://www.utrgv.edu/_files/images/accessibility/play-button-inverse.png);
}
 .owl-auto .play:focus, .owl-auto .play:hover {
     border: 0 !important;
     background: url(https://www.utrgv.edu/_files/images/accessibility/play-button.png);
}
 .owl-auto .stop {
     background: url(https://www.utrgv.edu/_files/images/accessibility/stop-button-inverse.png);
     color: #000000 !important;
}
 .owl-auto .stop:focus, .owl-auto .stop:hover {
     border: 0 !important;
     background: url(https://www.utrgv.edu/_files/images/accessibility/stop-button.png);
}
/* Owl carousel stop button second list of color to try and fix new issue on stage pages. */
 a.button.secondary.stop {
     color: #000000 !important;
}
/* Owl slider dots default color */
 .owl-theme .owl-dots .owl-dot span {
     background: #6b6a6a !important;
    /* defined in modern-business.css */
}
/* owl dots hover and span */
 .owl-theme .owl-dots .owl-dot span:hover, .owl-theme .owl-dots .owl-dot span:focus {
     background: #ffffff !important;
     border: 2px solid #000000 !important;
}
/* owl active dot */
 .utrgv-default .owl-dot.active span {
     background: #cd451f !important;
     border: 6px solid #cf4311 !important;
}
/* Owl slider hover and focus states */
 .owl-item:hover, .owl-item:focus {
     outline: 2px solid #8a8a8a;
}
/* Owl slider next and prev arrows hover and focus states */
 .owl-prev span:hover, .owl-prev span:focus, .owl-prev next:hover, .owl-prev next:focus {
     background: #cd451f;
}
 .owl-prev span:hover, .owl-prev span:focus {
     background: #cd451f;
}
/* Owl slider next and prev arrows hover and focus states - hover is on span */
 .owl-prev span:hover, .owl-prev span:focus, .owl-prev next:hover, .owl-prev next:focus {
     background: #000000;
}
/* Owl slider next and prev arrows hover and focus states - focus is on button */
 .owl-prev:hover span, .owl-prev:focus span, .owl-next:hover span, .owl-next:focus span {
     background: #000000;
}
/* focus state retry of span on button focus*/
 .utrgv-default button.owl-prev:focus span, .utrgv-default button.owl-next:focus span, .utrgv-default button.owl-dot:focus span {
    /* outline: 2px solid blue;
     */
     background: #000000 !important;
     border: 2px solid #ffffff !important;
     color: #ffffff;
}
/* Owl Slide show next and prev arrow links - non-Safari browsers */
 .utrgv-default .owl-prev span, .utrgv-default .owl-next span {
     padding-top: 13px;
}
/* Top menu */
 .nav-item a:hover, .nav-item a:focus, .accordion-nav-item.card a:focus {
     text-decoration: none;
}
/* Left Menu */
 .accordion-nav-item.card a:hover, .accordion-nav-item.card a:focus {
     text-decoration: none;
}
/* Left Menu Down button */
/* a.arrows.accordion-btn.icon-right:hover, a.arrows.accordion-btn.icon-right:focus {
     top: -5px;
}
 */
/* Left Menu Down button collapsed */
/* a.arrows.accordion-btn.icon-right.collapsed:hover, a.arrows.accordion-btn.icon-right.collapsed:focus {
     top: -5px;
}
 */
/* Left Menu Down button arrow hover and focus */
 .level2:hover, .level2:focus, .level6:hover, .level6:focus, .level10:hover, .level10:focus, .level13:hover, .level13:focus {
     top: -0.2em !important;
     background-color: #f3f3f3;
}
/* Bootstrap mobile hamburger menu icon */
 .navbar-toggler-icon:focus {
     outline: #5690ed auto 1px;
}
 .navbar-toggler-icon:hover {
     outline: #5690ed auto 1px;
}
 #pre-header-section .navbar-toggler:focus {
     outline: #5690ed auto 1px;
}
 #pre-header-section .navbar-toggler:hover {
     outline: #5690ed auto 1px;
}
/* Bootstrap global footer focus and hover styles */
 #globel-nav-footer li a {
     text-decoration: inherit;
}
 #globel-nav-footer li a:hover {
     text-decoration: underline;
}
 #globel-nav-footer li a:focus {
     text-decoration: underline;
}
/* Breadcrumb */
 .breadcrumb-item a:hover, .breadcrumb-item a:focus .accordion-nav-item.card a:focus {
     text-decoration: none;
}
/* Quick Links */
 .list-group-item a:hover, .list-group-item a:focus .accordion-nav-item.card a:hover, .accordion-nav-item.card a:focus{
     text-decoration: none;
}
/* Pre Footer */
 .font-weight-light a:hover, .font-weight-light a:focus {
     text-decoration: none;
}
/* Page Cards */
 .card-body a:hover, .card-body a:focus {
     text-decoration: none;
}
/* Accordion */
 .accordion-item a {
     text-decoration: underline;
}
 .accordion-item a:hover, .accordion-item a:focus{
     text-decoration: none;
}
/* Owl Slide show next and prev arrow links - Safari 10.1+ */
/* Safari-only nested @media hack removed: bare @media{
}
 is invalid CSS. Safari padding-top override (16px) was a duplicate of the rule above (13px). */
/* Search Button - make visible and enable a focus and hover style */
 label[for="search"] {
     position: static;
     color: #E3E3E3;
}
/* Mobile View */
 @media only screen and (max-width: 992px) {
     #navbarResponsive * {
         font-size: inherit;
    }
     #navbarDropdownSearch+.dropdown-menu {
         border-radius: 0;
         background: #e3e3e3;
    }
     #navbarDropdownSearch+.dropdown-menu .search:before {
         left: -100px;
         height: 100%;
         width: 100px;
    }
     #navbarDropdownSearch+.dropdown-menu .search:after {
         top: 0;
         right: -99px;
         height: 100%;
         width: 100px;
         background: #ddd;
    }
     #navbarDropdownSearch+.dropdown-menu .search:before, #navbarDropdownSearch+.dropdown-menu .search:after {
         content: " ";
         display: block;
         position: absolute;
         background: #e3e3e3;
    }
     #navbarDropdownSearch+.dropdown-menu .search {
         position: relative;
         padding-bottom: 1.5em;
    }
     #navbarDropdownSearch+.dropdown-menu label[for="search"] {
         color: #E3E3E3;
         padding-top: .5em;
         position: static;
    }
     #navbarDropdownSearch+.dropdown-menu .search input[type=search] {
         border: 1px solid #515256;
    }
     #navbarDropdownSearch+.dropdown-menu .search input[type=submit] {
         border-radius: 0;
         color: #FFF;
         text-indent: revert;
         top: 2.5em;
         right: 0;
         height: auto;
         width: auto;
         padding: .45em;
         background: #515256;
    }
}
/* Mobile View - very small and magnified */
 @media only screen and (max-width: 380px) {
     .utrgv-icons-footer {
         padding-top: 54px;
    }
     .utrgv-logo-footer {
         min-width: 150px;
    }
}
 .hide_legend {
     display: none;
}
 @media only screen and (min-width: 992px) {
     .show #navbarDropdownSearch+.dropdown-menu {
         border-radius: 0;
         display: block;
         padding: .8em 0 !important;
         width: 441px;
    }
     .show #navbarDropdownSearch+.dropdown-menu:before {
         left: -999999em;
         width: 999999em;
         border: 0;
    }
     .show #navbarDropdownSearch+.dropdown-menu:after {
         content: " ";
         position: absolute;
         top: 0px;
         right: -999999em;
         bottom: 0;
         border: 0;
         width: 999999em;
    }
     .show #navbarDropdownSearch+.dropdown-menu, .show #navbarDropdownSearch+.dropdown-menu:before, .show #navbarDropdownSearch+.dropdown-menu:after {
         background: #e3e3e3;
    }
     .show #navbarDropdownSearch+.dropdown-menu .search input[type=search] {
         display: inline-block;
         margin-left: 1em;
         border: 1px solid #515256;
         width: 83.8%;
    }
     .show #navbarDropdownSearch+.dropdown-menu .search input[type="submit"] {
         border-radius: 0;
         color: #fff;
         text-indent: 0;
         height: auto;
         width: auto;
         padding: .45em;
         top: .8em;
         background: #515256;
    }
}
/* Search button: decorative triangle connector under X (matches live site) */
 li.nav-item.dropdown.search.show:before {
     content: "";
     width: 0;
     height: 0;
     border-style: solid;
     border-width: 0 6px 6px 6px;
     border-color: transparent transparent #ddd transparent;
     position: absolute;
     bottom: 0;
     left: 50%;
     margin-left: -6px;
}
/* Search button: hide X by default, show magnifying glass */
 li.nav-item.dropdown.search .fa-x {
     display: none !important;
}
 li.nav-item.dropdown.search .fa-magnifying-glass {
     display: inline-block !important;
     color: white;
}
/* Search button: when expanded, swap to X */
 li.nav-item.dropdown.search.show .fa-magnifying-glass {
     display: none !important;
}
 li.nav-item.dropdown.search.show .fa-x {
     display: inline-block !important;
     color: white;
     position: relative;
     top: -2px;
}
/* ===================================================== boot-36 – W3C Accessible Accordion button styles Resets <button class="accordion-trigger"> to look like the Bootstrap card-header accordion on the live page (plus/minus on the left, no button chrome). ===================================================== */
/* Give the accordion group a card-like border to match the live Bootstrap .accordion-group */
 .accordionGroup {
     border: 1px solid rgba(0, 0, 0, 0.45);
     border-radius: 0.25rem;
    /* overflow: hidden;
     */
    /* removed: clips focus outline on first/last accordion button */
}
/* Heading rows */
 .accordionGroup h3 {
     margin: 0;
     padding: 0;
     font-weight: 400;
}
/* Single separator line above each heading that follows a panel. The adjacent-sibling selector matches even display:none (hidden/collapsed) panels, so inter-item dividers always render. The outer .accordionGroup border serves as the top edge for the first heading. The panel's border-top (below) serves as the line below each expanded button. */
 .accordionGroup .accordion-panel + h3 {
     border-top: 1px solid rgba(0, 0, 0, 0.45);
}
/* Strip ALL native <button> chrome. border: none is intentional – on :focus the global rule `border: 1px solid #ffffff !important` overrides it. */
 button.accordion-trigger {
     -webkit-appearance: none;
     appearance: none;
     background-color: transparent;
     border: none;
     border-radius: 0;
     box-shadow: none;
     margin: 0;
    /* Full-width flex row so the icon and text sit correctly */
     display: flex;
     align-items: center;
     width: 100%;
     text-align: left;
     cursor: pointer;
    /* Match Bootstrap .card-header padding */
     padding: 0.75rem 1.25rem;
    /* Inherit site typography */
     font-family: inherit;
     font-weight: 400;
     color: inherit;
     line-height: 1.5;
     text-decoration: none;
}
 button.accordion-trigger:hover {
     background-color: rgba(0, 0, 0, 0.04);
     text-decoration: none;
}
/* Focus state: same background as hover so the item is clearly highlighted. :focus-visible targets keyboard focus only;
 :focus is the fallback for browsers that do not yet support :focus-visible. The blue outline itself comes from the global :focus rule further up this file. */
 button.accordion-trigger:focus-visible, button.accordion-trigger:focus {
     background-color: rgba(0, 0, 0, 0.04);
}
/* +/− icon – order: -1 puts the span before the label text in flex order, matching the live page's left-side indicator */
 .accordion-icon {
     order: -1;
     flex-shrink: 0;
     margin-right: 0.5em;
     font-size: 1em;
     line-height: 1;
     width: 1em;
     text-align: center;
     font-style: normal;
}
/* Collapsed / default: show + */
 button.accordion-trigger .accordion-icon::before {
     content: "+";
}
/* Expanded: show − (Unicode minus sign) */
 button.accordion-trigger[aria-expanded="true"] .accordion-icon::before {
     content: "\2212";
}
/* Visible panel – card-body-style padding and a top rule. Scoped to .accordionGroup so it only targets the W3C button-based feature accordion;
 Bootstrap card panels (accordion-in-tabs) already get padding from .card-body and must not be double-padded. */
 .accordionGroup .accordion-panel {
     padding: 1rem 1.25rem;
     border-top: 1px solid rgba(0, 0, 0, 0.45);
}
/* ===================================================== boot-36 – Accordion-in-Tabs button styles The Bootstrap card accordion used inside tabs has button.accordion-title (not .accordion-trigger). Bootstrap's .btn-link already strips the button border/background;
 we just need the +/− icon and a colour override so the heading text is not blue. ===================================================== */
/* Override .btn-link blue colour so the heading reads like body text, matching the live page. font-size: inherit overrides Bootstrap's .btn {
     font-size: 1rem 
}
 so the button text inherits the parent h3 size, matching .accordion-trigger. */
 button.accordion-title {
     color: inherit !important;
     font-size: inherit;
}
/* The inner <span class="accordion-title"> holds the label text and the .accordion-icon span. Make it a flex row so we can reorder icon to the left. */
 span.accordion-title {
     display: inline-flex;
     align-items: center;
     width: 100%;
}
/* Icon: move before the label text and add right gap */
 span.accordion-title .accordion-icon {
     order: -1;
     flex-shrink: 0;
     margin-right: 0.5em;
     font-size: 1em;
     line-height: 1;
     width: 1em;
     text-align: center;
}
/* Collapsed / default: show + */
 button.accordion-title .accordion-icon::before {
     content: "+";
}
/* Expanded: show − */
 button.accordion-title[aria-expanded="true"] .accordion-icon::before {
     content: "\2212";
}
/* ===================================================== boot-36 – Accordions in Columns (col 2 & 3) These use the Bootstrap card pattern: .accordion-group > .card > .card-header > h3.plus-minus > button.accordion-trigger > span.accordion-label Three things needed vs column 1: 1. Remove double padding – .card-header already provides it. 2. Suppress h3.plus-minus::before – remote custom.css adds that icon, but the button's aria-expanded now drives it instead. 3. Drive +/− from span.accordion-label::before via aria-expanded, matching the column 1 .accordion-icon pattern. ===================================================== */
/* 1. Give .accordion-group (tabs, cols 2 & 3) the same single outer-border as .accordionGroup. :has() limits this to groups using accessible button triggers or titles. */
 .accordion-group:has(button.accordion-trigger), .accordion-group:has(button.accordion-title) {
     border: 1px solid rgba(0, 0, 0, 0.45);
     border-radius: 0.25rem;
    /* overflow: hidden;
     */
    /* removed: clips focus outline on first/last accordion button */
     width: 100%;
    /* fill container even when a parent is a flex row */
}
/* Replace stacked per-card outer borders with top-border dividers */
 .accordion-group:has(button.accordion-trigger) .accordion-item.card, .accordion-group:has(button.accordion-title) .accordion-item.card {
     border: none;
     border-top: 1px solid rgba(0, 0, 0, 0.45);
     border-radius: 0;
     margin-bottom: 0;
}
 .accordion-group:has(button.accordion-trigger) .accordion-item.card:first-child, .accordion-group:has(button.accordion-title) .accordion-item.card:first-child {
     border-top: none;
}
/* Remove card-header's own padding;
 the button below takes it over so that the hover/focus background covers the full header row (matching col 1). */
 .accordion-group:has(button.accordion-trigger) .card-header, .accordion-group:has(button.accordion-title) .card-header {
     padding: 0;
     background-color: transparent;
     border-bottom: none;
}
/* Button owns the header padding – hover fills the entire row */
 .accordion-group .card-header button.accordion-trigger {
     padding: 0.75rem 1.25rem;
}
/* button.accordion-title (tabs) – layout and padding. Uses !important to override Bootstrap's p-0 utility class already on the button. */
 .accordion-group .card-header button.accordion-title {
     display: flex;
     align-items: center;
     padding: 0.75rem 1.25rem !important;
}
 .accordion-group .card-header button.accordion-title:hover {
     background-color: rgba(0, 0, 0, 0.04);
     text-decoration: none;
}
/* Focus state: mirrors hover background (same as accordion-trigger above). */
 .accordion-group .card-header button.accordion-title:focus-visible, .accordion-group .card-header button.accordion-title:focus {
     background-color: rgba(0, 0, 0, 0.04);
}
/* Counteract custom.css `.accordion-title * {
     background: #ffffff 
}
` which paints the inner span white and hides the button's hover / focus background. */
 .accordion-group .card-header button.accordion-title * {
     background: transparent !important;
}
/* 2. Neutralise the h3::before icon and the 30px left-padding that modern-business.css adds via .plus-minus when an accessible button is the trigger. :has() is supported in all evergreen browsers (Chrome 105+, FF 121+, Safari 15.4+) */
 .accordion-group .card-header h3.plus-minus:has(> button.accordion-trigger) {
     padding-left: 0 !important;
}
 .accordion-group .card-header h3.plus-minus:has(> button.accordion-trigger)::before {
     content: "" !important;
     margin: 0 !important;
     padding: 0 !important;
}
/* 3. Make span.accordion-label a flex row so the icon sits to the left */
 .accordion-group .card-header button.accordion-trigger span.accordion-label {
     display: inline-flex;
     align-items: center;
     width: 100%;
}
/* Collapsed / default: show + */
 .accordion-group .card-header button.accordion-trigger span.accordion-label::before {
     content: "+";
     flex-shrink: 0;
     margin-right: 0.5em;
     font-size: 1em;
     line-height: 1;
     width: 1em;
     text-align: center;
}
/* Expanded: show − */
 .accordion-group .card-header button.accordion-trigger[aria-expanded="true"] span.accordion-label::before {
     content: "\2212";
}
/* Panel padding for col 2 & 3 – matches column 1's .accordionGroup .accordion-panel. Scoped to panels without .card-body so accordion-in-tabs panels (which rely on Bootstrap's .card-body padding) are not double-padded. */
 .accordion-group .accordion-content.accordion-panel:not(:has(.card-body)) {
     padding: 1rem 1.25rem 1rem calc(1.25rem + 1.5em);
     border-top: 1px solid rgba(0, 0, 0, 0.45);
}
/* Border-top for accordion panels that wrap content in .card-body (e.g. tabs). Replaces the card-header border-bottom that was removed above. */
 .accordion-group .accordion-content.accordion-panel:has(.card-body) {
     border-top: 1px solid rgba(0, 0, 0, 0.45);
}
/* Align panel content with the trigger label (indent by button-left-padding + icon + gap). */
 .accordion-group .accordion-content.accordion-panel .card-body {
     padding-left: calc(1.25rem + 1.5em);
}
/* Fieldset left-padding – same 1.7em as Bootstrap reboot, re-declared with higher specificity so it reliably applies inside all accordion panel types. */
 .accordionGroup .accordion-panel fieldset, .accordion-group .accordion-panel fieldset {
     padding-left: 1.7em;
}
 