/*Monomagic3 CSS file version 0.0  Created by Mark 7/4/2008*/
/*container for all page content*/
body {
	width:990px;
	padding:10px;
	background-color:#333333;
	font-size:80%;
	/*padding:10px;*/
	color:#999999;
	font-family:'Lucida Grande', Verdana, sans-serif;
	margin-left:auto;
	margin-right:auto;
	}
#container {
	background-color:#333333;
	min-height:500px;
	}
	/*rules for headings */
	h1 {
		font-size:150%;
		}
	
	h2 {
		font-size:140%;
		}
	
	h3 {
		font-size:120%;
		}
/*Image class for logo*/
	img.logo {
		float:left;
		border:0px;
		}

				
/*default paragraph styles*/

	p {
		font-size:100%;
		line-height:150%;
		
		}
 /*Create drop cap characters */
 	p.dropcap:first-letter {
 		float: left;
 		width:40px;
 		font: 60px "Lucida Grande", Arial, sans-serif;
 		line-height: 50px;
 	}
/*Spacer class to make masthead behave properly with the image. (see p 219 of Collinson)*/
	.spacer {
		clear:left;
		}
/*define class to float copyright notice to right of footer box.*/
	.right-float {
		float:right;
		}
		/*define styles for horizontal menu based on <ul> and <li> tags*/
 	ul.horizontal {
		list-style-type:none;
		}
 	li.horizontal {
 		display:inline;
		}
/*Rules for <a> tag */
	a {
		color:#999999;
		text-decoration:none;
		/*line-height:90%;*/
		}
/*define styles for <a> tag in horizontal menu.*/
	a.horizontal-menu {
		float:left;
		text-align:center;
		width:5.5em;
		text-decoration:none;
		/*font-size:1.00em;*/
		color:#999999;
		padding-top: 0.0em;
		padding-left: 0.6em;
		padding-right: 0.6em;
		padding-bottom: 0.0em;		
		}
		/*amended 28/12/2008 to debug thumbnail.php*/
		a.horizontal-menu:hover {background-color:#999999; color:#333333;}
/*Styling for a on logo. - added 28/09/2008*/
		a.logo:link {
			text-decoration:none;
			}
		a.logo:visited {
			text-decoration:none;
			}
		a.logo:hover {
			text-decoration:none;
			}
		a.logo:active {
			text-decoration:none;
			}
/*define style for reduced-size menu text*/
 .menu-text {
 		font-size:90%;
 		}
/*define style for links in menu-text - added 24/08/2009*/
	a.menu-text:link {
			text-decoration:none;
/*			color:#000000;*/
			}
		a.menu-text:visited {
			text-decoration:none;
			}
		/*changed hover to highlight... as per horizontal menu */
		a.menu-text:hover {
			background-color:#999999;
			color:#333333;
			}
		a.menu-text:active {
			text-decoration:none;
			}
/*Masthead*/
#masthead {
	width:970px;
	padding:10px;
	margin:0 0 10px 0;
	background-color:#333333;
	/*background-image:url(../top-to-bottom.gif);
	background-repeat:repeat-x;*/
	border:2px solid #222222;
	height:70px;
	}
/*sidbar_a */
#sidebar_a {
		float:left;
		/*changed from 250 to 200 px*/	
		width:250px;
		min-height:500px;
		margin-bottom:10px;
		padding:10px;
		/*border-right:1px solid #000;*/
		/*border:2px solid #222222;*/
		}
#content {
	/*float:right;*/
	width:600px;
	min-height:500px;
	padding:10px;	
	margin-left:275px;
	/*border-left:1px solid;*/
	}
	img.content {
		background:#fff;
		padding: 5px 5px 5px 5px;		
		border:3px solid #000;
		}
	img.technique {
		/*background:#fff;*/
		padding: 5px 5px 5px 5px;		
		/*border:3px solid #000;*/
		}
	p.clear-right {
		clear:right;
		}
	p.clear-left {
		clear:left;
		}
	.img-left {
		float:left;
		}
	.img-right {
		float:right;
		}
#footer {
	width:970px;
	padding:10px;
	margin:50px 0 10px 0;
	background-color:#333333;
	/*background-image:url(../bottom-to-top.gif);
	background-repeat:repeat-x;*/
	border:2px solid #222222;	
	min-height:70px;
	float:left;
	}
/*Create a class for the navigation bar in the footer.*/
 	#footer-nav {
 		text-align:center;
 		font-size:80%;
 		}

/*Top-Left-corner*/
#top-left {
	width:125px;
	height:125px;
	background-color:#444444;
	background-image:url(../top-left.gif);
	background-repeat:no-repeat;
	float:left;
	}
#top-right {
	width:125px;
	height:125px;
	background-color:#444444;
	background-image:url(../right-to-left.gif);
	background-repeat:no-repeat;
	float:right;
	}
/*define class to float copyright notice to right of footer box.*/
	span.right-float {
		font-size:80%;
		text-align:right;
		float:right;
		width:50%;
		}
/*define class for company registration details*/
	span.registration {
		font-size:80%;
		text-align:left;
		float:left;
		width:50%;
		}
/*define styling for thumbnail table. - Added 01/11/2008.
Modified 28/12/2008.  I want to try to make the thumbnails look like they are on a lightbox.*/
	td.thumbnail {
		width:142px;
		height:142px;
		background:#ccc;
		border-top:2px solid #fff;
		border-left:2px solid #fff;
		border-right:2px solid #333;
		border-bottom:2px solid #333;
		padding:4px;
		vertical-align:middle;
		text-align:center;
		font-size:70%;
		}
		/*Image class for thumbnail*/
	img.thumbnail {
		/*float:left;*/
		padding:1px;
		border-top:1px solid #222;
		border-left:1px solid #222;
		border-right:1px solid #eee;
		border-bottom:1px solid #eee;
		
		}
/*Styling for a on thumbnail. - added 01/11/2008*/
		a.thumbnail:link {
			text-decoration:none;
			color:#000000;
			}
		a.thumbnail:visited {
			text-decoration:none;
			}
		/*changed hover to highlight... as per horizontal menu */
		a.thumbnail:hover {
			text-decoration:none;
			 }
		a.thumbnail:active {
			text-decoration:none;
			}
