/******************************************************
	Structure  CSS document 
	Marius Nel	
	- marsnel.co.za -
******************************************************/

/* Code to make web page 100% height  in browser window	*/ 
html, body{height:100%;} 

html>body #siteWrapper
{
	height: auto;
} 

/* Code to reset elements margin and padding to zero  */ 
* {
	margin: 0;
	padding: 0;
	}
	
a img {
	border: none;
	}

body {
	background: #efefef;
	color:#565050;
	font-size: 12px;
	font-family:'Lucida Grande',Verdana,Arial,Sans-Serif;
	}
	
a { color:#0099CC; text-decoration: none; }
	
div#siteWrapper {
	position: relative;
	width: 100%;
	/* Footer Clearing Code */
	margin-bottom: -99px !important;
	height: 100%;
	min-height: 100%;
	}
	
	div#mastHeadOuter { width: 100%; height:85px; background: #FFF; position: relative; }
		
	div#mastHead {
		width: 980px;
		height: 85px;
		position: relative;
		margin: 0 auto;
		}
		
	div#viewPortOuter { width: 100%; position: relative; float: left; background: #2C2C2C top left repeat-x url(../images/viewport_top.jpg); padding-top: 15px; z-index: 100; }
	
		div#viewPort { width: 980px; display: block; margin: 0 auto; clear: both;  }
		
	div#contentOuter {
		position: relative;
		width: 100%;
		padding: 20px 0;
		clear: both;
		display: block;
		visibility:visible;
		background: #efefef top left repeat-x url(../images/content_top.png);
		float: left;
		}
		
		div#contentInner {
			position: relative;
			width: 980px;
			margin: 0 auto;
			padding: 0;
			clear: both;
			display: block;
			visibility:visible;
			}
		
		div.contentBlock { position: relative; float: left; display: block; padding-top: 15px; }
		
			div.contentBlock div { position: relative; float: left; display: block; }
		
		div.sideBar { position: relative; float: right; display: block; padding-top: 15px; margin-right: 33px; } 
		
		.right { float: right; }
		
		.left { float: left; }
		
	/* Gallery =================================================================================== */
	div.galleryBlock { position: relative; width: 100%; height: 384px; background: #000; padding: 10px 0; }
	div.galleryWrapper { position: relative; width:902px; margin: 0 auto; display: block;}
	div.thumbs { position: relative; padding: 43px 0 0 25px; width: 350px; float: left; }
	
	div.thumbs img { float: left; margin-right: 35px; margin-bottom: 35px; cursor: pointer; border: 1px solid #666; }
	
	/* ZoomBlock */
	div.zoomBlock { position: relative; float: right; width: 380px; height: 380px; margin-bottom: 10px; border: 1px solid #333; }
	
	.clr { clear: both; }
	
	/* Content Typography */
	h1, h2, h4 { font-family:'Trebuchet MS','Lucida Grande',Verdana,Arial,Sans-Serif; font-weight:bold; }
	/* Box Headers */
	h2 { width: 526px; height: 28px; background: transparent top left no-repeat url(../images/wideblock_hdr_bg.png); padding: 5px 0 0 25px; font-size: 16px; }
	h4 { width: 265px; height: 28px; background: transparent top left no-repeat url(../images/smallblock_hdr_bg.png); padding: 5px 20px 0 25px; font-size: 16px; }
	/* Content Headers */
	h3 { margin-bottom: 10px; font-weight: bold; font-size: 18px; }
	h5 { font-size: 12px; font-weight: bold; margin-bottom: 10px; }
	
	p { margin-bottom: 10px; }
	
	#mastHead a.home-link { position: relative; margin-top: 15px; display: block; float: left; width: 346px; height: 58px; }
	
	#mastHead a h1 { text-indent: -9999px; background: transparent top left no-repeat url(../images/mars-nel.png); width: 346px; height: 58px; }
		
	div.wideBlock { position: relative; float: left; padding: 15px 25px; width: 475px; background: transparent bottom left no-repeat url(../images/wideblock_bg.png); }
	
	div.narrowBlock { position: relative; float: left; padding: 15px 25px; width: 260px; background: transparent bottom left no-repeat url(../images/smallblock_bg.png); }
	
	.ital { font-style: italic; }
	
	/* Footer */
	div#footerWrapper { width: 100%; height: 99px; background: #FFF; border-top: 1px solid #dddddd; }
	
	div#footerInner { margin: 0 auto; width: 940px; padding: 8px 20px 0 20px; height: 86px; position: relative; display: block; }
	
	div#footerLinks {
		margin: 0 auto;
		}
	
	#clearBottom {/*needed to make room for footer*/
	clear: both;
	height: 99px;
	}

* > html #clearBottom {float:left; width: 100%;}/* ie mac styles */