:root {
    --canvas-color:#50B394;
    --canvas-text-color:#000000;
    --banner-color:#154E5D;
    --banner-text-color:#ffffff;
    --tile-color:#5D848D;
    --tile-text-color:#ffffff;
    --third-color:#7AB0B0;
    --third-text-color:#000000;
    --accent-color:#61223B;
    --accent-text-color:#ffffff;
    --button-text-color:#000000;
}

.bg-white {
    background-color: white !important;
    color: black;
}

.bg-canvas {
    background-color: var(--canvas-color) !important;
}

.bg-canvas,
.bg-canvas h3 {
    color: var(--canvas-text-color);
}

.bg-accent {
    background-color: var(--accent-color) !important;
}

.bg-accent,
.bg-accent p,
.bg-accent a,
.bg-accent span,
.bg-accent label,
.bg-accent th,
.bg-accent td {
    color: var(--accent-text-color);
}

.border-accent {
    border-color: var(--accent-color) !important;
}

.bg-third,
.bg-third th,
.bg-third td {
    background-color: var(--third-color) !important;
}

.bg-third,
.bg-third p,
.bg-third a,
.bg-third span,
.bg-third label,
.bg-third th,
.bg-third td {
    color: var(--third-text-color);
}

.btn-third {
    color: var(--third-text-color);
    background-color: var(--third-color);
    border-color: var(--third-color);
}

.bg-tile,
.bg-tile th,
.bg-tile td {
    background-color: var(--tile-color) !important;
}

.bg-tile,
.bg-tile p,
.bg-tile a,
.bg-tile span,
.bg-tile label,
.bg-tile th,
.bg-tile td {
    color: var(--tile-text-color);
}

.btn-tile {
    color: var(--tile-text-color);
    background-color: var(--tile-color);
    border-color: var(--tile-color);
}

.bg-banner {
    background-color: var(--banner-color) !important;
}

.bg-banner,
.bg-banner a:not(.nav-link) {
    color: var(--banner-text-color);
}

.border-banner {
    border-color: var(--banner-color) !important;
}

a.btn, label.btn {
    color: var(--button-text-color);
}

a {
    text-decoration: none;
}

a:hover {
    text-decoration: underline;
}

.navbar a:hover, a.btn:hover {
    text-decoration: none;
}

.red_border {
    border: solid 3px red;
}

.white_border {
    border: solid 1px white;
}

.navbar-toggler-icon{
    font-size: 0.8em;
}

footer {
    box-shadow: 0 50vh 0 50vh var(--banner-color);
}

h1, h2, h3, h4 {
    font-family: 'Libre Baskerville';
}