@font-face {
	font-family: "Hartsfolk";
	src: 
	     url("/fonts/Hartsfolk.otf") format("otf"),
	     url("/fonts/Hartsfolk.woff") format("woff"),
	     url("/fonts/Hartsfolk.woff2") format("woff2");
	font-weight: normal;
	font-style: normal;
	font-display: fallback; 
}

@font-face {
	font-family: "Bardolatry";
	src: 
	     url("/fonts/Bardolatry.otf") format("otf"),
	     url("/fonts/Bardolatry.woff") format("woff"),
	     url("/fonts/Bardolatry.woff2") format("woff2");
	font-weight: normal;
	font-style: normal;
	font-display: fallback; 
}

@font-face {
	font-family: "Murphy's Folly";
	src: 
	     url("/fonts/Murphy's Folly.otf") format("otf"),
	     url("/fonts/Murphy's Folly.woff") format("woff"),
	     url("/fonts/Murphy's Folly.woff2") format("woff2");
	font-weight: normal;
	font-style: normal;
	font-display: fallback; 
}

header, h1, h2, h3, h4, h5 {
  font-family: 'Hartsfolk', cursive;
}

header img {
  width: 750px;
  height: auto;
  }	

header {
grid-area: hdr;

}

footer {
  grid-area: ftr;
  }

ul {
  list-style: none;
  align-items: center;
  display: flex;
  justify-content: space-evenly;
  }
	

body {
	 font-family: "Murphy's Folly", serif;
	 font-size: 1.2rem;
	 box-sizing: border-box;
   display: grid;
   flex-direction: column;
    grid-template-columns: repeat(12, 1fr);
	  grid-template-areas: 
	  "hdr hdr hdr hdr hdr hdr hdr hdr hdr hdr hdr hdr"
  	"mne mne mne mne mne mne mne mne mne mne mne mne"
	  "ftr ftr ftr ftr ftr ftr ftr ftr ftr ftr ftr ftr"
	;
	  gap: 4px;
	  }
	  
#content {
  grid-area: mne;
  }