@import url('https://fonts.googleapis.com/css?family=Dosis:400|Tangerine:400|Anonymous+Pro:400');

html {background-color: white; color: black}
body {background-color: white; color: black; text-align: left; font-family:Dosis, Helvetica, Tahoma, Arial, Verdana, serif; margin-left: 40px; margin-right: 40px;}


#content
{
	background-image: url("../images/Sheet top left.jpg");
	background-position: top left;
	background-repeat: no-repeat;
	background-color: #F9F9F9;
	padding-left: 110px;
	padding-top: 30px;
	padding-right: 110px;
	padding-bottom: 20px;
	min-height: 110px;
	/* Work around IE not supporting min-height */
	_height: 110px;
}

#footer
{
	background-image: url("../images/Sheet bottom right.jpg");
	background-position: bottom right;
	background-repeat: no-repeat;
	background-color: #F9F9F9;
	min-height: 110px;
	/* Work around IE not supporting min-height */
	_height: 110px;
	padding-left: 110px;
	padding-top: 0px;
	padding-right: 110px;
	padding-bottom: 0px;
	vertical-align: bottom;
	}


p.footer {display: block; color: black; font-size: xx-small}
p.galindex {display: block}

h1 {display: block; font-size: 350%; font-weight: normal; margin-top: 60px; color: #17365D; font-family: Tangerine, Helvetica; text-shadow: 2px 2px 2px #77b;}
h2 {display: block; font-size: 130%; font-weight: bold; font-style: italic; margin-top: 40px; color: #17365D; background-color: #DBE5F1;}
h3 {display: block; font-size: 100%; font-weight: normal; font-weight: bold; color: #17365D;}
h4 {display: block; font-size: 100%; font-weight: normal; color: #17365D;}

.groupLabel {color: #365F91;}
.contactdetails {color: #17365D;}

li {margin-top: 0px; margin-bottom: 15px;}

#footermenu
{
	text-align: center;
	font-family: sans-serif; 
	font-size: x-small; 
	font-weight: bold; 
	clear: both;
}

div#footermenu a:visited, div#footermenu a:active, div#footermenu a:link
{
	color: blue;
}

.Button
{
	color: blue;
	cursor: pointer;
	text-decoration: underline;
	margin-left: 10px;
	margin-right: 10px;
}

div#footermenu a:hover
{
	color: red;
}

div#thumbnails
{
	vertical-align: middle;
	float: right;
	text-align: center;
	border: 1px solid gray;
	background-color: white;
	text-align: center;
	margin-top: 15px;
}

div#mainImageArea
{
	margin-left: 5px;
	width: 70%;
	text-align: center;
}

div#mainImageArea img
{
	margin: 5px;
	margin-top: 10px;
	padding: 10px;
}

div#thumbnails img
{
	/*margin: 5px;*/
	cursor: pointer;
}

div#thumbnails td
{
	width: 205px;
	height: 205px;
	text-align: center;
}

#comments
{
	text-align: left;
	margin-left: 50px;
}

#comments .comment
{
	padding: 10px 5px 0px 5px;
	margin: 0px;
}

#comments .author
{
	font-size: smaller;
	font-style: italic;
	padding: 0px 5px 5px 5px;
	margin: 0px;
}

#comments pre
{
	font-family: sans-serif;
}

table.galindex2 tr td a {height: 121px; width: 152px; background-image: url(/images/film.jpg); background-repeat: no-repeat; background-position: center center; text-align: center; vertical-align: middle; margin-top: 0; margin-bottom: 0}
table.galindex tr td a {text-align: center; vertical-align: middle}
table.galindex tr {margin-top: 0; margin-bottom: 0}
table.galindex tr td {vertical-align: middle; height: 121px; width: 152px; margin-top: 0; margin-bottom: 0}
table.galindex tr td a img {margin-top: 0; margin-bottom: 0}
table.galindex {margin-left: 0; margin-right: 0}

div.GalList a {text-decoration: none; color: black; border-color: transparent; font-size: small}
div.GalList a img {text-decoration: none; color: black; border-color: transparent; border-width: 0}


div#oldbanner
{
	display: none;
}

div#banner
{
	background-image: url("../images/banner.jpg");
	background-position: top center;
	width: 100%;
	height: 140px;
	background-repeat: no-repeat;
	clear: both;
}

div#header
{
	text-align: center;
}

div#mainmenu
{
	white-space: nowrap;
	clear: both;
	height: 35px;
	display: inline-block;
	_display: inline;
		position: relative;
	
	font-size: 12pt; 
	text-align: left;
	font-weight: bold;
	vertical-align: top; 
	background-image: url("../images/longmenu.jpg"); background-position: top left; background-repeat: no-repeat;
	margin: 0px;
	padding: 0px 0px 0px 30px;
	top: -55px;
	left: 120px;
}
#mainmenu ul {	
 list-style-type: none; background-image: url("../images/longmenu.jpg"); background-position: top right; background-repeat: no-repeat;
	/* Horizontal menus should display their contents as a row */
	display: table-row;
	padding: 0px 30px 35px 0px;
}
#mainmenu li {color: white; padding-left: 0px; padding-right: 20px; margin: 0px;
	float: left;
		display: table-cell;
	height: 35px;
	margin-top: 8px;

}



div#mainmenu a
{
	text-decoration: none;
}

div#mainmenu a:link, div#mainmenu a:visited, div#mainmenu a:active
{
	color: white;
}

div#mainmenu a:hover
{
	color: red;
}

div#basicmenu a:link, div#basicmenu a:visited, div#basicmenu a:active
{
	color: blue;
}

.collapsibleHeader
{
	background-image: url("../images/updown.gif");
	background-position: 10px center;
	background-repeat: no-repeat;
	
	background-color: #5555FF;
	border-top: 3px solid #8888FF;
	border-left: 3px solid #8888FF;
	border-bottom: 3px solid #2222FF;
	border-right: 3px solid #2222FF;
	color: white;
	font-weight: bold;
	
	/*height: 30px;*/
	padding-left: 30px;
	vertical-align: middle;
	margin-top: 5px;
	margin-bottom: 5px;
}

.collapsibleHeader[collapsed="false"]
{
	background-image: url("../images/collapse.gif");
}

.collapsibleHeader[collapsed="true"]
{
	background-image: url("../images/expand.gif");
}

/* IE & Firefox */

a.thumbnail, a.thumbnail:visited
{
	border: 3px solid white;
}

/* IE */

/* Disable until we can get merge script not to indent img within a - IE renders this effect incorrectly
a.thumbnail:hover
{
	border-bottom-color: black;
	border-right-color: black;
	border-top-color: #AAAAAA;
	border-left-color: #AAAAAA;
}

a.thumbnail img
{
	margin: 3px;
	border: none;
}
*/
/* Firefox */
div>a.thumbnail:hover, td>a.thumbnail:hover
{
	border: 3px solid white;
}

a.thumbnail>img, a.thumbnail:visited>img
{
	border: 3px solid white;
}

a.thumbnail>img:hover
{
	border-bottom-color: black;
	border-right-color: black;
	border-top-color: #AAAAAA;
	border-left-color: #AAAAAA;
}

a.thumbnail>img
{
	margin: 0px;
}

table.cds thead tr
{
	background-color: #AAAAFF;
}

table.cds tr.odd
{
	background-color: #EEEEEE;
}

table.cds tr.even
{
	background-color: transparent;
}

table.cds
{
	padding-bottom: 10px;
}

table.cds td
{
	padding-right: 5px;
}

div#playlistselector
{
	text-align: right;
}

div.pagingControls
{
	font-size: smaller;
	font-weight: bold;
	font-variant: small-caps;
	margin-top: 5px;
}

div.pagingControls a
{
	margin-left: 10px;
}

tr.deleted td
{
	text-decoration: line-through;
}

body.gallery
{
	background-image: url("../images/filmcorner.jpg");
	background-repeat: no-repeat;
	background-position: bottom right;
}

.ProgressBar
{
	background-color: transparent;
	border: 1px solid black;
	display:-moz-inline-stack; /* Firefox 2 */
	display: inline-block; /* Firefox 3 */
	*display: inline; /* IE */
	text-align: left;
}

.ProgressBarSlider
{
	height: 100%;
	background-color: blue;
	width: 0%; /* Start empty */
}


.code
{
  font-family: "Anonymous Pro", "Consolas", monospace;
  font-size: smaller;
	background-image: url("../images/tractorfed.gif");
	background-position: left;
	background-repeat: repeat-y;
	margin: 20px;
	margin-left: 10px;
	margin-right: 10px;
	padding-left: 100px;
	display: block;
}

.code pre
{
  font-family: "Anonymous Pro", "Consolas", monospace;
	background-image: url("../images/tractorfed.gif");
	background-position: right;
	background-repeat: repeat-y;
	padding-top: 35px;
    padding-bottom: 20px;
	margin-top: 0px;
	display: block;
}

.commandprompt
{
	background-image: url("../images/commandprompt.gif");
	background-position: top right;
	margin: 20px;
	margin-left: 100px;
	margin-right: 100px;
	padding-top: 4px;
	padding-right: 2px;
	background-color: black;
	display: block;
}

.commandprompt pre
{
	background-image: url("../images/commandprompt.gif");
	background-position: bottom left;
	color: yellow;
	margin: 0px;
	padding-top: 30px;
	padding-left: 10px;
	font-family: Lucida Console, Console, monospace;
}

/* CV-specific styling */
.cv .title .postnominal {font-family: Dosis; font-size: 35%;}
.cv .employersummary {font-style: italic; font-size: smaller;}
.cv td {vertical-align: top;}
.cv td {border-top: 2px solid transparent; border-bottom: 2px solid transparent; border-left: 0px solid transparent; border-right: 20px solid transparent;}
.cv .skills td {border-top: 2px solid transparent; border-bottom: 15px solid transparent; border-left: 0px solid transparent; border-right: 20px solid transparent;}
.cv .contactdetails {text-align: center; font-size: smaller;}
.cv .daterange {float: right;}
.cv .title {text-align: center; display: block; width: 100%; color: #17365D;}