:root {
    --green-1: #a0e081;
    --green-2: #86d562;
    --green-3: #6cc349;
    --green-4: #52a535;
    --green-5: #3c8527;
    --green-6: #2a641c;
    --grey-1: #ede5e2;
    --grey-2: #d0c5c0;
    --grey-3: #aba09c;
    --grey-4: #6b6562;
    --grey-5: #3d3938;
    --grey-6: #262423;
    --rich-black: #000;
    --off-black: #171615;
    --white: #fff;
    --off-white: #fcf5f1;
    --gradient-green: linear-gradient(180deg,#6cc349,#52a535 50%,#3c8527);
    --gradient-light-grey: linear-gradient(180deg,#fcf5f1,#ede5e2 50%,#d0c5c0);
    --gradient-dark-grey: linear-gradient(180deg,#3d3938,#262423 50%,#171615);

}
body {
    margin: 0px;
    color: white;
    font-family: "Noto Sans";
    background-color: var(--grey-5);
}

/* Navigation Styles */
.nav-bar {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px;
    background-color: var(--grey-6);
}

.nav-bar > .nav-header > h1 {
    font-size: 2rem;
    margin: 0px;
}

.nav-bar > .nav-links {
    display: flex;
    gap: 10px;
    justify-content: center;
}

/* Footer */
.foot {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 30px;
    background-color: var(--grey-6);
}

.foot > .link-wrapper {
    display: flex;
    justify-content: center;
    gap: 10px;
}

/* Inforomation block styles */
.info-block {
    background-color: var(--grey-4);
    padding: 30px;
}

#important {
    border-left: 5px var(--green-1) solid;
}

/* Link Styles */
a {
    color: white;
    text-decoration: none;
    font-size: 1.1em;
}

a:hover{
    color: var(--green-3);
}