@font-face {
    font-family:Roboto;
    src:url(fonts/Roboto-VariableFont_wdth\,wght.ttf)
}
@font-face {
    font-family:Roboto;
    src:url(fonts/Roboto-Bold.ttf);
    font-weight:bold;
}
body {
    background-image:url(band.jpg);
    background-size:100%;
    background-attachment:fixed;
    font-family:Roboto, Helvetica, sans-serif;
    padding:0;
    margin:0;
    line-height:1.5;
}
h1 {
    color:white;
    letter-spacing:2px;
}
table {
    border-spacing:1px;
    background-color:darksalmon;
    padding:2px;
    width:100%;
}
p {
    margin:10px;
}
th {
    background-color: lightsalmon;
    padding:10px;
}
td {
    background-color: white;
    padding:6px;
}
dl {
    background-color:rgb(255, 225, 211);
    width:55%;
    border-width:3px;
    border-style:dotted;
    border-color:darksalmon;
    padding:8px;
}
dt {
    background-color:lightsalmon;
    padding:8px;
    font-weight:bold;
}
dd {
    padding:10px;
}
figure {
    width:100%;
}
figcaption {
    padding:10px;
    font-style:italic;
    font-size:small;
}
header {
    display:flex;
    background-color:black;
    padding:15px;
    width:100%;
    position:fixed;
    top:0px;
    left:0px;
    height:30px;
    gap:9px;
    margin:0;
}
footer {
    background-color:black;
    display:flex;
    color:gray;
    padding:15px;
    font-size:small;
    flex-wrap:wrap;
}

.navbuttons {
    padding:5px;
    align-content: center;
}
.navbuttons:hover {
    border-color:white;
    border-width:1px;
    border-style:dotted;
}
.highlight {
    background-color:yellow;
}

#mainBody {
    background-color:white;
    padding:50px;
    display:flex;
    flex-wrap:wrap;
}
#title {
    margin-top:18%;
    margin-left:1%;
}
#defList {
    display:flex;
    justify-content: center;
    width:100%;
    align-items: center;
    gap:20px;
}
#splitTable {
    margin-left:auto;
    width:40%;
}