body {
  background-color: lightgrey;
  font-family:  Arial, sans-serif; 
  font-style: normal; 
  font-variant: normal;
  font-weight: normal;
  color: black;
}
h1 {
  font-size: 28px;
  color: white;
  text-align: left;
  text-transform: uppercase;
  font-family:  Segoe UI, Helvetica Neue;
}
h2{
  font-family:  Segoe UI, Helvetica Neue; 
font-size: 18px;
 text-transform: uppercase;
}
h2:first-letter {
    text-transform: uppercase;
}
a, p , li {
  font-size: 12px;
  color: black;

} 

.general_flex
{ /* for lists or images */
 display:flex;
flex-direction: row ;
flex-wrap: wrap ;
padding-left: 0px;
  align-items: stretch; /* Default */
    justify-content: space-between;
    width: 100%;
	}
.general_flex li {
    margin-left: 1em;
}
	
body {
		display : grid;
	}
#top-image 
{
  grid-row-start: 1;
  grid-row-end: 2;
  text-align: center;
  display:flex;
  justify-content:center;
}

#menu {
  grid-row-start: 2;
  grid-row-end: 3;
  text-align: center;
  display:flex;
  justify-content:center;
}
/* clever bastardry around flex box from https://css-tricks.com/snippets/css/a-guide-to-flexbox/ */
@media all and (max-width: 800px) {
  .menu {
    /* When on medium sized screens, we center it by evenly distributing empty space around items */
    justify-content: space-around;
  }
}
@media all and (max-width: 500px) {
  .menu {
    /* On small screens, we are no longer using row direction but column */
    flex-direction: column;
  }
}
#main {
  grid-row-start: 3;
  grid-row-end: 4;
  /* vertical | horizontal */
padding: 1% 15%;

}
#footer {
  grid-row-start: 4;
  grid-row-end: 5;
  font-size: 10px;
  text-align: center;
  display:flex;
  height: 4		0px;
  align-items: center;
  justify-content:center;
  }	


#main a {
	  font-size: 11 px;
  color: black;
  text-align: center;
}
	
#menu ul    {list-style-type: none;}
#menu ul li { float: left ;   }
#menu ul li  a {
  padding-right: 8px;
  padding-left: 8px;
  display: block;
  text-decoration: none;
  text-transform: uppercase;
  font-size: 18px;
  font-style: bold ;
  font-family:  Segoe UI, Helvetica Neue;
}
	
a.instagram { 
 margin-left: 10px;
padding:20px;
padding-left:30px;
background-image: url(insta_bw.png);
background-repeat: no-repeat;
background-position: left;
background-size: 30px 30px;
}