@font-face {
      font-family: 'CustomFont';
      src: url('fonts/pixel.ttf') format('opentype');
      font-weight: normal;
      font-style: normal;
    }
body {
    margin: 0;
    background-color: #9fb98b;
    color: #1f2b1f;
    font-family: 'pixelfj8pt1normal', Arial, sans-serif;   

}


/* MENU BAR */
.top-menu {
    display: flex;
    justify-content: center;
    align-items: center;
    gap: 24px;

    background-color: #9fb98b;
    padding: 8px 0;

    border-bottom: 3px solid #4a5f4a;
}

/* MENU ITEMS */
.top-menu a {
    display: flex;
    align-items: center;
    gap: 6px;

    padding: 4px 8px;

    color: #1f2b1f;
    text-decoration: none;
    font-size: 14px;
    font-weight: bold;

   border: 2px solid #4a5f4a;
    background-color: #9fb98b; 
}

/* ICONS */
.top-menu img {
    width: 40px;
    height: 40px;
    image-rendering: pixelated;
    /*filter: grayscale(100%) contrast(140%);*/
}

/* HOVER / SELECT */
.top-menu a:hover {
    background-color: #2f3f2f;
    color: #9fb98b;
}
.page-content,
.top-menu {
    text-shadow: 0 1px 0 #c6d6b8;
}