#photo {
	align-items: center;
}

#contact {
  display: flex;
  flex-direction: row;
  align-items: center;
  justify-content: space-evenly;
  padding: 10px;
}

#left-grid {
	grid-area: intro;
	text-align: center;
}

#about-me {
	grid-area: about;
}

#education {
	grid-area: education;
}

#navbar {
	grid-area: nav;
}

#left-grid-holder {
	width: 320px;
	margin: 0 auto;
}

#content {
	display: grid;
	gap: 20px;
  grid-template-areas:
    "nav"
    "intro"
    "about"
    "education"
    "work"
    "publications"
    "projects";
}

body {
  margin: 0;
}

@media (min-width: 800px) {
  #content {
    grid-template-columns: repeat(2, 1fr);
    grid-template-rows: repeat(4, auto);
    grid-template-areas:
      "nav nav" 
      "intro about"
      "education work"
      "publications projects"
   }
}

@media (min-width: 1200px) {
  #content {
    width: 75%;
    margin: 0 auto;
    grid-template-columns: auto 1fr 1fr;
    grid-template-rows: repeat(4, auto);
    grid-template-areas:
      "nav nav nav"
      "intro  about about"
      "intro  education work"
      "intro publications projects"
   }

   #left-grid {
      margin-right: 2em;
   }

   #navbar {
	   justify-content: flex-end;
	}
}

#work {
	grid-area: work;
}

#publications {
  grid-area: publications;
}

#projects {
  grid-area: projects;
}