/* --------------------------------------------/ 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; }
	
	body { 
	text-align:left; 
	color:#333333; 
	font-family:Verdana, Arial, Helvetica, sans-serif;
	font-size:12px;
	background:
	url(../images/bg.jpg) center top no-repeat, 
	url(../images/bg-reapter.jpg) center;
	}
	
	h1.spheader {font: 25px/29px 'Puritan20Bold', Arial, sans-serif; letter-spacing: 0; margin:85px 0 0 170px;}
	h1 {font: 25px/29px 'Puritan20Bold', Arial, sans-serif; }
	h2.number1 {font: 16px/25px 'Puritan20Bold', Arial, sans-serif;}
	h2.number2 {font: 16px/25px 'Puritan20Bold', Arial, sans-serif; border-bottom: 1px dashed #DDDDDD;  padding-bottom: 10px; }
	p.style1 {font: 18px/27px 'Puritan20Normal', Arial, sans-serif;}
	p.style2 {font: 18px/27px 'Puritan20Italic', Arial, sans-serif;}
	p.style3 {font: 18px/27px 'Puritan20Bold', Arial, sans-serif;}
	p.style4 {font: 18px/27px 'Puritan20BoldItalic', Arial, sans-serif;}
	p.style5 {font: 11px/14px 'Puritan20Normal', Arial, sans-serif;}
	p.style6 {font: 14px/19px 'Puritan20Normal', Arial, sans-serif; margin-top:10px; }
	span.bc { color:#09F; }

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




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

	.rapid-emanage-box { position:relative; float:left; width:208px; height:254px; margin:21px; background:url(../images/rapid-emanage-box-bg.png); overflow:hidden; }
	.networking-box { position:relative; float:left; width:208px; height:254px; margin:21px; background:url(../images/networking-box-bg.png); overflow:hidden; }
	.computer-service-box { position:relative; float:left; width:208px; height:254px; margin:21px; background:url(../images/computer-service-box-bg.png); overflow:hidden; }
	.webdesign-box { position:relative; float:left; width:208px; height:254px; margin:21px; background:url(../images/web-design-box-bg.png); overflow:hidden; }
	.hp-text-padding { padding:12px 90px 40px 90px; }
	.header-bc { position:relative; float:left; width:530px; height:50px; padding:20px 0 0 50px; }
	.side-menu-box { position:relative; float:left; width:234px; height:100%; }
	.image { position:relative; float:left; width:100px; height:100%; }
	.text. { position:relative; float:left; width:164px; height:100%; }

/* ---------------------=-------------------------/ SP HEADERS \---------------------------------------------- */

	#center-content a { text-decoration:none; color:#333; }
	#center-content a:hover { color:#09F; }
	#center-content hr { margin-top:15px; color:#f7f7f7; }
	
	#computer-repair { position:relative; float:left; width:1000px; height:180px; margin-top:20px; background:url(../images/sp-headers/computer-services-header.jpg); }
	#about-us { position:relative; float:left; width:1000px; height:180px; margin-top:20px; background:url(../images/sp-headers/services.jpg); }
	#web-design { position:relative; float:left; width:1000px; height:180px; margin-top:20px; background:url(../images/sp-headers/web-design.jpg); }
	#emanage { position:relative; float:left; width:1000px; height:180px; margin-top:20px; background:url(../images/sp-headers/contractor-software.jpg); }
	#contact { position:relative; float:left; width:1000px; height:180px; margin-top:20px; background:url(../images/sp-headers/contact-us.jpg); }
	

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


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

	#container_header { width:100%; height:100%; margin-top:10px; }
		
		#header { 
		position:relative; 
		width:1000px;
		height:100px;
		margin:auto;
		}
		
		.logo-box { position:relative; float:left; }
		.help-box { position:relative; float:left; width:340px; }
		.address-box { position:relative; float:right; text-align:right; }

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


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

#container_nav { width:100%; height:100%; }
	
	#nav { 
	position:relative;
	width:1000px;
	height:40px;
	margin:auto;
	background: -moz-linear-gradient(top, #a0b9fa 0%, #708edb 100%); /* FF3.6+ */
	background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#a0b9fa), color-stop(100%,#708edb)); /* Chrome,Safari4+ */
	background: -webkit-linear-gradient(top, #a0b9fa 0%,#708edb 100%); /* Chrome10+,Safari5.1+ */
	background: -o-linear-gradient(top, #a0b9fa 0%,#708edb 100%); /* Opera11.10+ */
	background: -ms-linear-gradient(top, #a0b9fa 0%,#708edb 100%); /* IE10+ */
	filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#a0b9fa', endColorstr='#708edb',GradientType=0 ); /* IE6-9 */
	background: linear-gradient(top, #a0b9fa 0%,#708edb 100%); /* W3C */
	}
	
		#nav li { position:relative; float:left;  }

		#nav a { display:block; width:125px; padding:10px; text-align:center; text-decoration:none; color:#fff; }
		
		#nav a:hover {
			background: #708edb; /* Old browsers */
			background: -moz-linear-gradient(top, #708edb 0%, #a0b9fa 100%); /* FF3.6+ */
			background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#708edb), color-stop(100%,#a0b9fa)); /* Chrome,Safari4+ */
			background: -webkit-linear-gradient(top, #708edb 0%,#a0b9fa 100%); /* Chrome10+,Safari5.1+ */
			background: -o-linear-gradient(top, #708edb 0%,#a0b9fa 100%); /* Opera11.10+ */
			background: -ms-linear-gradient(top, #708edb 0%,#a0b9fa 100%); /* IE10+ */
			filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#708edb', endColorstr='#a0b9fa',GradientType=0 ); /* IE6-9 */
			background: linear-gradient(top, #708edb 0%,#a0b9fa 100%); /* W3C */
		}
		
		#nav li {font: 16px 'Puritan20Normal', Arial, sans-serif;}

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

#container_content { width:100%; }

	#content { 
		position:relative;  
		width:1000px;
		height:100%;
		margin:auto; 
		}
		
		
		#slide-show-content { 
		position:relative; 
		float:left; 
		width:1000px; 
		height:360px;
		margin:auto;
		background:url(../images/slide-show-bg.png);
		}
		
		#center-content { 
		position:relative; 
		float:left; 
		width:1000px; 
		height:100%;
		margin:auto;
		}
		
		#left-hp-content { 
		position:relative; 
		float:left; 
		width:478px; 
		height:282px;
		margin:auto;
		padding:10px;
		background:url(../images/hp-left-bg.png) no-repeat;
		}
		
		#right-hp-content { 
		position:relative; 
		float:left; 
		width:478px; 
		height:282px;
		margin:auto;
		padding:10px;
		background:url(../images/right-hp-bg.png) no-repeat;
		}

		#left-content { 
		position:relative; 
		float:left; 
		width:260px; 
		height:100%;
		margin:auto;
		padding:20px;
		background-color:#069; 
		}

		#right-content { 
		position:relative; 
		float:left;
		width:660px; 
		height:100%;
		margin:auto;
		padding:20px;
		background-color:#363; 
		}
		
		#left-sub {
		position:relative;
		float:left;
		height:100%;
		width:710px;
		padding-top:20px;
		margin:auto;
		}
		
		#right-sub {
		position:relative;
		float:left;
		height:100%;
		width:265px;
		margin:auto;
		padding:53px 0px 20px 20px;
		}
		
		#sidemenu {
		border: 1px solid #c4d8fb;
		clear: both;
		float: left; 
		width: 235px;
		height: 100%;
		padding:15px;
		background-color:#FFF;
		-moz-border-radius-topright: 5px;
		-khtml-border-radius-topright: 5px;
		-webkit-border-topright-radius: 5px;
		-moz-border-radius-topleft: 5px;
		-khtml-border-radius-topleft: 5px;
		-webkit-border-top-left-radius: 5px;
		-moz-border-radius-bottomright: 5px;
		-khtml-border-radius-bottomright: 5px;
		-webkit-border-bottom-right-radius: 5px;
		-moz-border-radius-bottomleft: 5px;
		-khtml-border-radius-bottomleft: 5px;
		-webkit-border-bottom-left-radius: 5px;
		}
		
		#left-contact {
		position:relative;
		float:left;
		height:100%;
		width:460px;
		padding:20px;
		margin:auto;
		}
		
		#right-contact {
		position:relative;
		float:left;
		height:100%;
		width:460px;
		padding:20px;
		margin:auto;
		}
		
		#bio-wrap {
			float: left;
			height: 100%;
			position: relative;
			width: 600px;
			border-bottom: 1px dashed #DDDDDD;
			margin-bottom:20px;
		}
		
		#bio-status {
			float: left;
			height: 100%;
			margin: 20px;
			position: relative;
			width: 300px;
		}
				
		#bio-image {
			float: left;
			height: 100%;
			position: relative;
			width: 200px;
		}
		
		#bio-bio {
			float: left;
			height: 100%;
			position: relative;
			width: 600px;
		}
		
		#wd-portfolio-wrap {
			float: left;
			height: 100%;
			position: relative;
			width: 650px;
		}
		
		#wd-portfolio-image {
			float: left;
			height: 100%;
			position: relative;
			width: 275px;
		}

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

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

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

		h1 {font-size: 3em; margin: 20px 0;}
		.container {width: 700px; margin:auto;}
		
		ul.tabs {
			margin: 0;
			padding: 0;
			float: left;
			list-style: none;
			height: 32px;
			border-bottom: 1px solid #c4d8fb;
			border-left: 1px solid #c4d8fb;
			width: 100%;
		}
		ul.tabs li {
			float: left;
			margin: 0;
			padding: 0;
			height: 31px;
			line-height: 31px;
			border: 1px solid #c4d8fb;
			border-left: none;
			margin-bottom: -1px;
			overflow: hidden;
			position: relative;
		}
		ul.tabs li a {
			text-decoration: none;
			color: #000;
			display: block;
			font-size: 1.2em;
			padding: 0 20px;
			border: 1px solid #fff;
			outline: none;
		}
		ul.tabs li a:hover {
			background:#c4d8fb;
		}	
		html ul.tabs li.active, html ul.tabs li.active a:hover  {
			background: #fff;
			border-bottom: 1px solid #fff;
		}
		.tab_container {
			border: 1px solid #c4d8fb;
			border-top: none;
			clear: both;
			float: left; 
			width: 100%;
			background: #fff;
			-moz-border-radius-bottomright: 5px;
			-khtml-border-radius-bottomright: 5px;
			-webkit-border-bottom-right-radius: 5px;
			-moz-border-radius-bottomleft: 5px;
			-khtml-border-radius-bottomleft: 5px;
			-webkit-border-bottom-left-radius: 5px;
		}
		.tab_content {
			padding: 20px;
			font-size: 1.2em;
		}
		.tab_content h2 {
			font: 26px/35px 'Puritan20Normal', Arial, sans-serif;
			font-weight: normal;
			padding-bottom: 10px;
			border-bottom: 1px dashed #ddd;
			color:#0099FF;
		}
		.tab_content h3 {
			font: 18px/27px 'Puritan20Normal', Arial, sans-serif;
			font-weight: normal;
			padding-bottom: 10px;
			border-bottom: 1px dashed #ddd;
			color:#0099FF;
		}
		.tab_content h3 a{
			color: #254588;
		}

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



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

#top_container_footer { clear:both; width:100%; height:100%; margin-top:20px; }
	
	#top-footer { 
	position:relative;
	width:1000px;
	height:100%;
	margin:auto;
	color:#333; 
	}

#container_footer { clear:both; width:100%; height:100%; background:url(../images/footer-bg-repeater.png) repeat-x bottom; }

	#footer { 
	position:relative; 
	width:1000px;
	height:135px;
	margin:auto;
	color:#fff; 
	}

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

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

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

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

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