body {
  font-family:Arial,Helvettica,sans-serif;
  background-color:#efeee5;
}

header {
  width:80%;
  background: linear-gradient(#0a0a0a,#229dd6);
  color:white;
  margin-right:auto;
  margin-left:auto;
  padding:10px;
  border-radius:20px 20px 0px 0px;
  overflow:auto;
}

header.purpleheader {
  background: linear-gradient(#0a0a0a,#9900ff);
}

h1 {
  font-size:2em;
  margin:0;
  padding:0;
  padding-top:10px;
}

h2 {
  font-size:1.6em;
}

h3 {
  font-size:1.3em;
}

hgroup {
  width:70%;
  float:left;
}

hgroup h1 {
  padding-top:0;
  line-height:1em;
}

hgroup h2 {
  text-transform:uppercase;
  font-size:1.2em;
  line-height:1em;
}

nav {
  width:30%;
  float:right;
}

nav ul {
  list-style-type:none;
}

nav li {
float:right;
}

ul {
  list-style-type:none;
}

a:link,a:visited {
  text-decoration:none;
}

a:hover,a:active {
  text-decoration:underline;
}

a.head:link,a.head:visited {
  display:block;
  width:80px;
  font-weight:bold;
  color:#0e4158;
  background-color:#b4b4b4;
  text-align:center;
  padding:4px;
  text-decoration:none;
  /*text-transform:uppercase;*/
  border-radius:4px;
}

a.purplehead:link,a.purplehead:visited {
  display:block;
  width:120px;
  font-weight:bold;
  color:#660066;
  background-color:#b4b4b4;
  text-align:center;
  padding:4px;
  text-decoration:none;
  /*text-transform:uppercase;*/
  border-radius:4px;
}

a.head:hover,a.head:active {
  color:#ffffff;
}

a.purplehead:hover,a.purplehead:active {
  color:#ffffff;
}

section {
  width:80%;
  background-color:white;
  margin-right:auto;
  margin-left:auto;
  border-color:#229dd6;
  border-style:solid;
  border-width:5px;
  padding:5px;
}

section.purplesection {
  border-color:#9900ff;
}

p, aside {
  margin:10px;
}

.topmargin {
  margin-top: 25px;
}

.center {
text-align:center;
}

.clear {
clear:both;
}

table {
  border-collapse:collapse;
  margin-top:20px;
  margin-bottom:10px;
}

table, th, td {
  border: 1px solid black;
}

td, th {
  text-align:center;
  padding:3px 15px 3px 15px;
}

img {  
  max-width: 100%;
  height: auto;
  width: auto;
  float:left;
  margin:0px 5px 5px 0px;
  box-shadow:3px 3px 5px 1px #cccccc;
}

footer {
  width:80%;
  background: linear-gradient(#229dd6,#0a0a0a);
  color:white;
  margin-right:auto;
  margin-left:auto;
  height:auto;
  padding:10px;
  border-radius:0px 0px 20px 20px;
  overflow:auto;
}

footer.purplefooter  {
  background: linear-gradient(#9900ff,#0a0a0a);
}