body {
    background-color: #a7dc6e;
    background-image: url(../img/melon/melon-leaf.png), url(../img/melon/melon-leaf.png);
    background-clip: border-box;
    background-position: left top, left 12.5vw top 12.5vw;
    background-size: 25vw;
    background-attachment: fixed;
}
#hex-a {
    background-color: #484539;
}

#hex-b {
    background-color: #C8BD8F;
    color: black;
}

#hex-c {
    background-color: #2C2B27;
}

#hex-d {
    background-color: #E8E0C7;
    color: black;
}

#hex-e {
    background-color: #A7DC6E;
    color: black;
}

#hex-f {
    background-color: #447537;
}

#hex-g {
    background-color: #D49A83;
    color: black;
}

#hex-h {
    background-color: #E1AC4D;
}

#title-background {
    background-color: #447537;
    border-bottom: 16px solid #C8BD8F;
}
#links a {
    background-color: #A7DC6E;
}
#links a:hover {
    background-color: #C8BD8F;
}
#title-seperator {
    background: linear-gradient(-2deg, #C8BD8F 40%, transparent 41%);
    height: 10vw;
    width: 100%;
    margin-top: -5vw;
}
#title-seperator div {
    background: linear-gradient(2deg, #242124 30%, transparent 31%);
    height: 100%;
    width: 100%;
    display: flex;
    align-items: flex-end;
    justify-content: flex-end;
}

#title-img-holder {
    background-color: transparent;
}

#title-img-credit {
    font-size: 2.5vw;
    margin: 1.75vw 1vw;
    z-index: 1;
    color: black;
}