/* index.css - style for index.html */

h1
{
  color: hsl( 200, 100%, 50% );
  font-weight: bold;
  font-size: 2.6em;
  text-align: center;
  text-shadow: -2px -2px white, 2px 2px rgb(87, 87, 16);
}   

.cls_header
{
  text-align:     center; 
  font-weight:    bold;
}

main 
{ 
  font-size: 1em; color: beige;
  color: rgb(58, 32, 32);
  padding: 12vh 2em  10em 2em; */
}

#container 
{
  min-height: 100vh;
  background-color: antiquewhite;
  font-family: Verdana, Geneva, Tahoma, sans-serif;
  padding-bottom: 680px;  
}   

header
{
  height: 10vh;
  background-color: rgba( 248, 213, 213, 0.4 );   
  position: fixed;
  top: 0px; left : 0px;
  width: 100%; 
  backdrop-filter: blur( 4px );
  border-bottom: 1px solid rgb(194, 182, 182); 

  z-index: 1;
  text-align: center;
}

.cls_web_gl_thumbs
{
  text-align:     center; 
}


/* hover over images to change from nearly b+w to color */

main .bw
{
  filter: grayscale( 90% );
  transition: filter 200ms ease-in-out;   /* slowly add/remove color */
}       

main .bw:hover
{
  filter: grayscale( 0% );
}