body {
    font-family: 'EB Garamond', serif;
  }

h1 {
  font-family: 'Basteleur';
  font-size: 45px;
  font-weight:normal;
  margin: 0 0 3px;
}

h2 {
  font-size: 40px;
  font-weight:normal;
  margin: 0 0 3px;
}

h3 {
  font-size: 22px;
  font-weight:400;
  margin-top:-5px;
}

p {
  font-size: 20px;
  line-height: 1.4;
  font-family:'EB Garamond', serif;
}

main {
  grid-area: content;
  padding: 20px;
}

nav {
  grid-area: sidebar;
  border-style: double;
}

.corps {
  display: grid;
  grid-gap: 20px;
  grid-template-columns: 1fr 3fr;
  grid-template-areas: 
    "sidebar content";
}
@media (max-width: 750px) {
  .corps {
    grid-template-columns: 4fr;
    grid-template-areas:
      "content"
      "sidebar";
  }
}

@media (prefers-color-scheme: light) {
    nav {
      color: #000000;
      background-color: #faf4eb;
      border-color: #7a0612;
    }

	body {
     background: url(/assets/bg_light.png) repeat top;
     background-size: 400px;
     color: #000000;
	 background-color: #faf4eb;
    }
    
    a {
	  color: #000000;
      text-decoration: none;
	}
    
  }
  
@media (prefers-color-scheme: dark) {
    nav {
      color: #faf4eb;
      background-color: #1c1817;
      border-color: #9de4b0;
    }

	body {
     background: url(/assets/bg_dark.png) repeat top;
     background-size: 300px;
     color: #faf4eb;
	 background-color: #1c1817;
    }
    
    a {
	  color: #faf4eb;
      text-decoration: none;
	}

  }

li {
  display: list-item;
  list-style-type: "☞";
  padding-inline-start: 1ch;
  font-size: 20px;
}

.gallery {
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
	align-items: flex-end;
}

.gallery .art {
	display: block;
	float: left;
	padding: 5px 5px 5px 5px;
	margin:1%;
}

.work {
	object-fit: cover;
	height: 175px;
	width: 175px;
}

.work:hover {
	transform: scale(.975);
}


@media only screen and (max-width: 750px) {
   .work {
  height: 350px;
  width: 350px;
 }
}