:root {
    --color-white: #fff;
    --color-white-2: #f6f6f6;
    --color-black: #000;
    --color-black-2: #1a1a1a;
    --color-black-3: #222222;
    --color-black-highlighted: #45423f;
    --color-dark-gray: #333;
    --color-medium-gray: #666;
    --color-medium-gray-1: #696979;
    --color-medium-gray-2: #676767;
    --color-medium-gray-3: #737373;
    --color-medium-gray-4: #d6d6d6;
    --color-light-gray: #ebebeb;
    --color-light-gray-1: #e6e6e6;
    --color-light-gray-2: #c3c3c3;
    --color-light-gray-3: #666;
    --color-dark-blue: #00719a;
    --color-blue: #007fad;
    --color-blue-2: #008bbe;
    --color-blue-3: #0376a1;
    --color-medium-blue: #4bbbe0;
    --color-light-blue: #a4d8ef;
    --color-light-blue-1: #e7ecef;
    --color-light-blue-2: #d3e4eb;
    --color-light-blue-3: #e5f3f8;
    --color-teal: #70eae1;
    --color-seafoam: #b9dddb;
    --color-red: #a70e13;
    --color-red-2: #f74f4f;
    --color-gold: #d58000;
    --color-gold-dark: #a86800;
    --color-green: #00a859;
    --color-tan: #e8d3be;
    --app-bg: var(--color-white);
    --nav-bg: var(--color-white);
    --font-sans: var(--font-stack-america, Helvetica, Arial, sans-serif);
    --font-serif: var(--font-stack-crimson, Georgia, serif);
    --font-mono: ui-monospace, Menlo, Monaco, "Cascadia Mono", "Segoe UI Mono", "Roboto Mono", "Oxygen Mono", "Ubuntu Monospace", "Source Code Pro", "Fira Mono", "Droid Sans Mono", "Courier New", monospace;
    --font-display: var(--font-stack-america, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, sans-serif);
    --font-heading: var(--font-sans);
    --font-subheading: var(--font-serif);
    --font-body: var(--font-serif);
    --standard-gutter: 20px;
    --standard-width: calc(100% - 40px);
    --standard-max-width: 1335px;
    --nav-inset-top: 0px;
    --nav-offset: calc(var(--nav-inset-top, 0px) + var(--nav-height, 0px));
}

@supports (-webkit-touch-callout: none) {
    :root {
        --safe-vph: var(--vph, -webkit-fill-available)
    }
}

@supports (height: 100svh) {
    :root {
        --safe-vph: 100svh;
        --dynamic-vph: 100dvh
    }
}

@font-face {
    font-family: "America Temp: Helvetica Neue";
    src: local("Helvetica Neue");
    ascent-override: 99.1131%;
    descent-override: 25.5712%;
    size-adjust: 101.35%
}

@font-face {
    font-family: "America Temp: Helvetica Neue";
    src: local("Helvetica Neue Bold");
    font-weight: 700;
    ascent-override: 99.1131%;
    descent-override: 25.5712%;
    size-adjust: 100%
}

@font-face {
    font-family: "America Temp: Helvetica";
    src: local("Helvetica");
    ascent-override: 105%;
    descent-override: 50%;
    size-adjust: 102.1735%
}

@font-face {
    font-family: "America Temp: Helvetica";
    src: local("Helvetica Bold");
    font-weight: 700;
    ascent-override: 105%;
    descent-override: 50%;
    size-adjust: 99.75%
}

@font-face {
    font-family: "America Temp: Arial";
    src: local("Arial");
    ascent-override: 97.8728%;
    descent-override: 25.2512%;
    size-adjust: 102.1735%
}

@font-face {
    font-family: "America Temp: Arial";
    src: local("Arial Bold");
    ascent-override: 97.8728%;
    font-weight: 700;
    descent-override: 25.2512%;
    size-adjust: 99.75%
}

@font-face {
    font-family: "America Temp: Roboto";
    src: local("Roboto");
    ascent-override: 97.981%;
    descent-override: 25.2791%;
    size-adjust: 101.915%
}

@font-face {
    font-family: "America Temp: Roboto";
    src: local("Roboto Bold");
    font-weight: 700;
    ascent-override: 97.981%;
    descent-override: 25.2791%;
    size-adjust: 106.5%
}

@font-face {
    font-family: "Crimson Temp: Georgia";
    src: local("Georgia");
    line-gap-override: 3.1%
}

@font-face {
    font-family: "Crimson Temp: Georgia";
    src: local("Georgia Italic");
    font-style: italic;
    size-adjust: 89.45%;
    ascent-override: 100%
}

@font-face {
    font-family: "Crimson Temp: Times New Roman";
    font-weight: 700;
    src: local("Times New Roman Bold");
    ascent-override: 114.1135%;
    descent-override: 43.1208%;
    line-gap-override: 25.8523%;
    size-adjust: 102.25%
}

@font-face {
    font-family: "Crimson Temp: Georgia";
    src: local("Georgia Bold");
    font-weight: 700;
    size-adjust: 94.35%;
    ascent-override: 100%
}

@font-face {
    font-family: "Crimson Temp: Georgia";
    src: local("Georgia Bold Italic");
    font-weight: 700;
    font-style: italic;
    size-adjust: 80.45%;
    ascent-override: 100%
}

:root {
    --font-stack-crimson: "Crimson Text", "Crimson Temp: Georgia";
    --font-stack-america: "GT America", "America Temp: Helvetica Neue", "America Temp: Helvetica", "America Temp: Arial", "America Temp: Roboto"
}

:where(*,:before,:after) {
    box-sizing: border-box;
    border-width: 0;
    border-style: solid;
    border-color: currentColor;
    border-color: var(--border-color, currentColor)
}

html {
    font-size: 100%;
    line-height: 1.5;
    font-family: GT America, "America Temp: Helvetica Neue", "America Temp: Helvetica", "America Temp: Arial", "America Temp: Roboto";
    font-family: var(--font-display, system-ui, -apple-system, Segoe UI, Roboto, Ubuntu, Cantarell, Noto Sans, sans-serif, sans-serif);
    -webkit-text-size-adjust: 100%
}

body {
    margin: 0;
    line-height: inherit
}

:where(blockquote,dd,dl,figure,h1,h2,h3,h4,h5,h6,hr,p,pre) {
    margin: 0
}

:where(fieldset) {
    margin: 0;
    padding: 0
}

:where(legend) {
    padding: 0
}

:where(ol,ul,menu) {
    list-style: none;
    margin: 0;
    padding: 0
}

:where(hr) {
    height: 0;
    color: inherit;
    border-top-width: 1px
}

:where(h1,h2,h3,h4,h5,h6) {
    font-size: inherit;
    font-weight: inherit
}

:where(table) {
    text-indent: 0;
    border-color: inherit;
    border-collapse: collapse
}

:where(a) {
    color: #007fad
}

:where(small) {
    font-size: 80%
}

:where(sub,sup) {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline
}

:where(sub) {
    bottom: -.25em
}

:where(sup) {
    top: -.5em
}

:where(summary) {
    display: list-item
}

:where(button,input,optgroup,select,textarea) {
    font-family: inherit;
    font-size: 100%;
    font-weight: inherit;
    line-height: inherit;
    color: inherit;
    margin: 0;
    padding: 0
}

:where(button,select) {
    text-transform: none
}

:where(button,[type=button],[type=reset],[type=submit]) {
    -webkit-appearance: button;
    background-color: transparent;
    background-image: none
}

:-moz-focusring {
    outline: auto
}

:-moz-ui-invalid {
    box-shadow: none
}

::-webkit-inner-spin-button, ::-webkit-outer-spin-button {
    height: auto
}

:where([type=search]) {
    -webkit-appearance: textfield;
    outline-offset: -2px
}

::-webkit-search-decoration {
    -webkit-appearance: none
}

::-webkit-file-upload-button {
    -webkit-appearance: button;
    font: inherit
}

input::-moz-placeholder, textarea::-moz-placeholder {
    opacity: 1;
    color: #9ca3af
}

input::placeholder, textarea::placeholder {
    opacity: 1;
    color: #9ca3af
}

:where(button,[role=button]) {
    cursor: pointer
}

:where(:disabled) {
    cursor: default
}

:where(img,svg,video,canvas,audio,iframe,embed,object) {
    display: block;
    vertical-align: middle
}

:where(img,video) {
    max-width: 100%;
    height: auto;
    -o-object-fit: cover;
    object-fit: cover;
    -o-object-position: 50% 15%;
    object-position: 50% 15%
}

:where(picture) {
    display: contents
}

:where(source) {
    display: none
}

[hidden] {
    display: none
}

html {
    background: #fff;
    background: var(--app-bg, #fff);
    scroll-padding-top: 0px;
    scroll-padding-top: var(--nav-offset, 1rem);
    height: 100%
}

body {
    font-family: GT America, "America Temp: Helvetica Neue", "America Temp: Helvetica", "America Temp: Arial", "America Temp: Roboto";
    font-family: var(--font-display);
    color: #333;
    color: var(--color-dark-gray)
}

.sr-only {
    white-space: nowrap;
    border-width: 0;
    font-size: 2rem;
    color: #fff;
    font-weight: bold;
}

.sr-only-focusable:focus {
    display: block;
    width: auto;
    height: auto;
    margin: 0;
    overflow: visible;
    clip: auto;
    white-space: inherit
}

.skiptocontent {
    position: fixed;
    top: 0;
    left: 0;
    padding: .5rem;
    -webkit-text-decoration: none;
    text-decoration: none;
    background: #333;
    background: var(--color-dark-gray);
    color: #fff;
    color: var(--color-white);
    z-index: 100
}

.scroll-lock, .scroll-lock body {
    height: 100vh;
    overflow: hidden !important;
    overscroll-behavior: contain
}

@media (-webkit-min-device-pixel-ratio: 2),(min-resolution: 2dppx) {
    body {
        text-rendering: geometricPrecision
    }
}

.piano-id-modal-ver-2, .piano-id-modal-ver-2 iframe {
    min-width: min(400px, 100%) !important
}
