style.css

@import url('https://fonts.googleapis.com/css2?family=Dancing+Script&display=swap');

#main-container, #nav {
    font-family: Courier, monospace;
    font-size: 1.2em;
    text-align: center;
}
#main-container {
    margin: 20px auto 0 auto;
    width: calc(100% - 100px);
    transition: margin-top 0.5s ease;
}
#nav {
    position: sticky;
    top: 0;
    left: 0;
    right: 0;
    z-index:1;

    min-height:75px; /* logo height + padding */
    padding: 10px 5px 0 65px;

    background-color:#bdd09f;
    border-bottom: #000000 3px solid;
}
#nav > a {
    text-decoration: none;
    color: #000000;

    display:inline-block;
    padding:3px 12px 3px 12px;
}
#nav > a > span {
    transition: transform 0.1s linear;
    display:inline-block;
}
#nav > a:hover > span {
    transform:translate(0, -5px);
}
#nav > img {
    position:absolute;
    top:15px;
    left:15px;
    bottom:15px;
    object-fit:contain;
    height: 45px;
}
h1 {
    font-size:2em;
}
.menu {
    border-radius:5px;
    background-color:#bdd09f;
    padding:10px;
}
.menu .row > div, .menu.row > div {
    padding:10px;
}
.menu img {
    height:auto;
    max-height:200px;
    max-width:calc(100% - 5px);
}
#logo {
    display: block;
    width: 200px;
    margin: 0 auto 0 auto;
}

/* Generic */
img {
    border-radius:5px;
    border:2px solid #000000;
}
.center {
    text-align: center;
}
.cursive {
    font-family:"Dancing Script", cursive;
}
h1,h2,h3,h4,h5,h6 {
    font-weight:normal;
    margin:5px;
}