
/* FONT LINKS */
    @font-face {
        font-family: TypeLightSans;
        src: url("../fonts/TypeLightSans/TypeLightSans.ttf");
    }
    
/* TEXT STYLES */
    html {
        font-family: TypeLightSans;
        font-size: 16px;
        -webkit-font-smoothing: subpixel-antialiased;
        color: var(--colorFont);
    }
    a {
        color: var(--colorFont);
        cursor: pointer;
    }
    h1 {                                                /* LARGE HEADINGS FEATURES & PAGE TITLES */
        font-size: 1.2rem;
        line-height: 5rem;
    }
    h2 {                                                /* MENUS */
        font-size: 1.15rem;
        line-height: var(--lineHeight);
    }
    h3, details, summary, select, input, textarea, label {        /* SUB HEADINGS */
        font-family: inherit;
        font-size: 1rem;
        font-weight: bold;
        line-height: var(--lineHeight);
    }
    h4, .notes {                                        /* FOOTER TEXT */
        font-size: 0.85rem;
    }
    #cartBtn {
        position: relative;
    }
    #cartBtn h4 {
        position: absolute;
        top: 0rem;
        right: -0.7rem;
        z-index: 3;
    }
    p {
        font-size: 1rem;
        margin: 1rem 0;
    }
    u {
        text-decoration: underline;
    }
    li {
        width: 100%;
        cursor: pointer;
    }
    li:hover > * {
        color: var(--colorFade);
    }
    #galleryTreeUl li:hover > * {
        color: var(--colorFont);
    }
    button {
        font-family: TypeLightSans;
        font-size: 1rem;
        font-weight: bold;
    }
    details {
        position: relative;
        width: 100%;
        cursor: pointer;
    }
    details::before {
        position: absolute;
        top: -0.25rem;
        right: 1rem;
        font-size: 0.6rem;
        color: var(--colorFont);
        line-height: 3rem;
        content: "▼";
        z-index: 0;
    }
    details[open]::before {
        content: "▲";
    }
    details p {
        font-weight: normal;
    }
    summary {
        width: 100%;
        line-height: 3rem;
    }
    .disabled, .disabled * {
        color: var(--colorFade);
    }
    #invalidCredentials {
        display: none;
    }