/* --------------------------- */
/* STANDARD                    */
/* --------------------------- */
html {
    font-size: 14px;
}

@media (min-width: 768px) {
    html {
        font-size: 16px;
    }
}

.btn:focus, .btn:active:focus, .btn-link.nav-link:focus, .form-control:focus, .form-check-input:focus {
    box-shadow: 0 0 0 0.1rem white, 0 0 0 0.25rem #258cfb;
}

html {
    position: relative;
    min-height: 100%;
}

body {
    margin-bottom: 60px;
}



/* --------------------------- */
/* WEEK INFO                   */
/* --------------------------- */
@media (min-width: 1200px) {
    .week-info {
        font-size: 1.5rem;
    }
}

.week-info {
    font-weight: 500;
    line-height: 1.2;
}



/* --------------------------- */
/* HEADER-FOOTER               */
/* --------------------------- */
.header-left, .footer-left, .body-left {
    text-align: right !important;
}

.header-middle, .footer-middle, .body-middle {
    text-align: center !important;
}

.header-right, .footer-right, .body-right {
    text-align: left !important;
}

/* MOBILE */
/* 
    @media only screen and (min-device-width: 390px) and (max-device-width: 428px) 
    @media only screen and (min-device-width: 300px) and (max-device-width: 470px)
*/
@media only screen and (min-device-width: 300px) and (max-device-width: 470px) {
    .header-left, .footer-left, .body-left {
        text-align: center !important;
    }

    .header-right, .footer-right, .body-right {
        text-align: center !important;
    }
}

/* @media only screen and (max-width: 776px) */
@media only screen and (max-width: 776px) {
    .image-fit img {
        width: 100%;
        object-fit: contain;
    }
}