/**
 * @file
 * This file contains styling for reusable base elements.
 *
 * Subthemes may want to completely override this file.
 */

:root {
    --main-font: Roboto, Arial, sans-serif;
    --heading-font: "Roboto Slab", serif;
    --font-color: #262729;
    --initial-font-size: 1.125em;
    --initial-line-height: 1.667;
    --letter-spacing: 1px;
    --background-color: #fff;
    --link-color: #002d5b;
    --primary-branding-color: #0054a6;
    --secondary-branding-color: #002d5b;
    --accent-color: #f88818;
    --hover-accent-color: #dedede;
    --flash-info-color: var(--black);
    --flash-info-background-color: #6bc0eb;
    --flash-notice-color: var(--black);
    --flash-notice-background-color: #80eb6f;
    --flash-important-color: var(--black);
    --flash-important-background-color: #ff0;
    --flash-warning-color: var(--black);
    --flash-warning-background-color: #ff8000;
    --flash-danger-color: var(--white);
    --flash-danger-background-color: #b40000;
    --black: #262729;
    --dark-gray: #595959;
    --light-gray: #ccc;
    --white: #fff;
    --section-main-width: 98vw;
}

@media only screen and (min-width: 700px) {
    :root {
        --section-main-width: 88vw;
    }
}
