/* SKIP TO MAIN - USE THIS CSS VAR TO OVERRIDE CSS IN YOUR THEME! */

:root {
    --skip-to-main-outline: none;
    --skip-to-main-outline-offset: 0;
    --skip-to-main-background-color: white;
    --skip-to-main-color: black;
    --skip-to-main-height: auto;
    --skip-to-main-width: 30%;
    --skip-to-main-border-color: var(--skip-to-main-color);
    --skip-to-main-border-size: 1px;
    --skip-to-main-margin: 0.5rem 0 0 0;
    --skip-to-main-padding: 1rem;
    --skip-to-main-border-radius: 1rem;
    --skip-to-main-font-size: 1rem;
    --skip-to-main-border-font-weight: bold;
    --skip-to-main-border-text-align: center;
    --skip-to-main-text-decoration: 1rem;
}

a.skip-to-main,
a.pause-car
 {
    position: fixed;
    left: -99999px;
    top: -99999px;
    z-index: -999999999999;
    width: 1px;
    height: 1px;
    overflow: hidden;
}

a.skip-to-main:focus, 
a.skip-to-main:active {
    box-sizing: border-box;
    left: 50%;
    top: 0;
    transform: translate(-50%,0);
    z-index: 999999999999;
    overflow: auto;
    color: var(--skip-to-main-color);
    background-color: var(--skip-to-main-background-color);
    width: var(--skip-to-main-width);
    height: var(--skip-to-main-height);
    margin: var(--skip-to-main-margin);
    padding: var(--skip-to-main-padding);
    border-radius: var(--skip-to-main-border-radius);
    border: solid var(--skip-to-main-border-size) var(--skip-to-main-border-color);
    font-size: var(--skip-to-main-border-font-size);
    font-weight: var(--skip-to-main-border-font-weight);
    text-align: var(--skip-to-main-border-text-align);
    text-decoration: var(--skip-to-main-text-decoration);
}

a.skip-to-main:focus, 
a.skip-to-main:focus-visible {
    outline: var(--skip-to-main-outline);
    outline-offset: var(--skip-to-main-outline-offset);
}
