.site-header {
    background: radial-gradient(circle at top left, rgba(255,255,255,.12), transparent 30%), linear-gradient(135deg, #2d2926, #4b3b2f 55%, #6a4f34);
    color: white;
    box-shadow: 0 4px 14px rgba(0,0,0,.28);
}

.compact-site-header {
    padding: .9rem 1rem;
}

.site-wrap {
    max-width: 1100px;
    margin: 0 auto;
    padding: 0 1rem;
}

.site-brand {
    color: #f1e7d6;
    text-decoration: none;
    font-weight: 700;
    font-size: 1.1rem;
    letter-spacing: .02em;
}

    .site-brand:hover,
    .site-brand:focus {
        color: white;
        text-decoration: underline;
}

/* 66pacific modern gold/copper calculator button */
/*.calc-action-button {
    display: inline-block;
    min-width: 150px;
    min-height: 45px;
    font-size: 1.8rem;
    font-weight: 700;
    color: white;
    padding: .6rem 1.15rem;
    border-radius: 10px;
    background: linear-gradient(#d7a14a, #b97918);
    border: 1px solid #8d5c11;
    box-shadow: inset 0 1px 0 rgba(255,255,255,.32), 0 2px 0 #764a0d, 0 5px 9px rgba(0,0,0,.16);
    text-shadow: 0 -1px 0 rgba(0,0,0,.25);
    cursor: pointer;
}

    .calc-action-button:hover {
        background: linear-gradient(#dfad59, #c28119);
        color: white;
    }*/

/* STL test page: main calculate button */

    .stl-modern-test .calc-button-row {
        text-align: center;
        margin: 1.25rem 0 .75rem;
    }

    .stl-modern-test .calc-action-button {
        display: inline-block;
        min-width: 180px;
        min-height: 52px;
        font-size: 1.8rem;
        font-weight: 800;
        color: white;
        padding: .65rem 1.5rem;
        border-radius: 12px;
        background: linear-gradient(#e5b866 0%, #d49a3c 45%, #b97918 100%);
        border: 1px solid #8d5c11;
        border-bottom: 4px solid #6f4309;
        box-shadow: inset 0 2px 0 rgba(255,255,255,.38), inset 0 -2px 0 rgba(0,0,0,.12), 0 3px 0 #6f4309, 0 8px 14px rgba(0,0,0,.22);
        text-shadow: 0 -1px 0 rgba(0,0,0,.35);
        cursor: pointer;
    }

    .stl-modern-test .calc-action-button:hover {
        background: linear-gradient(#edc577 0%, #dda64b 45%, #c28119 100%);
        color: white;
    }

    .stl-modern-test .calc-action-button:active {
        transform: translateY(3px);
        border-bottom-width: 1px;
        box-shadow: inset 0 2px 0 rgba(255,255,255,.25), inset 0 -1px 0 rgba(0,0,0,.10), 0 1px 0 #6f4309, 0 4px 8px rgba(0,0,0,.18);
    }


    .calc-action-button:active {
        transform: translateY(2px);
        box-shadow: inset 0 1px 0 rgba(255,255,255,.25), 0 1px 0 #764a0d;
    }

/* STL calculator page test styling */

.stl-modern-test {
    background: #f7f4ed;
    color: #2e2a27;
    font-family: system-ui, -apple-system, BlinkMacSystemFont, "Segoe UI", Arial, sans-serif;
    line-height: 1.5;
}

    .stl-modern-test .container-fluid {
        background: #f7f4ed;
    }

    .stl-modern-test .row.content {
        height: auto;
        min-height: 0;
    }

    .stl-modern-test h1,
    .stl-modern-test h2,
    .stl-modern-test h3 {
        color: #4a3d32;
    }

    .stl-modern-test h1 {
        margin-top: 1.2rem;
        margin-bottom: 1rem;
        line-height: 1.2;
    }

    .stl-modern-test .dataentry,
    .stl-modern-test #divInputs,
    .stl-modern-test #displayResultsBlock {
        background: linear-gradient(#fffdf8, #f6f0e6);
        border: 1px solid #d9cfbe;
        border-radius: 14px;
        box-shadow: 0 2px 4px rgba(0,0,0,.08), 0 10px 18px rgba(0,0,0,.08);
        padding: 1rem;
        margin-bottom: 1rem;
    }

    .stl-modern-test input[type="text"],
    .stl-modern-test select,
    .stl-modern-test textarea {
        background: #fffdf8;
        color: #2e2a27;
        border: 1px solid #c8bca9;
        border-radius: 6px;
        padding: .35rem .45rem;
    }

        .stl-modern-test input[type="text"]:focus,
        .stl-modern-test select:focus,
        .stl-modern-test textarea:focus {
            border-color: #c58b2a;
            outline: none;
            box-shadow: 0 0 0 2px rgba(197,139,42,.22);
        }

    .stl-modern-test .sidenav {
        background: #eee5d7;
        color: #2e2a27;
    }

    .stl-modern-test footer {
        background: transparent;
        color: #5c5349;
    }
    
    /* STL test page: soften left TOC links */

    .stl-modern-test .sidenav {
        background: #eee5d7;
        color: #2e2a27;
        border-right: 1px solid #d9cfbe;
        padding: 1rem;
    }

        /*.stl-modern-test .sidenav a,
        .stl-modern-test .sidenav a:link,
        .stl-modern-test .sidenav a:visited {
            color: #6a4f34 !important;
            text-decoration: none;
            font-weight: 600;
        }

            .stl-modern-test .sidenav a:hover,
            .stl-modern-test .sidenav a:focus {
                color: #2d2926 !important;
                text-decoration: underline;
            }
            */


        /*Hack in new sidebar*/

    /* STL test page: simple calculator TOC pills */

    /* STL test page: simple calculator TOC pills */

    /* STL test page: simple calculator TOC links */

    /* STL test page: simple calculator TOC links */

    /* STL test page: subtle calculator TOC links */

        /* STL test page: subtle calculator TOC links */

        /* STL test page: subtle but visibly clickable calculator TOC links */

        .stl-modern-test .sidenav .calculator-toc {
            max-width: 240px;
        }

            .stl-modern-test .sidenav .calculator-toc a,
            .stl-modern-test .sidenav .calculator-toc a:link,
            .stl-modern-test .sidenav .calculator-toc a:visited {
                display: block !important;
                color: #7a4f1b !important;
                background: rgba(255,253,248,.55) !important;
                border: 1px solid rgba(217,207,190,.75) !important;
                border-left: 4px solid #c58b2a !important;
                border-radius: 6px !important;
                padding: .32rem .5rem .32rem .6rem !important;
                margin: .24rem 0 !important;
                text-decoration: none !important;
                font-weight: 650 !important;
                box-shadow: none !important;
                transform: none !important;
            }

                .stl-modern-test .sidenav .calculator-toc a::before {
                    content: "" !important;
                }

                .stl-modern-test .sidenav .calculator-toc a:hover,
                .stl-modern-test .sidenav .calculator-toc a:focus {
                    color: #2d2926 !important;
                    background: #fffdf8 !important;
                    border-color: #c58b2a !important;
                    border-left-color: #8d5c11 !important;
                    text-decoration: underline !important;
                    text-underline-offset: 3px;
                    box-shadow: none !important;
                    transform: none !important;
                }

                .stl-modern-test .sidenav .calculator-toc a:active {
                    background: #f6f0e6 !important;
                }

    /* STL test page: make results visually distinct */

    .stl-modern-test #displayResultsBlock {
        background: linear-gradient(#fff8ea, #f2e3c7);
        border: 2px solid #c58b2a;
        border-radius: 14px;
        box-shadow: 0 2px 4px rgba(0,0,0,.10), 0 12px 22px rgba(0,0,0,.12);
        padding: 1.1rem;
        margin-top: 1.25rem;
        margin-bottom: 1.25rem;
    }

        .stl-modern-test #displayResultsBlock h2,
        .stl-modern-test #displayResultsBlock h3 {
            color: #4a3d32;
            border-bottom: 3px solid #c58b2a;
            display: inline-block;
            padding-bottom: .2rem;
        }

        .stl-modern-test #displayResultsBlock table {
            background: rgba(255,255,255,.35);
        }

        .stl-modern-test #displayResultsBlock td,
        .stl-modern-test #displayResultsBlock th {
            padding: .25rem .4rem;
        }

    /* STL test page: make radio buttons match the copper/gold theme */

    .stl-modern-test input[type="radio"],
    .stl-modern-test input[type="checkbox"] {
        accent-color: #b97918;
    }

    /* STL test page: footer links */

    .stl-modern-test footer {
        background: transparent;
        color: #5c5349;
        text-align: center;
        padding: 1.5rem 0 2rem;
        font-size: 1.9rem;
    }

        .stl-modern-test footer a,
        .stl-modern-test footer a:link,
        .stl-modern-test footer a:visited {
            color: #6a4f34 !important;
            text-decoration: none;
            font-weight: 700;
        }

            .stl-modern-test footer a:hover,
            .stl-modern-test footer a:focus {
                color: #2d2926 !important;
                text-decoration: underline;
            }

    /* STL test page: center and polish main page title */

    .stl-modern-test h1 {
        text-align: center;
        color: #4a3d32;
        font-weight: 700;
        margin-top: 1.4rem;
        margin-bottom: 1.4rem;
    }
/* STL test page: make left TOC links look clickable 

    .stl-modern-test .sidenav {
        padding: 1rem;
    }

        .stl-modern-test .sidenav a,
        .stl-modern-test .sidenav a:link,
        .stl-modern-test .sidenav a:visited {
            display: block;
            color: #6a4f34 !important;
            background: #fffdf8;
            border: 1px solid #d9cfbe;
            border-radius: 8px;
            padding: .35rem .5rem;
            margin: .22rem 0;
            text-decoration: none;
            font-weight: 700;
            box-shadow: 0 1px 2px rgba(0,0,0,.06);
        }

            .stl-modern-test .sidenav a::before {
                content: "› ";
                color: #b97918;
                font-weight: 900;
            }

            .stl-modern-test .sidenav a:hover,
            .stl-modern-test .sidenav a:focus {
                color: #2d2926 !important;
                background: #f6f0e6;
                border-color: #c58b2a;
                text-decoration: none;
                transform: translateX(2px);
                box-shadow: 0 2px 5px rgba(0,0,0,.10);
            }*/

    /* STL test page: left TOC navigation pills */

    .stl-modern-test .sidenav {
        padding: 1rem;
    }

        .stl-modern-test .sidenav a,
        .stl-modern-test .sidenav a:link,
        .stl-modern-test .sidenav a:visited {
            display: block;
            width: 100%;
            box-sizing: border-box;
            color: #6a4f34 !important;
            background: linear-gradient(#fffdf8, #f2e8d8);
            border: 1px solid #cdbfaa;
            border-bottom: 3px solid #b89a72;
            border-radius: 8px;
            padding: .4rem .55rem;
            margin: .28rem 0;
            text-decoration: none;
            font-weight: 700;
            box-shadow: inset 0 1px 0 rgba(255,255,255,.75), 0 2px 3px rgba(0,0,0,.12);
        }

            .stl-modern-test .sidenav a::before {
                content: "› ";
                color: #b97918;
                font-weight: 900;
            }

            .stl-modern-test .sidenav a:hover,
            .stl-modern-test .sidenav a:focus {
                color: #2d2926 !important;
                background: linear-gradient(#fffaf0, #ead8bd);
                border-color: #c58b2a;
                border-bottom-color: #8d5c11;
                text-decoration: none;
                transform: translateY(-1px);
                box-shadow: inset 0 1px 0 rgba(255,255,255,.85), 0 4px 7px rgba(0,0,0,.16);
            }

            .stl-modern-test .sidenav a:active {
                transform: translateY(1px);
                border-bottom-width: 1px;
                box-shadow: inset 0 1px 2px rgba(0,0,0,.15), 0 1px 2px rgba(0,0,0,.10);
            }