.nav { grid-area: nav; }

.brown-logo { grid-area: brown-logo;}



 	div.brown-logo {visibility: visible; display: block;}



.spine { 
	grid-area: spine; 
       }

.edge { grid-area: edge;}

.top { grid-area: top;}

.bottom { grid-area: bottom;}

.pictures { grid-area: pictures;}

.head { grid-area: head; 
		background-color:rgba(68,51,34,0.4);
		  max-height: 20em;}

.quotes { grid-area: quotes; 
	font-family: Baskerville;
	color: rgb(255, 255, 255); 
	justify-items: left;
	align-items:start;
	background-color:rgba(68,51,34,0.4);
	font-family: Baskerville; garamond bold; 
	font-size: 125%;
	}



.grid-container {
  display: grid;
  width: 100%;
  grid-template-columns: 100%;
  grid-template-rows: auto auto auto auto;
  grid-template-areas: 
	"nav" 
	"head"
	"pictures" 
	"quotes";
}

	div.bottom {visibility:hidden;}
	div.top {visibility:hidden;}
	div.spine {visibility:hidden;}
	div.edge {visibility:hidden;}



.grid-container2 {
  display: grid;
  width: 100%;
  grid-template-columns: 100%;
  grid-template-rows: auto auto;
  grid-template-areas: 
	"logo"
	"editors";
}

.logo { grid-area: logo;}

.editors { grid-area: editors;
	margin-left:45%;}

.menu {width:100%;
	line-height: 1.5em;
 	position: relative;top: -7px;
	}

.header {font-size: 200%;
	width:100%;
	background-color:transparent;
	padding-left: 0;
	padding-right: 0;
	position:relative;
	width: 100%;
	}

	div.header {visibility: visible; display: block;}

li {
		list-style-type: none;
		font-size: 120%;
		margin: 15px;
		border: 1px solid #443322;
		padding: 20px;
		font-family: 'Caslon224 Bk BT', 'Adobe Caslon Pro', 
			'Garamond', Helvetica !important;