@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,400;1,700&display=swap');
:root
{
    --primary-color:#78716c;
    --secondary-color:#d6d3d1;
}
*
{
    font-family: 'Montserrat', sans-serif;
}
#content
{
    display: flex;
    flex-direction: column;
}
#main_header
{
    text-align: center;
    background-color: var(--primary-color);
    color: white;
    padding: 1rem;
    margin:-2rem -1rem 1rem -1rem;
    border-bottom-left-radius: 2rem;
}

#content
{
    width: 50vh;
    margin: auto;
    background-color: var(--secondary-color);
    padding: 1rem;
    border-radius: 1rem;
}
input
{
    margin-bottom: 1rem;
    padding: 1rem;
}
#btn-submit
{
    width: 40%;
    margin: auto;
    padding: 1rem;
    color: white;
    background-color: var(--primary-color);
    border-radius: 1rem;
    border: transparent;
}
#output
{
    text-align: center;
    margin-top: 1rem;
}
/* footer */
.footer
{
    background-color: var(--primary-color);
    padding: 2rem 0rem;
    text-align: center;
    color: white;
    border-top-right-radius: 1rem;
    width: 100%;
    position: fixed;
    left: 0;
    bottom: 0;
}
.footer .link{
color: white;
}
.footer ul{
    padding-inline-start: 0px;
}
.hr-links
{
    margin-top: 1rem;
}
.footer .footer-heading
{
    font-weight: bold;
    font-size: large;
}
.list-non-bullet
{
    list-style: none;
}
.list-inline, .list-item-inline
{
    display: inline;
    padding: 0;
}