html {
    background-image:url(pics/backgrounds/wallpaper1.jpg)
}

/* index page */

.container {
    background-color: white;
    background-image: url(pics/backgrounds/tinybunnybg.gif);
}

div.scroll-header2, blinkies {
  overflow: auto;
  white-space: nowrap;
  padding: 10px;   
}

div.scroll-container img {
  padding: 10px;
}


 main, footer {
    border: grey, 2px, dotted;
    background-color: white;
    }


header {
    font-family: monospace;
    font-size: 20px;
    text-align: center;
    }

nav, .userboxes {
    max-width: 188px;
    margin: 5px;
    padding: 5px;
}

.navbox, .funlinks {
    text-align: center;
    font-family: monospace;
    background-color: white;
    border: grey, 2px, dotted;
    margin-top: 7px;
    margin-bottom: 7px;
    }

.navtxt {
    list-style-type: none;
}


.one, .two, .three, .four {
    border: grey, 2px, dotted;
    margin: 10px;
    padding: 4px;
    background-color: white; 
    overflow: auto;
}


.container {
    max-width: 1200px;
    border: white, 5px, groove;
    margin: auto;
    padding: 10px;
    display: grid;
    grid-gap: 18px;
    grid-template-columns: 200px minmax(0, 1fr);
}


sidebar, .three, .four {
    max-width: 200px;   
}


sidebar {
    text-align: center
}

.dividerone, .center {
  display: block;
  margin-left: auto;
  margin-right: auto;
  width: 50%;
}


/* grid */

header {
    grid-row: 1 / 2;
    grid-column: 1 / 4;
}
header2 {
    grid-row: 2 / 3;
    grid-column: 1 / 4;
}

nav {
    grid-row: 3 / 4;
    grid-column: 1 / 2;
    height: max-content;
}

main{
    grid-row: 3 / 4;
    grid-column: 2 / 3;
    height: max-content;
}

sidebar {
    grid-row: 3 / 4;
    grid-column: 3 / 4;
}

blinkies {
     grid-row: 4 / 5;
     grid-column: 1 / 4;
}

footer {
    grid-row: 5 / 6;
    grid-column: 1 / 4;
}


/* art pages */

.buttons {
    text-align: center;
    
}


.sketchbutton, .digitalbutton, .craftsbutton {
  background-color: darkseagreen;
  border: none;
  color: black;
  padding: 5px 5px;
  text-align: center;
  font-family: monospace;
  text-decoration: none;
  display: inline-block;
  margin: 4px 2px;
  cursor: pointer;
  border-radius: 10px;
  align-content: center
}