body {
  display: flex;
  -webkit-box-orient: vertical;
  flex-direction: column;
  min-width 1024px;
  background-color: blue;
  color: white;
  margin: 0 auto;
  padding: 10px 20px 20px 20px;
  border: 3px solid black;
  height: auto;
  overflow: auto;
}

/* Style the header */
header {
  background-color: #666;
  padding: 5px 5px 5px 5px;
  text-align: center;
  font-size: 35px;
  color: white;
}

/* Container for flexboxes */
section {
  display: -webkit-flex;
  display: flex;
}

/* Style the navigation menu */
nav {
  -webkit-flex: 1;
  -ms-flex: 1;
  flex: 1;
  background: tan;
  padding: 20px;
}

/* Style the list inside the menu */
nav ul {
  list-style-type: none;
  padding: 10;
}

/* Style the content */
article {
  -webkit-flex: 3;
  -ms-flex: 3;
  flex: 3;
  background-color: blue;
  padding: 10px;
}

/* Style the footer */
.footer {
  font-family: "Times New Roman", Times, serif;
  background-color: #777;
  padding: 5px 5px 5px 5px;
  text-align: center;
  color: white;
  width: 100%;
}

/* Responsive layout - makes the menu and the content (inside the section) sit on top of each other instead of next to each other */
@media (max-width: 600px) {
  section {
    -webkit-flex-direction: column;
    flex-direction: column;
  }
}


h1 {
  color: white;
  margin-left: 10px;
  text-align:center;
}

h2 {
  color: Yellow;
  margin-left: 10px;
  text-align:center;
}

h3 {
  color: white;
  margin-left: 10px;
  text-align:center;
}

h4 {
  color: white;
  Margin-left: 10px;
  text-align:center;
}

h5 {
  color: white;
  margin-left: 10px;
  text-align:center;
}

h4.small {
  line-height: 0.5;
}

P {
  color: white;
  margin-left: 10px;
  font-family: "Times New Roman", Times, serif;
  font-size: 20px;
}

p.small {
  line-height: 0.7;
}

u { 
  text-decoration: underline;
}


div > p.small {
  font-family: "Times New Roman", Times, serif;
  line-height: 0.7;
}



div > h4.small {
  font-family: "Times New Roman", Times, serif;
  line-height: 0.7;
  font-size: 15px;
}

div.newsletter {
  width:300px;
  margin: auto;
}

div.leadership {
  width:400px;
  margin: auto;
}

img {
  max-width: 100%;
  height: auto;
}

figcaption {
  Color: white;
  font-size: 18px;
}

ul {
  color: white;
  font-family: "Times New Roman", Times, serif;
  font-size: 20px;
  list-style-image: url('/images/bullet-blue.gif');
}

div.center {
  display: -webkit-flex; /* Safari */
  -webkit-align-items: center; /* Safari 7.0+ */
  display: flex;
  align-items: center;
}

div.ul {
  list-style-image: none;
  text-align: center;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

ul.n {
  list-style-image: none;
  list-style-type: none;
  font-size: 1em;
}

li.small {
  font-size: small;
}

li.large {
  font-size: x-large;
}

<!-- iframe sizing -->

 html, body, iframe { height: 100%; }
 html { overflow: auto; }

iframe:focus {
  outline: none;
}

iframe[seamless] {
  display: block;
}


pre {
  color: white;
  font-family: "Times New Roman", Times, serif;
  font-size: 20px;
}


/*
/* Ensure proper sizing */
* {
  box-sizing: border-box;
}
*/

/* Create 3 equal columns that sit next to each other */
.columnthree {
  flex: 30%;
  padding: 5px;
}

.column {
  float: left;
  padding: 10px;
}  


.clearfix::after {
  content: "";
  clear: both;
  display: table;
}

/* Column container */
.row {  
  display: -ms-flexbox; /* IE10 */
  display: flex;
  -ms-flex-wrap: wrap; /* IE10 */
  flex-wrap: wrap;
  padding: 10px;
}

/* Create two unequal columns that sit next to each other */
/* Menubar/left column */
menu {
  -ms-flex: 21%; /* IE10 */
  flex: 21%;
  padding: 20px;
  background-color: blue;
  
}

/* Main column */
main {   
  -ms-flex: 70%; /* IE10 */
  flex:70%;
  padding: 20px;
  margin-left: 10px; /* Same width as the sidebar + left position in px */
}

.iframe_column {
  width: 75%
}


/* Create two equal columns that float next to each other */
.columns-two {
  float: left;
  -ms-flex: 50%; /* IE10 */
  flex: 50%;
  padding: 10px;
  height: auto; 
}

/* Create two event columns of different size that float next to each other */
.events-column-1 {
  float: left;
  -ms-flex: 75%; /* IE10 */
  flex: 75%;
  padding: 10px;
  height: auto; 
}

/* Create two event columns of different size that float next to each other */
.events-column-2 {
  float: left;
  -ms-flex: 25%; /* IE10 */
  flex: 25%;
  padding: 10px;
  height: auto; 
  background-color: black;
  border-color: white;
  border-style: solid;
  border-width: 2px;
}

/* Create two Classified Ads columns of different size that float next to each other */
.classified-ads-column-one {
  float: left;
  -ms-flex: 70%; /* IE10 */
  flex: 70%;
  padding: 10px;
  height: auto; 
}

/* Create two Classified Ads columns of different size that float next to each other */
.classified-ads-column-two {
  float: left;
  -ms-flex: 25%; /* IE10 */
  flex: 25%;
  padding: 10px;
  height: auto; 
  background-color: black;
  border-color: white;
  border-style: solid;
  border-width: 2px;
}

/* Clear floats after the columns */
.row:after {
  content: "";
  display: table;
  clear: both;
}


.menu ul {
  list-style-type: none;
  margin: 5;
  padding: 0;
  height: 100%;
  overflow: auto;
}

.menu li {
  margin-bottom: 5px;
  background-color: grey;
  color: blue;
}

.menu li:hover {
  background-color: blue;
  font-size:100%;
}

.header {
  padding: 15px;
}

/* unvisited link */
a:link {
  color: White;
}

/* visited link */
a:visited {
  color: lightblue;
}


/* mouse over link */

a:hover {
  color: white;
}


/* selected link */
a:active {
  color: black;
}

aside {
    width: 40%;
    padding-left: .5rem;
    margin-left: .5rem;
    float: right;
    box-shadow: inset 5px 0 5px -5px #29627e;
    font-style: italic;
    color: #29627e;
}

aside > p {
    margin: .5rem;
}

#event-table {
  font-family: "Trebuchet MS", Arial, Helvetica, sans-serif;
  border-collapse: collapse;
  width: 100%;
}

#event-table td, #event-table th {
  border: 1px solid #ddd;
  padding: 8px;
}

#event-table td {
  font-size:12px;
}

/*
#event-table tr:nth-child(even){background-color: #f2f2f2;}
*/

#event-table tr:hover {background-color: red;}

#event-table th {
  padding-top: 10px;
  padding-bottom: 10px;
  text-align: center;
  background-color: darkblue;
  color: white;
  border: 1px solid black;
}
