/* --------------------------------------------/ 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:#333333; 
	font-family:"Trebuchet MS", sans-serif;
	font-size:12px;
	background:url(../images/bg.jpg) center no-repeat fixed;
	background-color:#65aa13; 
	}

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




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

	.top-box { position:relative; float:left; width:697px; height:23px; background-image:url(../images/top-box.jpg);}
	
	.middle-box { position:relative; float:left; width:697px; height:100%; background-image:url(../images/middle-box.jpg);}
	
	.bottom-box { position:relative; float:left; width:697px; height:23px; background-image:url(../images/bottom-box.jpg);}
	
	.inside-top { position:relative; float:left; width:653px; height:14px; background-image:url(../images/inside-top.jpg); left:22px;}
	
	.inside-middle { position:relative; float:left; width:653px; height:100%; background-image:url(../images/inside-middle.jpg); left:22px;}
	
		.inside-middle h1{ font-size:16px; padding:0 0 0 15px;}
		
		.inside-middle h3{ font-size:14px; color:#009900; padding:0 0 0 15px;}
		
		.inside-middle .package{ font-size:13px; padding:3px 15px 10px 15px;}
		
		.inside-middle p{ font-size:13px; padding:10px 15px 0 15px;}
		
		.inside-middle a{ color:#006600; text-decoration:underline;}
	
	.inside-bottom { position:relative; float:left; width:653px; height:19px; background-image:url(../images/inside-bottom.jpg); left:22px;}
	
	.inside-bottom-pic { position:relative; float:left; width:653px; height:173px; background-image:url(../images/inside-bottom-pic.jpg); left:22px; }
	
		.inside-bottom-pic p{ font-size:13px; padding:0px 210px 0 15px;}
		
		.inside-bottom-pic a{ color:#006600; text-decoration:underline;}
		
		.inside-bottom-pic h2{ font-size:15px; padding:10px 0 0 15px;}

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


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

	#container_header { width:100%; height:100%; }
		
		#header { 
		position:relative; 
		width:1000px;
		height:180px;
		margin:auto;
		background-image:url(../images/header.gif); 
		}
		
		#header ul{ position:relative; float:left; left:780px; top:15px;}
		
		#header li{ display:inline; font-family:"Times New Roman", Times, serif; color:#000000; }
		
		#header a{ color:#000000; }
		
		#header a:hover{ color:#fff; }

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


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

	#nav { 
	position:relative;
	float:left;
	width:300px;
	height:100%;
	margin:auto;
	}
	
		.nav-min-holder { float:left; width:1px; height:360px;  }

		#nav li { padding-bottom:10px;  }

		/*  
		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) - (2 * (#nav a padding)) - (#min-holder width) = #nav a width 
			  (    150   ) - (2 *        13       ) - (        1        ) = 123
		*/

		#nav a {  }
		
		#expert a{ display:block; background-image:url(../images/expert-bg.jpg); width:281px; height:45px; text-align:center; text-decoration:none; padding-top:56px; color:#000000;}
		
		#free a{ display:block; background-image:url(../images/bug-bg.jpg); width:260px; height:89px; text-align:right; text-decoration:none; padding-top:76px; padding-right:20px; color:#000000;}
		
		#buy a{ display:block; background-image:url(../images/bug-bg.jpg); width:281px; height:44px; text-align:center; text-decoration:none; padding-top:56px; color:#000000;}
		
		#tips a{ display:block; background-image:url(../images/tips-bg.jpg); width:261px; height:90px; text-align:right; text-decoration:none; padding-top:76px; padding-right:20px; color:#000000;}
		
		#results a{ display:block; background-image:url(../images/blank-box.jpg); width:261px; height:158px; text-align:right; text-decoration:none; padding-top:8px; padding-right:20px; margin-bottom:10px; color:#000000;}		

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

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

#container_content { width:100%; }

	#content { 
		position:relative;  
		width:1000px;
		height:100%;
		margin:auto;
		}

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

			.min-holder { float:left; width:1px; height:300px;  }
	
			.clear {clear:both; height:1px; overflow:hidden;}

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




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

#container_footer { clear:both; width:100%; height:100%; }
	
	#footer { 
	position:relative; 
	width:1000px;
	height:60px;
	margin:auto;
	color:#000; 
	}

		#footer ul { position:relative; float:right; right:20px; }

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

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

		#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); } */


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