body {
    background-image:url(images/textures/DIAMOND1.JPG);
    color:white;
    display:grid;
    justify-content:center;
}

.body-container {
    display:grid;
    grid-template-rows: 100px 500px 100px;
    grid-template-columns: 150px minmax(200px, 600px); 
    gap:2px;
}   

/* see body-container > div > *
.tileborder {
    border: 6px solid transparent; 
    border-image-source: url('images/textures/TILES01.png');
    border-image-slice: 55; 
    border-image-repeat: round; 
}*/



.body-container > div > * {
    background-color:rgba(115, 115, 131, 0.911); /**/
    border-style:solid;
    border-color:black;

    border: 6px solid transparent; 
    border-image-source: url('images/textures/TILES01.png');
    border-image-slice: 55; 
    border-image-repeat: round; 
}

#header, #footer{
    grid-column: 1 / span 2;
    display:flex;
}
#header {
    margin:0;
    align-items:stretch;
}

#main-header {
    padding:8px;
    margin:0 2px 0 0;
    align-content: space-between;
    flex:1;
    
}

#stuff {
    height:100%;
    overflow-y:scroll;
    padding-left:0 0 15px 0px;

}

#navbox {
    background-color: rgba(255, 255, 255, 0);
    justify-items: start;
    height:100%;
    
}
#navbox ul {
    display:flex;
    margin:0;
    padding:0;
    flex-direction:column;
    list-style-type:none;
    gap:5px;
    width:100%;

}

#navbox a {
    color:aliceblue;
    display:block;
    background-color:rgb(42, 50, 123);
    padding:15px;
    text-align:center;
}

#navbox a:hover {
    background-color:azure;
    color:black;
}

#sitenav {
    flex:1;
    margin: 0px;
}

#sitenav ul {
    margin:0px;
}

span {
    display:none;
    margin:5px 5px ;
}

#home {
    display:block;
}

.vert {
    display:flex; 
    flex-direction:column;
}