body {
	display: flex; 
	flex-direction: column; 
	align-items: center;
	font-family: 'Merriweather', 'Georgia', serif;
}

main {
	width: 80ch;
}

header {
	margin-top: 3em;
}

.breakout {
	display: flex;
	justify-content: center;
	margin:1em calc(50% - 50vw);
}

.center {
	display: flex;
	justify-content: center;
}

.posts {
	columns: 3;
}

@media screen and (max-width: 800px) {
  .posts {
    column-count: 1;
  }
  main {
	  width: 100%;
  }
}
@media screen and (min-width: 801px) and (max-width: 1200px) {
  .posts {
    column-count: 2;
  }
}
@media screen and (min-width: 1201px) and (max-width: 1900px) {
  .posts {
    column-count: 3;
  }
}

.post {
	break-inside: avoid;
	padding: 0.4em;
}
.post a {
	border: 1px solid rgb(209 213 219); 
	padding: 0.4em;
	border-radius: 0.25rem; 
	color: black; 
	display: block;
	max-width: 40ch;
	color: black; 
	text-decoration: none;
}
.post img {
	width: 100%;
	border-radius: 0.25rem;
}

.webring {
	display: flex;
	justify-content: space-between;	
}