/* The style rules that effect the whole website */
body {
    margin: 0px;
    padding: 0px;
    color: #3B3B3B;

    font-size: large;
}
h1 {
    color: #BE321C;
}

button:hover {
    background-color: #d5d5d5;
}
.display_image {
    width: 100%;
    border-radius: 5px;
}

:root,
.wa-light {
    /* Semantic Colors */
    --wa-color-brand-fill-loud: #BE321C;
    --wa-color-brand-border-loud: #BE321C;
    --wa-color-brand-on-quiet: #BE321C;
    --wa-color-neutral-fill-loud: #ffffff;
    --wa-color-neutral-on-loud: #3B3B3B;

    /* Text */
    --wa-color-text-link: #BE321C;
    --wa-font-family-body: roboto;
    --wa-font-weight-bold: 900;
}

/* All the stuff to style navigation topbar */
#nav_bar {
    width: 100vw;
    background-color: white;
    padding: 10px 40px 10px 40px;
    min-height: 7vh;
    box-sizing: border-box;

    top: 0;
    z-index: 10;
    position: fixed;
    display: flex;
    justify-content: space-between;

    box-shadow: 0px 13px 46px 1px #00000065;
}


#nav_bar_links {
    display: flex;
    align-items: center;
        flex-wrap: wrap;
}
#nav_bar_logo {
    height: 5vh;
}
#nav_bar_links p {
    margin: 0 0 0 20px;
}


/* Footer */
#footer {
    margin-top: 25vh;
    padding: 10vh 5vw 10vh 5vw;
    height: 50vh;
    width: 100%;
    background-color: #eaeaea;
}
#footer img {
    height: 5vh;
    filter: grayscale(1);
}