/* --------------------------------------------/ UNIVERSAL CLASSES \-------------------------------------------- */

/* --------------------------------------------*/




/* --------------------------------------------/ BROWSER INITIALIZATION \-------------------------------------------- */

	* { margin : 0; padding : 0; }
	h1,h2,h3,h4,h5,h6 { font-size : 100%; }
	ol,ul { list-style : none; }
	table { border-collapse : collapse; border-spacing : 0; }
	fieldset,img { border : 0; }
	caption,th { text-align : left; }
	
	body { 
	text-align:left; 
	color:#FFF; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px; 
	background-color:#FFF; 
	}

/* --------------------------------------------*/




/* --------------------------------------------/ BOX MODEL CLASS \-------------------------------------------- */

	.box { position:relative; float:left; width:100px; height:100px; margin:10px; background-color:#000; overflow:hidden; }
	
	.top-box{ position:relative; float:left; left:5px; background-image:url(../images/top-div.jpg); width:610px; height:7px; background-repeat:no-repeat;}
	
	.middle-box{ position:relative; float:left; left:5px;  background-image:url(../images/middle-div.jpg); width:610px;}
	
	.expander{ width:600px; height:195px; overflow:auto;}
	
	.bottom-box{ position:relative; float:left; left:5px;  background-image:url(../images/bottom-div.jpg); width:610px; height:15px; }

/* --------------------------------------------*/


/* --------------------------------------------/ HEADER \-------------------------------------------- */

	#container_header { width:100%; height:100%; }
		
		#header {
	position:relative;
	width:808px;
	height:81px;
	margin:auto;
	background-color:#FFFFFF;
	background-image: url(../images/header.jpg);
		}

/* --------------------------------------------*/


/* --------------------------------------------/ NAV \-------------------------------------------- */

#container_nav { width:100%; height:100%; }
	
	#nav {
	position:relative;
	width:808px;
	height:35px;
	margin:auto;
	background-image:url(../images/nav-bar.jpg);
	}
	
		#nav li { position:relative; float:left;  }
		
		#nav ul {
	position:relative;
	float:left;
	left:12px;
}

		/*  
		To Find "#nav a width" :
			Step 1 - change the "#nav a padding" so that the menu item covers the entire nav area from top to bottom.
			Step 2 - compute the "#nav a width" with the equation below  
			
			  ((#nav width) / (# of menu items)) - (2 * (#nav a padding)) = #nav a width 
			  (    800      /         6        ) - (2 *        13       ) = 107.333 = 107 
		*/

		#nav a {
	display:block;
	padding:12px 37px 8px 37px;
	text-align:center;
	text-decoration:none;
	color:#FFF;
	font-size: 10px;
	font-family: Arial, Helvetica, sans-serif;}

	
	#nav a:hover { color:#ddd; }

/* --------------------------------------------*/

/* --------------------------------------------/ dropdown \-------------------------------------------- */		



/* ######### Style for Drop Down Menu ######### */

	.dropmenudiv{
		position:absolute;
		top: 0;
		border: 1px solid #BBB; /*THEME CHANGE HERE*/
		border-bottom-width: 0;
		font:normal 12px Verdana;
		line-height:18px;
		z-index:500;
		background-color:#5b83be;
		width: 200px;
		visibility: hidden;
		/*filter: progid:DXImageTransform.Microsoft.Shadow(color=#CACACA,direction=135,strength=4); Add Shadow in IE. Remove if desired*/
		}
		
		
	.dropmenudiv a{
		width: auto;
		display: block;
		text-indent: 3px;
		border-bottom: 1px solid #BBB; /*THEME CHANGE HERE*/
		padding: 2px 0;
		text-decoration: none;
		color:#fff;
		}
		
	* html .dropmenudiv a{ /*IE only hack*/
		width: 100%;
		}
		
	.dropmenudiv a:hover{ /*THEME CHANGE HERE*/
	 	background-color:#0066CC;
		}


/* --------------------------------------------*/	

 
/* --------------------------------------------/ CONTENT \-------------------------------------------- */

#container_content { width:100%; }

	#content {
	position:relative;
	width:808px;
	height:100%;
	margin:auto;
	background-image:url(../images/body-bg.jpg);
	font-family:Arial, Helvetica, sans-serif;
		}

	#top-content {
		position:relative;
		float:left;
		width:804px; /* (#content width) - (2 * (#middle-content padding) */
		height:100%;
		margin:auto;
		padding:2px;
		}

	#slideshow{ position:relative; left:36px;}

	
	#left-content {
		position:relative;
		float:left;
		width:245px; /* (#content width) - (2 * (#middle-content padding) */
		height:120px;
		margin:auto;
		left:10px;
		padding-bottom:20px;
		background-color:#728196;
		background-image: url(../images/whoweare.jpg);
		background-repeat: no-repeat;
		padding-right: 10px;
		padding-top: 30px;
		}

	#middle-content {
		position:relative;
		float:left;
		width:243px; /* (#content width) - (2 * (#middle-content padding) */
		height:120px;
		margin:auto;
		left:19px;
		padding-bottom:20px;
		background-image: url(../images/whatwedo.jpg);
		background-repeat: no-repeat;
		padding-top: 30px;
		padding-right: 15px;
		}
		
	#right-content {
		position:relative;
		float:left;
		width:215px; /* (#content width) - (2 * (#middle-content padding) */
		height:120px;
		margin:auto;
		left:25px;
		padding-bottom:20px;
		background-image: url(../images/featured.jpg);
		background-repeat: no-repeat;
		padding-top: 30px;
		padding-left: 20px;
		padding-right: 20px;
		}
		
	#sub-content{
		position:relative;
		float:left;
		left:8px;
		background-color:#fff;
		margin-top:4px;
		margin-bottom:4px;
		width:790px;
		border:1px solid #ccc;}
		
	#sub-content-left{ position:relative; float:left; width:180px; left:5px; background-color:#728196; height:100%; }
	
		#sub-content-left h2{ font-size:14px;  margin:15px 10px 0 6px;}
		
		#sub-content-left ul{ position:relative; font-size:11px; margin-top:1px; left:10px;}
		
		#sub-content-left li{ }
		
		#top-nav{ width:162px; font-size:13px; height:21px; background-image:url(../images/left-nav-top.jpg); text-align:center; padding-top:5px; font-weight:bold; background-repeat:no-repeat;}
		
		#sub-content-left a{ display:block; color:#000; background-image:url(../images/left-nav-middle.jpg); background-repeat:no-repeat; width:162px; height:17px; text-align:center; text-decoration:none; padding-top:3px; font-weight:bold;}
		
		#sub-content-left .mid2{ background-image:url(../images/left-nav-middle2.jpg); background-repeat:no-repeat;}
		
		#sub-content-left a:hover, #sub-content-left a.currentpage { color:#003366;}
	
	#sub-content-right{ position:relative; float:left; width:620px; left:3px; height:100%; }
	 
		#sub-content-right h1{ color:#336699; font-size:18px; font-weight:normal;  margin:0px 15px 5px 25px;}
		
		#sub-content-right p{ color:#333333; line-height:18px; font-size:11px;  padding:5px 15px 5px 25px; text-align:justify;}
		
		#sub-content-right img{ margin-left:30px;}
		
		#sub-content-right ul{ padding:3px 15px 10px 15px; background-color:#d6d6d6; border:1px solid #CCCCCC; margin:3px 15px 10px 25px; }
		
		#sub-content-right li{ color:#000; margin-top:5px; font-size:11px;}

			
			.min-holder {float:left; width:1px; height:250px;}
			
			.min-holder-contact {float:left; width:1px; height:650px;}
	
			.clear {clear:both; height:1px; overflow:hidden; background-image:url(../images/body-bg.jpg);}

/* --------------------------------------------*/




/* --------------------------------------------/ FOOTER \-------------------------------------------- */

#container_footer { clear:both; width:100%; height:100%; }
	
	#footer {
	position:relative;
	width:808px;
	height:47px;
	margin:auto;
	background-image:url(../images/footer.jpg);
	color: #4974b4;
	background-repeat: no-repeat;
	}

		#footer ul { position:relative; float:right; margin-top:15px; right:20px; }

		#footer li { position:relative; float:left; margin-left:10px; }

		#footer a {
	text-decoration:none;
	color:#6272B4;
}

		#footer a:hover { color:#FFF; }

/* --------------------------------------------*/




/* --------------------------------------------/ JSE LINK \-------------------------------------------- */

#container_jseLink { width:100%; height:100%; }
	
	#jseLink { 
	position:relative; 
	width:600px;
	height:40px;
	margin:auto;
	margin-top:20px;
	margin-bottom:20px; 
	}
	
		#RLInk1 { display:block; height:40px; padding:5px 0 0 311px; font-family:Verdana, Arial, Helvetica, sans-serif; text-decoration:none; font-weight:bold; font-size:10px;
			color:#111; background-image:url(../images/jseLink-black.gif); }
		 /* color:#FFF; background-image:url(../images/jseLink-white.gif); } */

		#RLInk2 { display:block; display:none; width:235px; position:absolute; top:0px; left:0px; padding:5px 0 0 365px; height:40px; font-family:Verdana, Arial, Helvetica, sans-serif; text-decoration:none; font-weight:bold; font-size:12px;
			color:#111; background-image:url(../images/jseLink-black-over.gif); }
		 /* color:#FFF; background-image:url(../images/jseLink-white-over.gif); } */


/* --------------------------------------------*/