/* Main */
	
/* reset browser default settings */

	* {
		margin:0;
		padding:0;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		}
		
	a:link {
	color: red
	}
	a:visited {
	color: #969696
	}
	a:hover {
	color: #646464
	}
	a:active {
	color: #646464
	}	
	  	
	div#mainwrap {
		width:775px;
		margin-left:auto;
		margin-right:auto;
		text-align:left;
	}
	
	div#header {
		width:775px;
		height:200px;
		background-color:#000000;
		text-align:center;
	}
	
	div#contentarea {
		font:Verdana, Arial, Helvetica, sans-serif
		width:775px;
		background-color:#FFFFFF;
		background-repeat:no-repeat;
		height: auto;
	}
	div#column1 {
		width:185px;
		float:left;
	}
	div#column2 {
		background-color:#FFFFFF;
		width:590px;
		float:left;
	}
	div#footer { 
		font-size:12px;
		color:#FFFFFF;
		width:775px;
		background-color: #FF0000;
		text-align:center;
		padding-top:3px;
		padding-bottom:3px;
		clear:left;
	}
	
	body {
		background-repeat:repeat-x;
		background-color:#333333;
		margin:0px;
		padding:0px;
	}
	
	.heading{
		font:Verdana, Arial, Helvetica, sans-serif;
		padding-left:10px;
		font-size:20pt;
		
		color: #ff0000;
	  }
	  
	  p.subheading{
		font: Verdana, Arial, Helvetica, sans-serif;
		margin-left:15px;
		font-size:13pt;
		font-style:italic;
		color: #ff0000;
	  }
	  
	.text {
		font-size:12px;
		text-indent:1em;
		color:#000000;
		text-align:left;
		margin: 50px;
		line-height:1.8
		}
		
	.back {
		padding:0px 0 10px;
		font-size:10pt;
		text-align:right;
		}
		
	#nav-menu ul{
		list-style: none;
		padding: 0;
		margin: 75px 0 0 200px;
	}

	#nav-menu li{
		float: none;
		margin:0.75em;
	}
	
	#nav-menu li a{
		height: 2em;
		line-height: 2em;
		float: left;
		width: 10em;
		display: block;
		color: #0d2474;
		text-decoration: none;
		text-align: center;
	}
	
/* Hide from IE5-Mac \*/
	#nav-menu li a{
		float: none
	}
/* End hide */
	
	#nav-menu{
		width:30em
	}
	
	div.colour_box
	{
	  background-color:#e2decc;
	  margin-left:10px;
	  height: auto;
	  width: 570px;
	  float: left;
	  text-align: center;
	  border:#00CC00;
	}	
	div.thumb_publication
	{
	  padding: 0 5px 0 5px;
	  height: auto;
	  width: auto;
	  float: left;
	  text-align: center;
	  border:#00CC00;
	}	
	
	div.thumb_publication img
	{
	  display: inline;
	  margin: 3px;
	  border: 1px solid white;
	}
	div.thumb_publication a:hover img {border: 1px solid #c8c8c8;}
	div.desc
	{
	font-size:11px;
	  text-align: center;
	  font-weight: normal;
	  width: 84px;
	  color:#666666;
	  margin: 2px;
	}
	
/* ----------------------------------------------------------------------------------------------------------------------------------- */		
/* Employment */


	.intro{
	font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 12pt;
		color:#333333;
		text-align:center;
		line-height: 25px;
		}
		
	.EmpName{
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 11pt;
		font-weight: bold;
		color: red;
		line-height: normal;
	}
	
	.TXT {margin:0 10px 0 10px;
		font-size:11pt;
		font-style:italic;
		color: GREY;
		padding-top:5px;
		}
	
	.emp_TXT {
		margin:25px 25px;
		font-size:10pt;
		}

	.emp_TXT p {
		margin:10 10px 0;
		}
	
	.emp_TXT img {
		float:left;
		margin:0px 10px 10px 0;
		}
		
	.clearthefloats {clear:both;}

/* ----------------------------------------------------------------------------------------------------------------------------------- */	
/* Gallery */

	#gallery {
		position:relative;
 		width:575px;
		margin:0px auto 0 auto;
		border:1px solid #ffffff;
		background:#ffffff;
	}

/* Remove the images and text from sight */
	#gallery a.gallery span {
		position:absolute;
		width:1px;
		height:1px;
		top:5px;
		left:5px;
		overflow:hidden;
		background:#fff;
	}

/* Adding the thumbnail images */
	#gallery a.gallery, #gallery a.gallery:visited {
		display:block;
		color:#000;
		text-decoration:none;
		border:1px solid #000;
		margin:1px 2px 1px 2px;
		text-align:left;
		cursor:default;
	}

/* styling the hovers */
	#gallery a.gallery:hover {
		border:1px solid #fff;
	}
	
	#gallery a.gallery:hover span {
		position:absolute;
	 	width:450px;
	  	height:300px; 
	 	top: 0px; 
	 	left:65px;
	 	background:#fff;
	   }
	   
	#gallery a.gallery:hover img {
		border:1px solid #fff;
		float:left;
		margin-right:1px;
	  }
	  
	  .roll{
	  position:absolute;
	  width:450px;
	  height:300px; 
	  top: 0px; 
	  left:65px;
	  }

/* ----------------------------------------------------------------------------------------------------------------------------------- */	
/* Projects */

	p.proj_text{
		padding: 10px;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-size: 10pt;
		line-height: normal;
		
		}
		
	.proj_msg{
		text-align:center;	
		color:#FF0000;
		}	

ul.project	{
	color:#666666;
	font-style:italic;
	padding-left: 25px;
	list-style:url(../images/bullet.png)
}
		
/* ----------------------------------------------------------------------------------------------------------------------------------- */	
/* Contact */

.contact_txt {
	margin:25px 50px 0;
	line-height:1.7;
	font-size:11pt;
	text-indent:1em;
	color:#000000;
	text-align:left;
	font-family: Verdana, Arial, Helvetica, sans-serif;
	}
.footer_txt {
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:10px;
	font-style:italic;
	text-align:center;
	}
.contact_info { 
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	font-weight:bold;
	text-align:left;
	padding:0px 0px;
	}



/* ----------------------------------------------------------------------------------------------------------------------------------- */
/* History */

.HistoryName{
	font-family: Verdana, Arial, Helvetica, sans-serif;
	font-size: 20pt;
	font-weight: bold;
	color: #c8c8c8;
	/*line-height: normal;*/
	
	}
	
	
/* ----------------------------------------------------------------------------------------------------------------------------------- */
	/* here follows the brillant "no-extra-markup" clearing method devised by Tony Aslett - www.csscreator.com */
	/* simply add the clearfix class to any containter that must enclose floated elements */
	/* read the details of how and why this works at http://www.positioniseverything.net/easyclearing.html */
	.clearfix:after {
		content: ".";              /* the period is placed on the page as the last thing before the div closes */
		display: block;          /* inline elements don't respond to the clear property */
		height: 0;                  /* ensure the period is not visible */
		clear: both;               /* make the container clear the period */
		visibility: hidden;	     /* further ensures the period is not visible */
	}
	
	.clearfix {
		display:
		inline-block;
	}   /* a fix for IE Mac */
	
	/* fix for the dreaded Guillotine bug in IE6 */
	/* Hides from IE-mac  */
	
	* html .clearfix {height: 1%;}
	.clearfix {display: block;} 
	/* End hide from IE-mac */
	/* end of "no-extra-markup" clearing method */