body {
	Margin: 0;
	Padding: 0;
	Font-size: 15pt;
	Font-family: sans-serif;
}

Header, nav {
	Border-width: 0.3em;
	Border-bottom-style: ridge;
	Padding: 0.5em 0;
}

header {
	Text-align: center;
}

nav {
  Display: flex;
  flex-wrap: wrap;
  Margin: 0;
  justify-content: center;
}

nav a { Padding: 0.5em 0.8em; }


div.body-text { 
  Display: flex;
  Width: 100%;
  Border-spacing: 2em;
  max-height: 540px;
  Justify-content: space-around;
}

main, aside {
	Border-width: 0.3em;
	Border-style: outset;
	Margin: 1.5em 0;
	Padding: 1em 2.5%;
	Line-height: 1.5em;
	Text-align: justify;
	Overflow-y: scroll;
}

main { Width: 60%; }
aside { Width: 20%; }

@media (max-width: 720px) {
	div.body-text {
	  Display: flex;
	  flex-direction: column;
	  max-height: none;
	  justify-content: center;
	  align-items: center;
	  width: 100%;
  }
	main, aside {width: 85%; margin: 0.5em 0;}
}

img {
 max-width: 100%;
 height: auto;
}

footer {
	Text-align: center;
	Border-width: 0.3em;
	Border-top-style: ridge;
	Padding: 0.5em;
}

footer p {margin: 0.3em 0;}



h1 { Font-size: 2em;}
h2 { Font-size: 1.5em; }
h3 { Font-size: 1.3em; }

h1, h2, h3 { Font-weight: bold; Letter-spacing: 0.1em; }

body {
  Background-color: olive;
  Color: palegoldenrod;
}

header, nav, main, aside, footer { Border-color: goldenrod; }

main, aside {
  Background-color: linen;
  Color: darkolivegreen;
}

h2, h3 {
  Color: olive;
  Text-shadow: 0.05em 0.05em 0 gold; 
}

nav a, header a, footer a, h1 {
  Color: lightyellow;
  Text-decoration: none;
  Text-shadow: 0.05em 0.05em 0 darkolivegreen;
}

nav a:hover, header a:hover, footer a:hover { Color: gold; }
main a, aside a { Color: #8f54db; } /* v pretty purple */
main a:visited, aside a:visited { Color: goldenrod; }
main a:hover, aside a:hover { Color: gold; }