body {
color: black;
background: white;
font-family: Verdana, Helvetica, Arial, sans-serif;
font-size: 62.5%;
margin: 0;
}
h1 {
font-size: 150%;
margin: 0;
padding: 0.4em 0.8em 0.4em 0.8em;
}
h2 {
font-size: 120%;
margin: 0;
padding: 0.5em 0.9em 0em 0.9em;
}
h3 {
font-size: 110%;
}
h4 {
font-size: 100%;
}

#container {
color: black;
width: 78em; /* Equivalent of 780px when on medium (16px) text. */
margin: 1em auto;
}

/*********
* Header *
*********/

#header {
font-size: 140%;
border-top: 1px dashed #CCC;
border-left: 1px dashed #CCC;
padding: 0;
margin: 0;
position: relative; /* Required so we can absolutely position menu at right of header */
}
#header h1 {
display:inline-block;
padding: 0.4em 0.8em 0.4em 0.7em;
}
#menu {
display:inline-block;
position: absolute;
top: 0;
right: 0;
margin: 0;
padding: 1em 0.7em 0.8em 0.8em;
}
#menu h2 {
display: none;
}
#menu ul {
display:inline-block;
margin: 0;
padding: 0;
list-style: none;
}
#menu li {
display: inline-block;
}
#menu li a {
float: left; /* Necessary to prevent gaps in between the items. */
margin: 0;
padding: 0em 0.4em 0em 0.4em;
text-decoration: none;
white-space: nowrap;
color: #333333;
}
#menu li.active a {
background: white;
color: black;
text-decoration: underline;
}
#menu li a:hover {
text-decoration: underline;
}

/**********
* Content *
**********/

#page {
clear: both;
font-size: 150%;
margin: 0;
padding: 0;
background: white;
}
#content {
margin: 0;
padding: 0em 1em 0em 1em;
text-align: justify;
border: 1px solid white; /* White border necessary to prevent h2 disappearing in IE. */
}
#content p {
clear: both; /* Required for galleries */
margin-top: 1em; /* IE and Firefox etc set different defautl p margin. */
}
#content a {
color: black;
}

/************
* Home page *
************/


body#page-2 div#content { /* #page-2 is home page */
position: relative;
}
body#page-2 div#content p {
margin-right: 60%;
}
body#page-2 div#content p img {
position: absolute;
top: 1.3em;
left: 43.5%;
}

/**************
* Maxigallery *
**************/

#content div.thumbscontainer,
#content div.childscontainer {
margin-top: 1em;
margin-bottom: 0.8em;
}
#content div.childscontainer li a {
  display: inline-block;
  height: 8em;
}
#content div.childscontainer li p {
margin: 0;
padding-left: 0.4em; /* Line up text with images */
}
ul.thumbs li { /* Override maxigallery default styling so can get 6 images in a row */
margin:	0.25em !important; /* Note: Have to comment out line in assets/snippets/maxigallery/css/default.css */
}
#content p.gallery_description {
  padding: 0;
  margin: 0;
}

/*********
* Footer *
*********/

#footer {
font-size: 0.9em;
color: #999999;
border-right: 1px dashed #CCC;
border-bottom: 1px dashed #CCC;
padding: 1.4em;
text-align: right;
}
#footer p {
margin: 0;
padding: 0;
}
#footer a {
color: #999999;
text-decoration: none;
}
#footer a:hover {
text-decoration: underline;
}

.skip {
display: none;
}
.seperator {
height: 0px;
clear: both;
margin: 0;
padding: 0;
}