body {
    font-family: "Monaco", Monospace;
    margin: 0px;
}

.background_container{
    background-size:auto 100%;
    height: 100vh;
}
.menu {
    //width: 100vw;
    // position
    top: 20px;
    width: 100%; /* Full width */
    text-align: center; /* Center the text */
    line-height: 7em; /* Align text vertically */
}

.menu div{
    /*box*/
    height: 7em;
    width: 10em;
    border-style:none;
}

.menu div h4{
    margin: 0; /* Remove the default margin */
    padding: 0; /* Optional: Remove any default padding */
}

button{
    /* center text */
    background-repeat: no-repeat;
    font-family: inherit; /* otherwise it doesn't get the font */
    font-weight: 700; /* it looks different from the rest */
    font-size: 15px;
    border: none;
    cursor: pointer;
    overflow: hidden;
    outline: none;
}

/*  ratio? */
img {
    height: 112px;
    width: 100%; /* i don't know how to make the logo size relative without hardcoding :((( */
}