/* MY - Bradford City | Custom CSS */
/* Version: 1.0 */
table {
    width: 100%;
    border-collapse: collapse;
    font-family: 'Noto', sans-serif;
}
th, td {
    border: 1px solid #ddd;
    padding: 8px;
    text-align: left;
}
tr:nth-child(even) {
    background-color: #f2f2f2;
}
th {
    background-color: #fff;
    color: #000;
    padding: 10px 0;
    text-align: center;
}
.selected {
    background-color: yellow !important;
}
.tried {
    background-color: grey !important;
}
/* Typography */
h1 {
    font-size: calc(2rem + 1vw);
}
h2 {
    font-size: calc(1.75rem + 0.75vw);
}
h3 {
    font-size: calc(1.5rem + 0.5vw);
}
h4 {
    font-size: calc(1.25rem + 0.25vw);
}
h5 {
    font-size: calc(1rem + 0.25vw);
}
h6 {
    font-size: calc(0.75rem + 0.25vw);
}
h1, h2, h3, h4, h5, h6 {
    font-family: 'DM Serif Text', serif;
}
p, a, li {
    font-family: 'Noto', sans-serif;
    font-size: calc(1rem + 0.25vw);
}
a {
    transition: 0.35s ease;
    text-decoration: none;
    font-weight: bold;
    color: #549ff5;
}
a:hover {
    color: #e0e0e0;
}
.half-size {
    font-size: calc(0.75rem + 0.25vw) !important;
}
.quarter-size {
    font-size: calc(0.5rem + 0.25vw) !important;
    text-align: center;
}
.text-hero {
    font-size: calc(3rem + 1vw);
    text-shadow: #000 1px 1px 5px;
}
.line-height-0 {
    line-height: 0;
}
.todays-date {
    font-size: calc(0.75rem + 0.25vw);
    text-align: right;
    color: #990707 !important;
    background-color: #fff; padding: 5px 10px;
    vertical-align: middle;
}

/* Colors */
.bg-blue {
    background-color: #103560;
}
.text-blue {
    color: #103560;
}
.bg-red {
    background-color: #990707;
}
.text-red {
    color: #990707;
}
.bg-white-75 {
    background-color: rgba(255, 255, 255, 0.75);
}

/* Nav Settings */
.navbar-toggler {
    border: 2px solid #fff;
    background-color: #990707;
}
.nav-link {
    color: #fff;
    transition: 0.35s ease;
    border-bottom: transparent 2px solid;
}
.nav-link.active {
    border-bottom: #990707 2px solid;
}
.nav-link:hover {
    color: #f8f9fa !important;
    border-bottom: #990707 2px solid;
}
.navbar-brand {
    font-family: 'DM Serif Text', serif;
    font-size: calc(1.5rem + 0.5vw);
    line-height: 0;
}

/* Background Images */
.bg-flag {
    background-image: url('/images/OCH-5-1.webp');
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    background-attachment: fixed;
}

/* Images */
.my-headshot {
    margin-bottom: -25px;
}

/* Buttons */
.btn-blue {
    background-color: #103560;
    color: #f8f9fa;
    border: 2px solid #103560;
    padding: 10px 25px;
    box-shadow: 0 12px 18px -6px rgba(0,0,0,0.3);
    transition: 0.35s ease;
}
.btn-blue:hover {
    background-color: #990707;
    color: #fff;
    border: 2px solid #990707;
    box-shadow: 0 12px 18px -12px rgba(0,0,0,0.3);
}

.w-10 {
    width: 20%;
}

/* Card Settings */
.card {
    border: 2px solid #e0e0e0;
    transition: 0.35s ease;
}
.card:hover {
    border: 2px solid #990707;
}

/* Hide and show on desktop or mobile */
.hide-on-desktop {
    display: none;
}

/* Hide and show on mobile */
.hide-on-mobile {
    display: block;
}
@media screen and (max-width: 968px) {
    .hide-on-desktop {
        display: block;
    }
    .hide-on-mobile {
        display: none;
    }
}