body
{
background-color:#fcf7da;
}

#wrapper{
  font-family:"Calibri", sans-serif;
  font-size:18px;
  text-align:left;
  margin-left:auto;
  margin-right:auto;
  max-width:1050px;
  width:100%;
}

#toptext{
 width:100%;
 text-align:left;
 
}


#about {
	float:right;
	padding-top:50px;
	width:450px;
}


#svgdiv {
  margin-top:-10px;
  float:left;
  width: 600px;
  max-width:100%;
  overflow-x:auto;

}

#logo{
  float:right;
}

#endmatter{
	width:100%;
	clear:both;
}

.bookimg{
  max-width:400px;
  max-height:400px;
}

.selected {
   font-weight:bold;
}
a{
 text-decoration:underline;
}

/* Ensure links and buttons are clearly visible and not distinguished by color alone */
a:hover,
a:focus {
 text-decoration:underline;
}

button {
  font-family:"Calibri", sans-serif;
  font-size:16px;
}

button:focus,
a:focus {
  outline:3px solid #000000;
  outline-offset:2px;
}

/* Visually hide the HTML timeline nav until keyboard focus enters it */
.visually-hidden-nav {
  position:absolute;
  left:-9999px;
  width:1px;
  height:1px;
  overflow:hidden;
}

.visually-hidden-nav:focus-within {
  position:static;
  left:auto;
  width:auto;
  height:auto;
  overflow:visible;
}

/* Layout adjustments for small viewports */
@media (max-width: 800px) {
  #svgdiv,
  #about {
    float:none;
    width:100%;
  }

  #toptext,
  #endmatter {
    width:100%;
  }
}