/* http://www.treetrybe.com/imm/tests/nn4_3cols_x.html */
/* --- page uses content-left, content-main, content-right ---------- */
/* --- section uses content-left, section-main, content-right ---------- */
/* --- index uses content-left, index-main, content-right ---------- */
/* --- plan to make simpler and use same for all ---- 
   ----content-left, content-main, content-right and section-main  ---- */

/* NB #div is for id= while .div is for class= */

/* --- header divs --- */

div#header{
	width: auto;
	\width: 98%;
	w\idth: auto;
	min-width: 700px;   
	text-align: left; 
	padding-bottom: 0px;
	/*border-bottom: 1px solid black;  */
	/*background-color: #bdd7b9;*/
	}

div#header-index {
	width: auto;
	\width: 98%;
	w\idth: auto;
	min-width: 700px;   
	text-align: center; 
	padding-top: 10px;
	padding-bottom: 20px;
	padding-left: 5px;
	border-bottom: 1px solid black; 	  
	background-color: #c4d7c4;
	}

/* main content --- */			
div#content-wrap {
	width: auto;
	\width: 98%;
	w\idth: auto;
	min-width: 700px;   /* works only for NS6+ IE6+  */
	text-align: center;
	clear: both;	
	padding: 0px;
	/*background-color: #bdd7b9;*/
	/*border-top: 1px solid black; */
	}
				
/* --- left column ------*/
div#content-left {
	float: left;
	width: 150px; /* for browsers with no escapes at all */
	\width: 155px; /* for IE5/Win */
	w\idth: 150px; /* for good browsers */
	text-align: left;
	/*border-right: 1px solid black;  */
	/*border-left: 1px solid black;*/
	/*border-bottom: 1px solid black;*/
	/*background-color: #bdd7b9;*/
	padding: 0px;
	margin-left: 1px;
	}
	
div#index-left {
	float: left;
	width: 175px; /* for browsers with no escapes at all */
	\width: 175px; /* for IE5/Win */
	w\idth: 170px; /* for good browsers */
	text-align: left;
	background-color: #e5e4cf;
	padding: 0px;
	margin-left: 1px;
	margin-right: 1px;
	}	
	
			
/* --- right column index ---------- */
div#content-right {
	float: right;
	width: 150px; /* for browsers with no escapes at all */
	\width: 155px; /* for IE5/Win */
	w\idth: 150px; /* for good browsers */
	text-align: center;
	/*border-left: 1px solid black;  */
	/*border-right: 1px solid black;*/
	/*border-bottom: 1px solid black;*/
	/*background-color: #bdd7b9;*/
	margin-right: 1px;
	padding: 0px;
	}

div#index-right {
	float: right;
	width: 250px; /* for browsers with no escapes at all */
	\width: 255px; /* for IE5/Win */
	w\idth: 250px; /* for good browsers */
	text-align: left;
	/* border-left: 1px solid black;  */
	/*border-right: 1px solid black;*/
	/*border-bottom: 1px solid black;*/
	/*background-color: #bdd7b9;*/
	margin-left: 20px;
	padding-left: 2px;
	}		
/* --- center column  (main content)----------  for index, default (section) and ordinary files ---------- */
div#index-main  {
	width: auto;
	\width: 98%;
	w\idth: auto;
	/* min-width: 400px;  only NS6, not IE5.5 or NS4 */
	margin-right: 253px; /* T L B R */
	margin-left: 172px; /* T L B R */
	padding: 20px;
	text-align: left;
	/* background-color: #bdd7b9; */
	border-right: 1px solid black;
	border-left: 1px solid black;
	/*border-bottom: 1px solid black;*/
	/*border-top: 1px solid black;*/
	}		
	
div#section-main {
	float: left;
	width: 500px; /* for browsers with no escapes at all */
	\width: 505px; /* for IE5/Win */
	w\idth: 500px; /* for good browsers */
	text-align: left;
	/*border-left: 1px solid black;*/
	padding: 0 25px;
	}	

div#content-main  {
	width: auto;
	\width: 98%;
	w\idth: auto;
	min-width: 400px; /* only NS6, not IE5.5 or NS4 */
	margin: 0 130px; /* T L B R */
	text-align: justify;
	padding: 0 25px;
	}

div#footer-index {
	text-align: center;
	background-color: #c4d7c4;
	padding: 0px;
	padding-bottom: 20px;
	border-top: 1px solid black;
	margin-bottom: 0px;
	}		

div#footer {
	text-align: center;
	padding: 0px;
	padding-bottom: 20px;
	/*border-top: 1px solid black;*/
	margin-bottom: 0px;
	}		
/* --- search div  ---------- */
div#search {
	margin-top: -25px;
	float: right;
	width: 250px; /* for browsers with no escapes at all */
	\width: 255px; /* for IE5/Win */
	w\idth: 250px; /* for good browsers */
	text-align: left;
	padding-left: 0px;
	}
	
/* ---------------------------------- image divs ------------------------------- */
/* --- section image  ---------- */
div#section-image {
	float: right;
	width: 150px; /* for browsers with no escapes at all */
	\width: 155px; /* for IE5/Win */
	w\idth: 150px; /* for good browsers */
	text-align: center;
	padding-left: 15px;
	}

/* --- title image  ---------- */
div#title-image {
	float: right;
	width: 500px; /* for browsers with no escapes at all */
	\width: 505px; /* for IE5/Win */
	w\idth: 500px; /* for good browsers */
	text-align: center;
	padding-bottom: 25px;
	}

/* --- home image  ---------- */
div#home-image {
	width: 150px; /* for browsers with no escapes at all */
	\width: 155px; /* for IE5/Win */
	w\idth: 150px; /* for good browsers */
	text-align: center;
	padding-bottom: 7px;
	}
			
/* ----- popup image -----------*/
/* http://www.meyerweb.com/eric/css/edge/popups/demo2.html  */
div#links { z-index: 100;}
div#links a {display: block; text-align: left; padding: 3px; margin: 2px; border-width: 0; text-decoration: none; background: #c4d7c4;  }
div#links a:hover {color: #993300; background: transparent; }
   
/* controls the image */   
div#links a img {height: 0; width: 0; border-width: 0;}
div#links a:hover img {position: absolute; top: 70px; right: 10px; height: 126px; width: 94px;}

/* controls the text popup */
div#links a span {display: none;}
div#links a:hover span {display: block;
   position: absolute; top: 210px; right: 8px; width: 234px;
   padding: 5px; z-index: 100; border: 1px solid black; margin: 0px; 
   color: #000; background: #ffe;  }
      			
/* -- image -- */
div#imageHolder {padding: 5px; width: 75%;}

div#imageHolderCentral {border: 1px solid #000; padding: 5px; width: 55%;}
	
div#imgRight {
	float: right;
	margin: 10px;
	padding: 5px;
	text-align: center;
	}

div#imgCentre {
	margin-left: 29px;
	margin-top: 10px;
}

div#imgLeft {
	float: left;
	margin-right: 10px;
	text-align: center;
	}
	
div#imgRight p, div#imgLeft p {
font: 70% Verdana, arial, sans-serif;
 margin: 0;
 padding: 0;
 font-size: 8pt;
 text-align: center;
 }