/* Leeds shell and Bootstrap 5 compatibility styles for the marks site. */
body { background: #f4f2f0; }

header#masthead {
    background: #212121;
    display: block;
    clear: both;
    height: 52px;
    color: #fff;
}
.logo img { display: block; height: 32px; width: auto; }
.logo-mark { margin: 10px; }
.logo-full { display: none; }

.local-header { background: #b31b1b; color: #fff; padding-inline: 10px; }
.local-header-inner { min-height: 54px; }
.local-header-title { padding-left: 10px; }
.local-header a {
    color: #fff;
    font-family: freight-sans-pro, Arial, sans-serif;
    font-size: 1.35rem;
    font-variant-numeric: lining-nums;
    line-height: 1.3;
    text-decoration: none;
}

button.bi-search, button.bi-chevron-double-up {
    margin: 0;
    padding: .6rem;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 1.15rem;
}
button.bi-search span, button.bi-chevron-double-up span, #btn__nav span { display: none; }
#btn__nav {
    margin-top: 18px;
    border: 0;
    background: transparent;
    color: #fff;
    font-size: 1.75rem;
}

#sitesearch .card { background: #fff; }
#sitesearch form { width: 100%; }
#sitesearch .student-search-row > .flex-grow-1 { min-width: 0; }
#sitesearch .student-search-row .row { flex-wrap: nowrap; }
#sitesearch .student-search-row .col { min-width: 0; }
#sitesearch .select2-container { min-width: 16rem; width: 100% !important; }
#sitesearch .student-search-help { flex: 0 0 auto; }
#sitesearch .student-search-help .bi { margin-right: 0; }

nav#mainmenu, nav#secondarymenu { display: none; }
.navbar-inner { margin: 0; gap: .25rem .5rem; }
.navbar-nav { gap: .1rem; }
.navbar-nav .nav-link {
    color: #4a4a4a;
    display: block;
    font-family: freight-sans-pro, Arial, sans-serif;
    font-size: .9rem;
    font-weight: 400;
    padding: .55rem .65rem;
    text-decoration: none;
    text-transform: uppercase;
    transition: background-color .2s ease;
    white-space: nowrap;
}
.navbar-nav .nav-link:hover, .navbar-nav .nav-link:focus, .navbar-nav .nav-link.active {
    background: #eee;
    color: #111;
}
.dropdown-menu .dropdown-item { font-size: .875rem; }
.offcanvas .navbar-nav, .offcanvas .user-navigation { flex-direction: column !important; }
.offcanvas .dropdown-menu { position: static !important; border: 0; box-shadow: none; }
.marks-navigation { border-left: 1px solid #dee2e6; }

main {
    min-height: 55vh;
    overflow-x: auto;
    padding: 2rem 1.5rem;
    background: #fff;
}
main h1, main h2, main h3 { color: #212121; margin-top: 1.25rem; }
main img { max-width: 100%; height: auto; }
main table:not(.ui-datepicker-calendar) {
    width: 100%;
    margin-bottom: 1.5rem;
    border-collapse: collapse;
}
main table:not(.ui-datepicker-calendar) th,
main table:not(.ui-datepicker-calendar) td {
    padding: .65rem .75rem;
    border-bottom: 1px solid #dee2e6;
    vertical-align: top;
}
main table:not(.ui-datepicker-calendar) thead th { border-bottom: 2px solid #b31b1b; }
.card-header { background: #f4f2f0; }
.button {
    display: inline-block;
    padding: .375rem .75rem;
    border: 1px solid #6c757d;
    border-radius: .25rem;
    background: #6c757d;
    color: #fff;
}
.red, .errorlist { color: #b31b1b; font-weight: 600; }
.bi { display: inline-block; margin-right: .2rem; }
.figure { display: block; max-width: 100%; height: auto; }

footer {
    margin-top: 0;
    padding: 8px 0;
    background: #111;
    color: #fff;
    font-family: freight-sans-pro, Arial, sans-serif;
    font-size: .75rem;
}
footer .navbar-nav .nav-link, footer a:visited, footer a:hover {
    padding-inline: 1.25rem;
    background: transparent;
    color: #fff;
    font-size: .75rem;
    text-decoration: none;
}

#CookielawBanner { bottom: 0; max-height: 25vh; overflow-y: auto; padding: .65rem 0; }
#CookielawBanner .container { max-width: 1320px; margin: 0 auto; padding: 0 1rem; color: #fff; }
#CookielawBanner h6 { margin: 0 0 .25rem; font-size: .9rem; }
#CookielawBanner p { margin: 0; font-size: .8rem; line-height: 1.35; }
#CookielawBanner .btn { float: right; margin: 0 0 .25rem 1rem; }

@media (min-width: 480px) {
    header#masthead { height: 73px; }
    .logo-full { display: block; margin: 10px; }
    .logo-full img { height: 53px; }
    .logo-mark { display: none; }
    #btn__nav { display: none; }
    nav#mainmenu, nav#secondarymenu { display: flex; }
    .local-header a { font-size: 1.1rem; }
    main { font-size: .9375rem; }
    main h1 { font-size: 2rem; }
    main h2 { font-size: 1.25rem; }
    main h3 { font-size: 1.1rem; }
}

@media (max-width: 767.98px) {
    main { padding: 1.25rem .8rem; }
    main table { font-size: .875rem; }
    #CookielawBanner p { font-size: .72rem; }
}

/* Bootstrap's RFS stylesheet enlarges headings on wide screens. */
@media (min-width: 1280px) {
    main h1,
    main h2,
    main h3,
    main h4,
    main h5,
    main h6 {
        font-size: 1.25rem;
        line-height: 1.3;
    }
}