/* 01-base.css
   Global defaults only: typography, element defaults, links, tiny utilities.
-------------------------------------------------------------- */

/* Document + typography */
body {
    font-family: var(--font-sans);
    margin: 0;
    background: var(--color-bg);
}

body, td, input, textarea, select {
    font-size: var(--text-base);
    color: var(--color-text);
}

p {
    margin: 0 0 var(--space-5) 0;
}

pre, form, fieldset {
    margin: 0;
    padding: 0;
}

h2 {
    font: bold var(--text-sm) Verdana, Arial, sans-serif;
    margin: 0 0 var(--space-3) 0;
    padding: 0;
}

h3 {
    font: bold 11px Verdana, Arial, sans-serif;
    margin: 0 0 var(--space-3) 0;
    padding: 0;
}

hr {
    margin: var(--space-4) 0;
    padding: 0;
    width: 100%;
    border-top: var(--border-1) solid var(--color-hr);
}

/* Links */
a:link, a:active {
    color: var(--color-link);
    text-decoration: none;
}

a:hover {
    color: var(--color-link-hover);
    text-decoration: underline;
}

a:visited {
    color: var(--color-link);
    text-decoration: none;
}

.selected-link:link, .selected-link:visited {
    text-decoration: none;
    color: var(--color-text);
}

.btn-link {
    background: none;
    border: none;
    color: var(--color-link);
    text-decoration: none;
    cursor: pointer;
    padding: 0;
    font: inherit;
}

.btn-link:hover {
    color: var(--color-link-hover);
    text-decoration: underline;
}

.callout:link, .callout:active, .callout:visited {
    text-decoration: none;
    color: var(--color-text);
}

.callout:hover, .callout:focus {
    border-bottom: var(--border-1) dashed var(--color-link-hover);
}

/* Element resets / misc globals */
img {
    border: 0;
}

table {
    border: 0;
}

br {
    clear: both;
}  /* legacy behavior */

/* Global utility classes */
.clear {
    clear: both;
}

.show {
    display: revert;
}

.hide {
    display: none;
}