html {
  font-family: "League Spartan", sans-serif;
}

.home-about { grid-area: about; }
.home-photo { grid-area: photo; }
.home-menu { 
  grid-area: home-menu;
  /*grid-area: links;*/
  display:flex;
  flex: 1 1 0;
  flex-wrap:wrap;
  align-items: stretch;
  justify-content:space-evenly;
  margin:auto;
  max-width:1024px;
  background-color:white;
}
.home-links { 
  grid-area: links;
  display:flex;
  flex: 1 1 0;
  flex-wrap:wrap;
  align-items: stretch;
  justify-content:space-evenly;
  margin:auto;
  max-width:1024px;
  background-color:white;
}


.home-grid-container{
  display: grid;
  grid-template-areas:
    'photo photo'
    'home-menu home-menu'
    'about about'
    'links links';
  gap: 20px;
  background-color: white;
  margin: auto;
  max-width: 300px;
  justify-content:center;
}

@media (min-width:600px){
  .home-grid-container {
    display: grid;
    grid-template-areas:
      'about about photo photo photo'
      'about about home-menu home-menu home-menu'
      'about about links links links';
    gap: 5%;
    background-color: white;
    margin: auto;
    max-width:1024px;
    
  }
  
  .grid-container > div {
    padding: 20px 0;
  }
}

.header{
  display:flex;
  margin:auto;
  font-size:100%;
  border-radius:8px;
  max-width:1024px;
  justify-content:center;
  background-color:teal;
}

.button {
  background-color: teal;
  border: none;
  border-radius:8px;
  color: white;
  padding: 3% 3%;
  text-align: center;
  text-decoration: none;
  display: inline-block;
  font-size: 24px;
  margin: 4px 2px;
  cursor: pointer;
}

body{
  font-size:100%;
}

h1{
  color:white;
  font-family: Georgia;
  font-size:4vw;
  text-align:center;
  letter-spacing:.025em;
  word-wrap:normal;
}

h3 {
  font-family: Helvetica;
  font-size:1.6rem;
  letter-spacing:.05rem;
  margin:2rem 0;
}

p {
  /*font-family: Helvetica;*/
  font-size:1.3rem;
  letter-spacing:.04rem;
  line-height:1.25;
  margin:2rem 0;
}

img{
  width:100%;
  height:auto;
  min-width:50%;
}