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

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




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

	* { margin : 0; padding : 0; }
	ol,ul { list-style : none; }
	table { border-collapse : collapse; border-spacing : 0; }
	fieldset,img { border : 0; }
	caption,th { text-align : left; }
	h3 { font-family:Arial, Helvetica, sans-serif; font-size:14px; color:#476ccb; }
	hr { color:#98bae7; }
	
	body { 
	text-align:left; 
	color:#000; 
	font-family:Arial, Helvetica, sans-serif;
	font-size:12px;
	background-image:url(../images/bg.jpg);
	background-repeat:repeat-x;
	background-color:#aed6f2;
	}

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




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

	.box { position:relative; float:left; width:100px; height:100px; margin:10px; background-color:#000; overflow:hidden; }

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


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

	#container_header { width:100%; height:100%; }
		
		#header { 
		position:relative; 
		width:908px;
		height:93px;
		margin:auto;
		background-image:url(../images/header.png);
		}

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


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

#container_nav { width:100%; height:100%; }
	
	#nav { 
	position:relative;
	width:908px;
	height:30px;
	margin:auto;
	background-image:url(../images/nav-bar.png);
	}
	
		#nav li { position:relative; float:left;  }

		/*  
		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; width:110px; padding:5px; margin-top:3px; text-align:center; text-decoration:none; color:#919191; }
		#nav a:hover { color:#000; }

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

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

#container_nav { width:100%; height:100%; }
	
	#hp-nav { 
	position:relative;
	width:908px;
	height:35px;
	margin:auto;
	background-image:url(../images/homepage-nav-bar.png);
	}
	
		#hp-nav li { position:relative; float:left;  }

		/*  
		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 
		*/

		#hp-nav a { display:block; width:110px; padding:5px; margin-top:3px; text-align:center; text-decoration:none; color:#919191; }
		#hp-nav a:hover { color:#000; }

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

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

#container_nav { width:100%; height:100%; }
	
	#sub-nav { 
	position:relative;
	float:left;
	width:908px;
	height:34px;
	margin:auto;
	background-image:url(../images/top-of-homepage-content.png);
	}
	
		#sub-nav li { position:relative; float:left;  }

		/*  
		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 
		*/

		#sub-nav a { display:block; width:160px; padding:10px; text-align:center; text-decoration:none; color:#919191; }
		#sub-nav a:hover { color:#000; }

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

#container_content { width:100%; }

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

		#homepage-content-header { 
		position:relative; 
		float:left; 
		width:908px; /* (#content width) - (2 * (#middle-content padding) */
		height:34px;
		margin:auto;
		margin-top:20px;
		background-image:url(../images/top-of-homepage-content.png);
		background-repeat:no-repeat;
		}
		
		#homepage-content { 
		position:relative; 
		float:left; 
		width:908px; /* (#content width) - (2 * (#middle-content padding) */
		height:100%;
		margin:auto;
		background-image:url(../images/content-repeater.png);
		background-repeat:repeat-y;
		}

		#services-sub-box {position:relative; float:left; width:200px; height:250px; margin:20px; background-image:url(../images/servoces-menu-box.png);}
		#network-sub-box {position:relative; float:left; width:200px; height:250px; margin:20px; background-image:url(../images/network-menu-box.png);}
		
		#sub-box {position:relative; float:left; width:200px; height:100%; margin:20px;}

		#right-content { 
		position:relative; 
		float:left;
		width:560px; /* (#content width) - (2 * (#middle-content padding) */
		height:100%;
		margin:auto;
		background-color:#363; 
		}
		
		#fadeshow1 {
		position:relative;
		float:left;
		height:302px;
		width:900px;
		}
		
		#sub-page-header-image {
		position:relative;
		float:left;
		height:200px;
		width:900px;
		}
		
		#mini-sub-headers {
		position:relative;
		float:left;
		width:908px;
		height:213px;
		background-image:url(../images/mini-sub-headers.png);
		background-repeat:no-repeat;
		}
		
		#mini-sub-header-info-box-1 { position:relative; float:left; width:180px; height:185px; margin-top:25px; margin-left:25px; margin-right:39px; }
		#mini-sub-header-info-box-2 { position:relative; float:left; width:190px; height:185px; margin-top:25px; margin-right:37px; }
		#mini-sub-header-info-box-3 { position:relative; float:left; width:190px; height:185px; margin-top:25px; margin-right:35px; }
		#mini-sub-header-info-box-4 { position:relative; float:left; width:190px ;height:185px; margin-top:25px; }
		
		
		
		#header-information {
		position:relative;
		float:left;
		margin-left:600px;
		width:300px;
		height:100%;
		}
		
		#bio-wrap {
		position:relative;
		float:left;
		width:600px;
		height:100%
		}
		
		#bio-image {
		position:relative;
		float:left;
		width:200px;
		height:100%;
		}
		
		#wd-portfolio-wrap {
		position:relative;
		float:left;
		width:750px;
		height:100%
		}
		
		#wd-portfolio-image {
		position:relative;
		float:left;
		width:350px;
		height:100%;
		}
		
		#bio-status {
		position:relative;
		margin:20px;
		float:left;
		width:300px;
		height:100%;
		}
		
		#bio-bio {
		position:relative;
		float:left;
		width:600px;
		height:100%;
		}
		
		
		

			.min-holder { float:left; width:1px; height:360px;  }
	
			.clear {clear:both; height:1px; overflow:hidden; background-image:url(../images/content-repeater.png); }

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




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

#container_footer { clear:both; width:100%; height:100%; }
	
	#footer { 
	position:relative; 
	width:908px;
	height:42px;
	margin:auto;
	background-image:url(../images/footer.png);
	color:#919191; 
	}
	
	#certs-sponsers { 
		position:relative; 
		float:left; 
		width:908px; /* (#content width) - (2 * (#middle-content padding) */
		height:100%;
		background-image:url(../images/content-repeater.png);
		background-repeat:repeat-y;
		}

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

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

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

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

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