:root {
    --primary-color: #E64E55;
    --secondary-color: #E5924E;
}

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

img {
  display: block;
  max-width: 100%;
  max-height: 90%;
  margin: 1rem auto 5rem auto;
}

h1, h2, h3, h4, h5, h6 {
    color: var(--primary-color);
}

.flash {
    color: #ff0000;
}

.navbar {
    padding-top: 2rem;
    padding-bottom: 1.8rem;
    border-bottom-color: var(--primary-color);
    border-bottom-style: solid;
    border-bottom-width: 0.2rem;
    margin-bottom: 2rem;
}

.navbar > *{
    font-size: 2rem;
}

.nav-link {
    color: var(--secondary-color);
}

.button.button-primary, 
button.button-primary, 
input[type="submit"].button-primary, 
input[type="reset"].button-primary, 
input[type="button"].button-primary {
    background-color: var(--primary-color);
    border-color: var(--primary-color);
}

.button.button-primary:hover, 
button.button-primary:hover,
input[type="submit"].button-primary:hover,
input[type="reset"].button-primary:hover,
input[type="button"].button-primary:hover, 
.button.button-primary:focus,
button.button-primary:focus,
input[type="submit"].button-primary:focus,
input[type="reset"].button-primary:focus,
input[type="button"].button-primary:focus {
    background-color: var(--secondary-color);
    border-color: var(--secondary-color);
}

.file-listing{
    display: grid;
    grid-template-columns: repeat(5, 1fr);
    grid-gap: 3rem 1rem;
}