html
{
	background-color: white;
	color: black;
	font-family: Arial, Helvetica, sans-serif;
	/* Forces the browser to allow space for the scrollbar so the content doesn't jump about. */
	overflow: scroll; 
}

#page
{
    position: relative;
	margin: 10px auto;
	padding: 1em;
	max-width: 43.75em;
}

#headerRow
{
	position: relative;
	width: 100%;
	height: 2em;
	line-height: 2em;
}

#signatureColumn
{
	position: absolute;
	width: 17.5em;
	font-family: Helvetica;
	font-size: 2.1em;
	font-weight: normal;
	color: #06066a;
}

#signatureColumn a
{
	font-weight: normal;
	color: #06066a;
	border: none;
}

#menuColumn
{
	position: absolute;
	right: 0;
	top: 0.6em;
	font-size: 0.8em;
}

#bodyRow
{
	position: relative;
	width: 100%;
	height: 100%;
	border-top: 1px solid #006;
	padding-top: 0.8em;
	margin-top: 0.3em;
}

#journeyBodyRow
{
	position: relative;
	width: 100%;
	height: 100%;
	padding-top: 0.8em;
	margin-top: 0.3em;
}

#imageColumn
{
	position: absolute;
	width: 17.5em;
}

#imageColumn img
{
    border: none;
}

#textColumn
{
	position: absolute;
	left: 17.5em;
}

.smallTitle
{
	font-size: 0.7em;
	display: block;
}

.smallTitleInline
{
	font-size: 0.8em;
	padding-left: 1em;
}

.smallTitleCentered
{
	font-size: 0.7em;
	display: block;
	text-align: center;
	margin-top: 0.5em;
}

.smallTitleCentredInline
{
	font-size: 0.9em;
	font-weight: bold;
	/*display: block;*/
	text-align: center;
	margin-top: 0.2em;
	width: 120px;

}

.inlineImage
{
    display: inline;
    border: none;
}

.italicisedText
{
    font-style: italic;
}

/*
**  The "dropImage" classes are used in "journey.php" to achieve
**  the required irregular image spacing.
*/
.dropImage1
{
    margin-right: 1.5em;
    padding-top: 40em;
    float: right;
    text-align: right;
    border: none;
}

.dropImage2
{
    margin-right: 1.5em;
    padding-top: 25em;
    float: right;
    text-align: right;
    border: none;
}

.dropImage3
{
    margin-right: 1.5em;
    padding-top: 38em;
    float: right;
    text-align: right;
    border: none;
}

.dropImage4
{
    margin-right: 1.5em;
    padding-top: 73em;
    float: right;
    text-align: right;
    border: none;
}

.dropImage5
{
    margin-right: 1.5em;
    padding-top: 26em;
    float: right;
    text-align: right;
    border: none;
}

#listAll
{
    font-size: 0.8em;
	display: block;
	text-align: center;
	margin-top: 0.8em;
	margin-bottom: 3em;
}

#listAll a
{
    color: #fff;
    background-color: #a7a7a7;
	padding: 0.2em 0.5em 0.2em 0.5em;
	text-decoration: none;
	border: none;
}

h1
{
	font-size: 1.1em;
	margin-top: 0;
	padding-top: 0;
}

h2
{
    /*color: #99f;*/
    color: #000;
	font-size: 1em;
	margin-top: 2em;
	padding-top: 0;
}

p
{
	font-size: 0.8em;
	line-height: 1.4em;
	text-align: left;
}

p.underline
{
	font-size: 0.8em;
	line-height: 1.4em;
	text-align: left;
	padding-bottom: 1em;
	margin-bottom: 2em;
	border-bottom: 1px solid #006;
}

dl
{
    font-size: 0.8em;
    margin: 0;
    padding: 0;
}

dt
{
    font-weight: bold;
    margin: 0;
    padding: 0;
}

dd
{
    line-height: 1.4em;
    margin: 0 0 1em 0; 
    padding: 0;
}

img { border: none; }

#WorkDetails dt
{
    float: left;
    clear: left;
    width: 33%;
    padding: 0;
    margin: 0 2em 0 0;
    line-height: 1.4em;
}

#WorkDetails dd
{
    padding: 0;
    margin: 0;
    line-height: 1.4em;
    overflow: hidden;
}

.workItemHeading
{
    min-width: 33%;
    font-weight: bold;
}

#searchNavigation a
{
    display: inline;
}

.previousButton
{
    float: left;
    display: inline;
    font-size: 0.8em;
    border: none;
}

.nextButton
{
    float: right;
    clear: none;
    display: block;
    font-size: 0.8em;
    border: none;
}

.navImage
{
    vertical-align: bottom;
    margin: 0 1em 0 1em;
    border: none;
}

#contactBox fieldset
{
    border: none;
    margin: 0;
    padding: 0;
}

#contactBox label.error 
{ 
    display: inline; 
    color: #f00; 
    padding-left: 1em; 
    vertical-align: top;
} 

#contactBox input
{
    width: 65%;
    margin-bottom: 1.6em;
    font-size: 1em;
    font-weight: normal;
}

#contactBox textarea
{
    width: 65%;
    margin-bottom: 1.6em;
    font-size: 1em;
    font-weight: normal;
    height: 5em;
}

#contactBox input.submitButton
{
    width: 20%;
    margin-left: 25%;
}

#searchBox form
{
	margin-top: 3em;
	color: #006;
	background-color: #ccf;
	font-size: 0.8em;
	font-weight: bold;
	text-align: center;
	padding: 1em 3em 1em 3em;
}

#searchBox input
{
	width: 25em;
}

a
{
	color: #99f;
    text-decoration: none;
    border: none;
}

table
{
    border: none;
}

tr
{
    margin: 0;
    padding: 0;
}

td
{
    font-size: 0.8em;
    font-weight: normal;
    padding: 3em 1.3em 0 0;
    vertical-align: baseline;
    text-align: center;
}

li a:link, a:visited
{
	color: #99f;
	font-weight: bold;
	text-decoration: none;
}

li a:hover
{
	color: #006;
	font-weight: bold;
	text-decoration: underline;
	border: none;
}

li a.current
{
	color: #006;
	font-weight: bold;
	text-decoration: underline;	
	border: none;
}

ul
{
	display: inline;
}

li
{
	display: inline;
	color: #006;
	font-weight: bold;
	padding-left: 1em;
}

select
{
    margin-right: 2em;
    width: 15em;
}

#periodImages
{
    clear: both;
}

#periodImages ul
{
	display: inline;
	margin-left: 0;
	padding-left: 0;
}

#periodImages li
{
	display: inline;
	color: #006;
	font-weight: bold;
	margin-left: 0;
	padding-left: 0;
	padding-right: 1em;
}

#periodImages img
{
    display: inline;
    cursor: pointer;
    border: none;
}

#collectionList ul
{
    display: block;
    margin-left: 0;
    list-style: none;
}

#collectionList li
{
    display: block;
    color: #000;
    font-size: 0.8em;
    font-weight: normal;
    line-height: 1.8em;
    margin-left: 0;
    padding-left: 0;
}

#chronoList ul
{
    width: 100%;
    margin-left: 0;
    padding-left: 0;
}

#chronoList ul li
{
    float: left;
    width: 50%;
    font-size: 0.8em;
    line-height: 1.8em;
    margin-left: 0;
    padding-left: 0;
    overflow: hidden;
}

#chronoList br
{
    clear: left;
}

/*  
** Admin styles  
*/
fieldset { margin-top: 2em; margin-bottom: 1em; }
legend { padding: 0 1em 0 1em; }
.hidden { display: none; }
.shown  { display: block; }

#periodList ul
{
    display: inline;
    width: 100%;
    margin: 0;
    padding: 0;
}

#periodList ul li
{
    display: inline;
    margin: 0;
    padding-left: 0;
    padding-right: 2em;
    text-decoration: none;
    font-size: 0.8em;
}

#periodEdit { width: 100%; line-height: 2em;  }
#periodEdit label { display: inline-block; line-height: 2em; vertical-align: top; width: 35%; margin: 0; padding: 0;}
#periodEdit ol { margin: 0; padding: 0; }
#periodEdit li { list-style: none; margin: 0; }
#periodEdit h1 { margin-top: 3em; margin-left: 35%; color: #99f; }
#periodEdit input { margin: 0; padding: 0; width: 60%; font-size: 0.8em; }
#periodEdit button { margin-left: 25%; }
#periodEdit textarea { margin: 0; padding: 0; width: 100%; height: 15em; font-size: 1em; }

#adminEdit { width: 100%; line-height: 2em;  }
#adminEdit label { display: inline-block; line-height: 2em; vertical-align: top; width: 35%; margin: 0; padding: 0;}
#adminEdit ol { margin: 0; padding: 0; }
#adminEdit li { list-style: none; margin: 0; }
#adminEdit h1 { margin-top: 3em; margin-left: 35%; color: #99f; }
#adminEdit input { margin: 0; padding: 0; width: 40%; font-size: 0.8em; }
#adminEdit button { margin-right: 3em; }
#adminEdit textarea { margin: 0; padding: 0; width: 40%; height: 15em; font-size: 0.8em; }
#adminEdit select { display: inline;}
#adminEdit label.error 
{ 
    display: inline; 
    color: #f00; 
    padding-left: 1em; 
    vertical-align: top;
    font-size: 0.6em;
} 

#workImage { cursor: pointer; }
#periodImage { cursor: pointer;  }
#imageDialogue { font-size: 0.8em; }
.imageBox { width: 50%; float: left; position: absolute; }
#imageList { width: 50%; float: right; clear: left; position: relative; }
#imageList a:hover { color: #f00; }
#imageList a:active { color: #f00; }
#imageWarning { color: #f00; }
#workForm select { font-size: 0.8em;}
#workForm img { border: none; }
.small { font-size: 0.8em; }
.iListSelected { color: #f00 !important; }
.iListNotSelected { color: #000 !important; }

/*#periodForm img { vertical-align: text-top; display: inline;}*/