/* top of website */

.container {
    display: grid;
    grid-template-columns: repeat(auto-fit, minmax(200px));
    
}

ul {
    list-style-type: none;
}

.center-block {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 80%;
height:auto;

}



.description {
    width: auto;
    height: 170px;
    line-height: 3em;
    overflow: auto;
    margin: 5;
    padding: 5px;
    border: 2px dashed #000000;
    line-height: 20px;
    font-family: monospace;
    background-color: white;
}

/* main */


.one {
  min-width: 800; 
    
    
}

.scroll-container {
    background color: antiquewhite;
    font-family: monospace;
    line-height: 2em;
    height: 500px;
    overflow: auto;
    white-space: nowrap;
    padding: 5;
    margin: 5;
    border: dashed, black, 2px;
    
        
}

div.scroll-container img {
    max-height: 470px;
    padding-top: 10px;
    
}

/* left side*/

nav {
    text-align: left;
    font-family: monospace;
    line-height: 1.5em;
    min-width: 180;
    max-width: 180;
    margin: 5px;
    padding: 9px;
    background-color: white;
    border: dashed 2px, #000000;
    }

.navbox {
    max-width: 200px;
    padding-right: 10px;
}

.navbox img {
    height: 50px;
    
}





.about {
    text-align: left;
    font-family: monospace;
    line-height: 1.5em;
    min-width: 180;
    max-width: 180;
    margin: 5px;
    padding: 9px;
    background-color: white;
    border: dashed 2px, #000000;
}




.scroll-container2 {
    background color: antiquewhite;
    height: 500px;
    overflow: auto;
    padding: 10;
    margin: 5;
    border: dashed, black, 2px;
    display: flex;
    
        
}


.main1, .main2 {
    font-family: monospace;
    line-height: 1.5em;
    margin: 10px;
    padding: 9px;
    background-color: white;
    border: dashed 2px, #000000;
}

.main1 {
    width: 300px;
    
}

.main1 img {
    max-width: 300;
}

.main2 {
    width: 400px;
    overflow: auto;
    
    
}

.main2 img {
   max-width: 380px;
}





.music, .resources {
     text-align: left;
    font-family: monospace;
    line-height: 1.5em;
    min-width: 180;
    max-width: 180;
    margin: 5px;
    padding: 9px;
    background-color: white;
    border: dashed 2px, #000000;

}





/* grid */

.header {
    grid-row: 1 / 1;
    grid-column: 1 / 5;
}

.navbox {
   grid-column: 1 / 2 ;
    
}

.one {
    grid-column: 2 / 3;
}

.two {
    grid-column: 3 / 4;
}