﻿@import url('https://fonts.googleapis.com/css2?family=Cabin:wght@400;500;600;700&family=Poppins:ital,wght@0,300;0,400;0,500;0,600;0,700;1,400&family=Source+Code+Pro&display=swap');

:root {
    --epi-color-primary: rgb(30, 71, 130);
    --epi-color-primary-75: rgb(30, 71, 130, 0.75);
    --epi-color-primary-50: rgb(30, 71, 130, 0.5);
    --epi-color-primary-25: rgb(30, 71, 130, 0.25);
    --epi-color-secondary: rgb(45, 163, 220);
    --epi-color-secondary-75: rgb(45, 163, 220, 0.75);
    --epi-color-secondary-50: rgb(45, 163, 220, 0.5);
    --epi-color-green: rgb(17, 130, 59);
    --epi-color-green-75: rgb(17, 130, 59, 0.75);
    --epi-color-green-50: rgb(17, 130, 59, 0.5);
    --epi-color-orange: rgb(254, 104, 6);
    --epi-color-orange-75: rgb(254, 104, 6, 0.75);
    --epi-color-orange-50: rgb(254, 104, 6, 0.5);
    --epi-color-yellow: rgb(254, 216, 88);
    --epi-color-yellow-75: rgb(254, 216, 88, 0.75);
    --epi-color-yellow-50: rgb(254, 216, 88, 0.5);
    --epi-font-family-primary: 'Poppins', sans-serif;
    --epi-font-family-heading: 'Cabin', sans-serif;
    --epi-font-family-monospace: 'Source Code Pro', monospace;
    --bs-font-sans-serif: var(--epi-font-family-primary);
    --bs-font-monospace: var(--epi-font-family-monospace);
}

/* | Site Styles */
html, body, form {
    height: 100%;
}

body {
    padding-top: 125px;
}

h6, h5, h4, h3, h2, h1 {
    font-family: var(--epi-font-family-heading);
    color: var(--epi-color-primary);
}

nav {
    padding-top: 25px;
    padding-bottom: 25px;
    transition-property: padding-top, padding-bottom;
    transition-duration: 0.25s;
}

    nav .nav-link, nav .nav-link:focus {
        color: var(--epi-color-primary);
        font-weight: 600;
    }

        nav .nav-link:hover {
            color: var(--epi-color-orange);
        }

.navbar-nav a.btn {
    line-height: 2rem;
}

footer .nav-link, footer .nav-link:hover, footer .nav-link:focus {
    color: #fff;
    padding-top: 0;
    padding-right: 0;
    padding-bottom: .5rem;
    padding-left: 0;
}

footer h6 {
    color: #fff;
    font-weight: 700;
}

footer .link-icon {
    margin-right: .75rem;
}

footer svg {
    width: 30px;
}

.footer-tooltip.tooltip > .tooltip-inner {
    color: var(--epi-color-primary);
    background-color: #fff;
}

.footer-tooltip.tooltip > .tooltip-arrow {
    display: none;
}

.btn-primary {
    --bs-btn-color: #000;
    --bs-btn-padding-x: 1rem;
    --bs-btn-bg: var(--epi-color-orange);
    --bs-btn-border-color: var(--epi-color-orange);
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: var(--epi-color-orange-75);
    --bs-btn-hover-border-color: var(--epi-color-orange-75);
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: var(--epi-color-orange-75);
    --bs-btn-active-border-color: var(--epi-color-orange-75);
    --bs-btn-disabled-bg: var(--epi-color-orange);
    --bs-btn-disabled-border-color: var(--epi-color-orange);
}

.btn-outline-primary {
    --bs-btn-bg: #fff;
    --bs-btn-color: var(--epi-color-primary);
    --bs-btn-border-color: var(--epi-color-primary);
    --bs-btn-hover-bg: var(--epi-color-primary);
    --bs-btn-hover-border-color: var(--epi-color-primary);
    --bs-btn-active-bg: var(--epi-color-primary);
    --bs-btn-active-border-color: var(--epi-color-primary);
    --bs-btn-disabled-color: var(--epi-color-primary);
    --bs-btn-disabled-border-color: var(--epi-color-primary);
}

.btn-secondary {
    --bs-btn-color: #000;
    --bs-btn-padding-x: 1rem;
    --bs-btn-bg: var(--epi-color-secondary);
    --bs-btn-border-color: var(--epi-color-secondary);
    --bs-btn-hover-color: #000;
    --bs-btn-hover-bg: var(--epi-color-secondary-75);
    --bs-btn-hover-border-color: var(--epi-color-secondary-75);
    --bs-btn-active-color: #000;
    --bs-btn-active-bg: var(--epi-color-secondary-75);
    --bs-btn-active-border-color: var(--epi-color-secondary-75);
    --bs-btn-disabled-bg: var(--epi-color-secondary);
    --bs-btn-disabled-border-color: var(--epi-color-secondary);
    font-weight: 700;
}

.form-control::placeholder {
    opacity: 0.75;
}

.form-control {
    border-color: var(--bs-dark-border-subtle);
}

.link-primary {
    color: var(--epi-color-primary);
    text-decoration-color: var(--epi-color-primary);
}

    .link-primary:hover, .link-primary:focus {
        color: var(--epi-color-orange);
    }

.border-primary {
    border-color: var(--epi-color-primary) !important;
}

.table-striped > tbody > tr:nth-of-type(even) > * {
    --bs-table-accent-bg: var(--bs-table-striped-bg);
}

.table-striped > tbody > tr:nth-of-type(odd) > * {
    --bs-table-accent-bg: transparent;
}

.table-sm {
    font-size: .75rem;
}

.alert {
    --bs-alert-border-radius: 0;
}

/* | Bootstrap Supplemental Styles */
.bg-epi-primary {
    background-color: var(--epi-color-primary);
}

.border-epi-emphasis-75 {
    border-top: solid;
    border-top-color: var(--epi-color-orange-75);
    border-top-width: 2px;
    border-bottom: solid;
    border-bottom-color: var(--epi-color-orange-75);
    border-bottom-width: 2px;
}

.font-epi-heading {
    font-family: var(--epi-font-family-heading);
}

.text-epi-primary {
    color: var(--epi-color-primary);
}

.text-epi-secondary {
    color: var(--epi-color-secondary);
}

.text-bg-epi-primary,
.text-bg-epi-primary-75,
.text-bg-epi-primary-50,
.text-bg-epi-secondary,
.text-bg-epi-secondary-75,
.text-bg-epi-secondary-50,
.text-bg-epi-green,
.text-bg-epi-green-75,
.text-bg-epi-green-50,
.text-bg-epi-orange,
.text-bg-epi-orange-75,
.text-bg-epi-orange-50 {
    color: #ffffff;
}

.text-bg-epi-yellow,
.text-bg-epi-yellow-75,
.text-bg-epi-yellow-50 {
    color: var(--epi-color-primary);
}

.text-bg-epi-primary {
    background-color: var(--epi-color-primary);
}

.text-bg-epi-primary-75 {
    background-color: var(--epi-color-primary-75);
}

.text-bg-epi-primary-50 {
    background-color: var(--epi-color-primary-50);
}

.text-bg-epi-secondary {
    background-color: var(--epi-color-secondary);
}

.text-bg-epi-secondary-75 {
    background-color: var(--epi-color-secondary-75);
}

.text-bg-epi-secondary-50 {
    background-color: var(--epi-color-secondary-50);
}

.text-bg-epi-green {
    background-color: var(--epi-color-green);
}

.text-bg-epi-green-75 {
    background-color: var(--epi-color-green-75);
}

.text-bg-epi-green-50 {
    background-color: var(--epi-color-green-50);
}

.text-bg-epi-orange {
    background-color: var(--epi-color-orange);
}

.text-bg-epi-orange-75 {
    background-color: var(--epi-color-orange-75);
}

.text-bg-epi-orange-50 {
    background-color: var(--epi-color-orange-50);
}

.text-bg-epi-yellow {
    background-color: var(--epi-color-yellow);
}

.text-bg-epi-yellow-75 {
    background-color: var(--epi-color-yellow-75);
}

.text-bg-epi-yellow-50 {
    background-color: var(--epi-color-yellow-50);
}
