/*  UTRGV DEFAULT SETTING OVERWRITE
    This CSS is used for the WebBook template.
    Created 07/30/2026 - JLQ
    Since this overwrites some of the default UTRGV class, please do not merge with the default file.
*/
 * { box-sizing:border-box; }
 #department-nav-section2 { display:none !important; }
 .content-area section { margin-top:20px !important; }
 .row .custom_html_col > .row:has(.wb-img .object-fit-cover) {
     width:100%;
     height:100%;
}
 .row .custom_html_col > .row:has(.wb-img .object-fit-contain) {
     width:100%;
     height:100%;
}
 .webbook .pagetitle .Breadcrumb .breadcrumbs {
     padding:10px 0px 10px 20px;
}
 .webbook .college_message_col:has(.message-media-wrap) {
     border:1.5px solid #d2d2d2;
     padding:20px;
}
 .webbook .college_message_col:has(.message-media-wrap) h2 {
     text-align:left;
     font-size:1.2rem;
}
 .webbook .college_message_col:has(.message-media-wrap) .module-section {
     border:none;
     border-radius:10px;
     background-color:#ffffff;
}
 .webbook .college_message_col:has(.message-media-wrap) .module-section .text-and-media.flex-lg-row-reverse .message-copy-wrap {
     border:none;
}
 .webbook .college_message_col .module-section {
     font-family: revert;
     font-weight:revert;
     font-size: revert;
}
 .webbook .border-b {
     margin:0px;
     padding:0px;
}
 .webbook .title-wrap .title:after {
     background-image:none;
}
 .webbook .row:has(.m-auto) {
     height:100%;
     margin:auto;
}
 .webbook .card-box-a .card-image img {
     margin:auto;
}

.webbook .cards_col .card-row .card-box-a .card-title { font-size:1.2rem; }
.webbook .card-box-a .card-description { font-size:1.1rem; }

.webbook .cards_col .style-border-gray  { border:2px solid #eeeeee; }

/* SIDEBAR: Overwrite Bootstrap color schemes */
 .webbook-scrollspy {
     display:block;
     width:100%;
     height:150px;
     overflow:auto;
     border:1px solid #646469;
     border-radius:10px;
}
 .webbook .nav-pills .nav-link a.focus !important, .nav-item a.focus !important, :focus !important {
     color:#646469;
}
 .nav-item a.focus !important {
     color:#646469;
}
 .nav-pills .nav-link.active, .nav-pills .show>.nav-link !important {
     color:#ffffff;
     background-color:#333333;
}


/* WEBBOOK CLASSES */
 .webbook {
     display:grid;
     grid-template-columns: minmax(300px, 20%) auto;
     box-sizing:border-box;
     margin-top:-16px;
}

 .wb-li li { margin-bottom: 1rem; }

 .wb-text-wrap-balance {
     text-wrap:balance;
}
 .wb-frame-header {
     grid-column: 1 / span 2;
     padding:30px 20px 20px 40px;
     background-color:#fbfbfb;
    /* background: #ffffff url("https://stagewww.utrgv.edu/branding-draft/_files/images/content/border-hex-white-shadow2.webp") repeat-x bottom;
     */
}
 .wb-frame-body {
}
 .wb-hero {
     margin:0px;
}
 .wb-hero-ratio {
     display:block;
     aspect-ratio: 21 / 9;
     padding:3%;
}
 .wb-hero-textbox {
     background-color:rgba(66,66,66, 0.95);
     border-radius:10px;
     color:#ffffff;
}
 .wb-body {
     box-shadow: rgba(0, 0, 0, 0.1) 0px 4px 12px inset;
     box-sizing:border-box;
     padding-top:20px;
    /* To allow shadow to be visible from the header */
     background: #ffffff url("https://stagewww.utrgv.edu/branding-draft/_files/images/content/back-hex-gray-light-corner-right.webp") no-repeat top right;
}
 .wb-content {
     display:block;
     max-width:1200px;
     min-width:300px;
     margin-left:5%;
     margin-right:5%;
     box-sizing:border-box;
     padding-top:30px;
}
 .webbook .page-content {
     margin:0px;
}
 .webbook h1 {
     text-wrap:balance;
     margin-left:1.45rem;
     margin-bottom: 30px;
     border-top:2px solid #646469;
     border-bottom:2px solid #646469;
     padding-top:10px;
     padding-bottom:10px;
}
 .webbook h2 {
     text-wrap:balance;
}
 .showit {
     display:block;
}
 .hideit {
     display:none;
}
 .wb-img {
}
 .wb-img .object-fit-cover, .wb-img .object-fit-contain {
     width:100%;
     height:100%;
}
 .wb-header-1, .wb-header-2 {
     display:inline-block;
     background-color:#ffffff;
     font-weight:bold;
     float:left;
     clear:left;
}
 .wb-header-1 {
     font-size:125%;
}
 .wb-header-2 {
     font-size:105%;
     margin-bottom:10px;
}
/* SIDEBAR */
 .wb-sidebar-desktop {
     display:block;
}
 .wb-sidebar-mobile {
     display:none;
}
 .wb-sidebar-mobile a, .wb-sidebar-mobile a:active, .wb-sidebar-mobile a:visited {
     color:#ffffff;
}
 .wb-frame-sidebar {
     background-color: #424242;
     background: #424242 url("https://stagewww.utrgv.edu/branding-draft/_files/images/content/back-nav-01.webp") repeat-x bottom left;
     padding-top:20px;
     padding-bottom: 50px;
}

 .wb-sidebar {
    width:100%;
    height:100%;
}

 .wb-sidebar-nav ul { 
     margin:0px; padding-top:10px; }
     
 .wb-nav-sub1 {
        background: url("https://stagewww.utrgv.edu/branding-draft/_files/images/content/back-gray-lines-02.webp") repeat-x bottom;
 }
 
 .wb-sidebar-nav li {
 display:flex;
 flex-direction:column;
 justify-content:center;
 padding-top:5px;;
}

 .wb-sidebar-nav li > li  { background-color:#eeeeee; }
 
 .wb-sidebar-nav li:hover > .btn, .wb-sidebar-nav li:hover > a { color:#ffffff; background-color:#333333; border-left:3px solid #ffffff; }
 
 .wb-sidebar-nav li .btn, 
 .wb-sidebar-nav li a {
    display:block; 
    width:100%;
    font-size:1.1rem;
    font-weight:bold;
    text-decoration:none;
    color:#ffffff;
    margin:0px;
    padding:10px 5px 10px 5px;
    padding-left:30px;
    text-align:left;    
}

 .wb-sidebar-nav li li .btn,
 .wb-sidebar-nav li li a { padding-left:60px; }
 
 .wb-sidebar-nav li li li .btn,
 .wb-sidebar-nav li li li a { padding-left:75px;  }
 
  .wb-nav-sub3 {
     background-color:#646469;
     background: #646469 url("https://stagewww.utrgv.edu/branding-draft/_files/images/content/back-gray-lines-01.webp") repeat-x bottom;
}
 .xwb-sidebar-nav li li li { background-color:#646469; }
 
 .wb-sidebar-nav li li li:active .btn,
 .wb-sidebar-nav li li li:active a { background-color:#000000; }

.wb-fa-icon { margin-right:10px; }

 .xwb-sidebar-nav .btn {
     margin:0px;
     padding-left:10px;
     line-height:2;
     font-size:100%;
     width:100%;
     border-radius: 0px 10px 10px 0px;
     border-top:2px;
     border-bottom:2px;
     background-color: transparent;
}
 .xwb-sidebar-nav a {
     display:flex;
     width:100%;
     align-items:center;
     background-color: transparent;
}

.xwb-sidebar-nav ul { padding-left:30px; }
.xwb-sidebar-nav ul ul { padding-left:30px; }
.xwb-sidebar-nav ul ul ul li { margin-left:-2rem; padding-left:1rem; }
.xwb-sidebar-nav ul a { padding-left: 0.75rem; }

 .xwb-sidebar-nav .btn, .xwb-sidebar-nav a {
     text-decoration:none;
     color:#ffffff;
     font-weight:bold;
     min-height:45px;
     background-color: transparent;
}
 .xwb-sidebar-nav .btn:hover, .xwb-sidebar-nav li:hover {
     background-color:#333333;
     border-left:3px solid #ffffff;
}
 .xwb-nav-sub1, .xwb-nav-sub2 {
     background-color:#646469;
     background: #646469 url("https://stagewww.utrgv.edu/branding-draft/_files/images/content/back-gray-lines-01.webp") repeat-x bottom;
}
 .xwb-nav-sub1 a, .xwb-nav-sub2 a, .xwb-nav-sub3 a {
     font-weight:normal;
     padding-left:15px;
}
 .dropdown-toggle {
     outline: 0;
}
 .xnav-flush .nav-link {
     border-radius: 0;
}
/* TOGGLE */
 .wb-btn-toggle {
     display: inline-flex;
}
 .wb-btn-toggle:hover, .wb-btn-toggle:focus {
     color:#ffffff;
     background-color: #333333;
}
 .wb-btn-toggle::after {
     margin-top:-5px;
     padding-right:5px;
     width: 1em;
     font-size:1.5em;
     content: ">";
     transition: transform .35s ease;
     transform-origin: 50% 50%;
     right:0;
     position:absolute;
}
 .wb-btn-toggle[aria-expanded="true"] {
}
 .wb-btn-toggle[aria-expanded="true"]::after {
     padding-top:5px;
     transform: rotate(90deg);
}
 .wb-btn-toggle-nav a {
     display: inline-flex;
     margin-left:1.25rem;
     text-decoration: none;
     
}
 .wb-btn-toggle-nav a:hover, .wb-btn-toggle-nav a:focus {
     color:#ffffff;
     background-color: #333333;
}
 .wb-collapse ul {
     border-left:0px solid #f5f5f5;
}
 .wbicon {
     display: none;
}
 .xwb-sidebar-nav li a:hover {
     background-color:#424242;
     color:#ffffff;
}
 .wb-active {
     background-color:#000000;
     color:#ffffff;
}
 .xwebbook .nav-link a:hover !important{
     color:#ffffff;
     background-color:#cb4900;
}
 .xwebbook .nav-link a.active !important {
     color:#ffffff;
     background-color:#cb4900;
}
.webbook table.table-style-1 {
     border:1px solid #eeeeee;
}
.webbook table.table-style-1 th, table.table-style-1 td {
     padding:10px;
     text-align:left;
}
.webbook table.table-style-1 th {
     background-color:#eeeeee;
}
.webbook table.table-style-1 td {
     border-bottom: 1px solid #eeeeee;
}

.webbook table.table-style-1 tr:hover { background-color:#eeeeee; }

 .wb-top-left, .wb-top-right {
     border-bottom:2px solid #646469;
     margin-bottom:10px;
}
 .wb-menu-h1 {
     margin-left:-10px;
     text-wrap:balance;
}
 .wb-main-h1 h1 a {
     font-size:1.2rem;
     border-bottom:3px solid #646469;
     padding-bottom:10px;
     margin-top:10px;
     margin-bottom:15px;
     line-height:.75rem;
}
 .webbook h2.title {
     margin:10px 0px 20px 0px;
}
 .wb-menu-sec {
     padding:10px;
     background-color:#eeeeee;
     border-rigth:2px solid #cb4900;
     margin-right:10px;
}
 .wb-body-full {
}
 .wb-body-2 {
     display:grid;
     grid-template-columns: repeat(2, 1fr);
}
 .wb-body-2-1 {
     display:grid;
     grid-template-columns: 2fr 1fr;
}

 .banner-border-left-gray-v3 {
     display:block;
     border-radius: 1rem;
     padding:20px;
     background-color:#fafafa;
     color:#646469;
     border-left:15px solid #646469;
}
 .banner-border-left-orange-v3 {
     display:block;
     border-radius: 1rem;
     padding:20px;
     background-color:#fafafa;
     color:#646469;
     border-left:15px solid #cb4900;
}
 .banner-border-left-right-gray-v3 {
     display:block;
     border-radius: 1rem;
     padding:20px;
     background-color:#fafafa;
     color:#646469;
     border-left:15px solid #646469;
     border-right:15px solid #646469;
}
 .banner-border-left-right-orange-v3 {
     display:block;
     border-radius: 1rem;
     padding:20px;
     background-color:#fafafa;
     color:#646469;
     border-left:15px solid #cb4900;
     border-right:15px solid #cb4900;
}
 .note-icon-left-gray-v3 {
     display:grid;
     width:100%;
     grid-template-columns:100px 1fr;
     background-color: #f5f5f5;
}
 .note-icon-left-gray-v3 div:first-child {
     display:flex;
     align-items:center;
     justify-content:center;
     padding:5px;
     background-color: #eeeeee;
}
 .note-icon-left-gray-v3 div:nth-child(2) {
     display:flex;
     align-items:center;
     padding:15px;
}
 .note-icon-left-gray-v3 .icon-v3 {
     color:#646469;
     font-size:70px;
}
 @media screen and (max-width: 800px) {
     #wb-sidebar-desktop {
         display:none;
    }
     #wb-sidebar-mobile {
         display:block;
         overflow-y:auto;
         max-height:100vh;
    }
     .wbicon {
         color:#ffffff;
         display: block;
         width:100%;
         margin-left:20px;
         background-color:#424242;
    }
     a.wbicon, a.wbicon:hover, a.wbicon:active {
         color:#ffffff;
    }
     .webbook {
         grid-template-columns:1fr;
    }
     .wb-frame-sidebar {
         grid-column: 1;
    }
     .wb-sidebar {
         padding-bottom:20px;
        background:none;
         background-color:#424242;
    }
     .wb-frame-body {
    }
     .wb-nav-left {
         display:none;
    }
     .wb-nav-left.showit {
         display:block;
    }
     .wb-content {
         width:96%;
         margin-left:2%;
         margin-right:2%;
    }
     .wb-hero-ratio {
         aspect-ratio:1;
    }
}
 @media screen and (min-width: 801px) {
     .wbicon {
         display:none;
    }
     #wb-sidebar-desktop {
         display:block;
    }
     #wb-sidebar-mobile {
         display:none;
    }
}
