@charset "utf-8";
/* CSS Document */
body 				{ background:url(i/2C%20bg%20v2.gif) repeat; margin:0; padding:0; font-size:11px; font-family:Arial, Helvetica, sans-serif; }
#header 			{ background:#000; }
	#headerIn 		{ background:url(i/2c-header.jpg) no-repeat center; height:113px; }
	.shaddow		{
	background:url(i/2c-shaddow.png) repeat-x;
	height:18px;
	position:absolute;
	width:100%;
	z-index:100;
}
/* __________ Screen __________ */
#indexContent 							{ width:900px; margin-left:auto; margin-right:auto; margin-top:20px; }

#portfolioContent							{ width:900px; margin-top:20px; margin-left:auto; margin-right:auto; }
#portfolioContent ul						{ margin:0; padding:0; }
#portfolioContent ul li						{ border:15px #0e0e0e solid;  list-style:none; width:870px; margin-bottom:10px; height:140px; }
#portfolioContent ul li .image				{ overflow:hidden; height:140px; }
#portfolioContent ul li .hover				{ overflow:hidden; height:140px; display:none; }
#portfolioContent ul li .hover .info		{ padding:20px 20px 20px 200px; }
#portfolioContent ul li .hover .info h1		{ font-family:Verdana, Geneva, sans-serif; font-size:2em; color:#FFF; margin:10px 0 0 0; padding:0; }
#portfolioContent ul li .hover .info h2		{ color:#4f4f4f; margin:0; padding:0; font-weight:normal;  }
#portfolioContent ul li .hover .info .links		{ width:auto; margin-top:25px; text-align:right;   }
#portfolioContent ul li .hover .info .links a		{  padding:10px 15px 10px 15px; text-decoration:none; color:#8b8b8b; }
#portfolioContent ul li .hover .info .links a:hover		{ background:#000; }


	.title 			{ background:#000; }
	
	.catL 			{ background:url(i/sectionBg.jpg) no-repeat top center; width:285px; float:left; margin-right:22px; }
	.catM 			{ background:url(i/sectionBg.jpg) no-repeat top center; width:285px; height:223px; float:left; margin-right:23px;}
	.catR 			{ background:url(i/sectionBg.jpg) no-repeat top center; width:285px; height:223px; float:left; }
	
	.freeQuote 		{ background:url(i/fq.png) no-repeat right; width:166px; height:33px; text-align:right; margin-top:3px; }	
	.catTitle 		{ padding:2px 2px 2px 2px; width:279px; margin-left:auto; margin-right:auto; background:#000; text-align:center; }
	.catContent 	{ background:#000; text-align:left; font-family:"Country Gothic", Arial, Helvetica, sans-serif; font-size:1.2em; color:#FFF; padding:0px 15px 15px 15px; height:145px; }
	.catContent h1 	{ margin:0; padding:0; font-size:1.4em; font-weight:normal; }
	.line			{ margin-top:5px; margin-bottom:5px; }
	
	.inner			{ left:0; }

/* __________ x-Screen __________ */

/* __________ Navigation __________ */
.S2cNav				{ background:url(i/2c-nav-stripe.jpg) no-repeat center #000; height:72px; }
#navWrap 			{ margin:auto; width:900px;  }
	
	
#nav 							{ width: 821px; height: 71px; margin: 0; padding: 0; background: url(i/i2c-nav-full.jpg) repeat-x; list-style: none; overflow: hidden }
#nav ul 						{ margin: 0; padding:0; }
#nav li 						{ position: absolute; overflow: hidden; font-size: 1em;  }

  #nav li, #nav li * 			{ height: 71px }
  #nav a				 		{ display: block }
  #nav em, #nav span 			{ display: block;  position: absolute; top: 0; left: 0; z-index: 1; background: url(i/i2c-nav-full.jpg) no-repeat; cursor: pointer; }

  #nav span 					{ display: none;  margin-top:0; }

  #n-home, #n-home *			{ width: 121px }
  #n-home 						{ margin-left: 0px; }
  #n-home em 					{ background-position: 0 0 }
  #n-home:hover em, #n-home span, #home #n-home em { background-position: 0px -73px }
  
  #n-services, #n-services * 	{ width: 140px }
  #n-services 					{ margin-left: 121px }
  #n-services em 				{ background-position: -121px 0 }
  #n-services:hover em, #n-services span, #services #n-services em { background-position: -121px -73px }

  #n-ourwork, #n-ourwork * 		{ width: 130px }
  #n-ourwork 					{ margin-left: 261px }
  #n-ourwork em 				{ background-position: -261px 0 }
  #n-ourwork:hover em, #n-ourwork span, #ourwork #n-ourwork em { background-position: -261px -73px }

  #n-hosting, #n-hosting * 		{ width: 132px }
  #n-hosting 					{ margin-left: 392px }
  #n-hosting em 				{ background-position: -392px 0 }
  #n-hosting:hover em, #n-hosting span, #hosting #n-hosting em { background-position: -392px -73px }

  #n-aboutus, #n-aboutus * 		{ width: 135px }
  #n-aboutus 					{ margin-left: 524px }
  #n-aboutus em 				{ background-position: -524px 0 }
  #n-aboutus:hover em, #n-aboutus span, #aboutus #n-aboutus em { background-position: -524px -73px }
  
  #n-contactus, #n-contactus * 	{ width: 160px }
  #n-contactus 					{ margin-left: 660px }
  #n-contactus em 				{ background-position: -660px 0 }
  #n-contactus:hover em, #n-contactus span, #contactus #n-contactus em { background-position: -660px -73px }

  #nav .over 					{ text-indent: -999em }
  #nav .over em 				{ background-image: none }
		
#map				{ background:url(i/mapbar.png) no-repeat left; width:900px; margin-left:auto; margin-right:auto; height:45px; }
#map ul				{ margin:0; padding:0;   }
#map li				{ display:block; list-style:none; float:left; }
#map ul li a		{ display:block; padding:15px 25px 15px 15px; text-decoration:none; color:#8b8b8b; background:url(i/map-standby.png) right no-repeat; }
#map ul li a:hover	{ color:#FFF; background:url(i/map-hover.png) no-repeat right; }
			
/* __________ x-Navigation __________ */

/* __________ Screen __________ */

.screenWrap 					{ position:relative; overflow:hidden; width: 100%; height:450px; }
.screenWrap .items 				{ width:20000em; position:absolute; clear:both; }
.screenWrap div 				{ float:left; width:1280px; height:450px;  }
.screenWrap .items #screen1		{ background:url(i/project4BG.jpg) center repeat-x; }
.screenWrap .items #screen2		{ background:url(i/project2BG.jpg) center repeat-x; }
.screenWrap .items #screen3		{ background:url(i/project3BG.jpg) center repeat-x; }
.screenWrap .items #screen4		{ background:url(i/project1BG.jpg) center repeat-x; }
.screenWrap .items #screen5		{ background:url(i/project2BG.jpg) center repeat-x; }
.screenWrap .active 			{ z-index:9999; position:relative; }

	
/* __________ x-Screen __________ */


/* __________ Index Free Quote __________ */
	#freeQuoteWrap1 {  background:#000; }
	#freeQuoteWrap2 {  background:#000; }
	#freeQuoteWrap3 {  background:#000; }
	
		.title2 { padding:20px 0px 0px 20px; }
		
		.fqForm { margin-top:20px; }
		.fqFormL {float:left; width:273px; margin:0px 20px 0px 20px; }
		.fqFormM {float:left; width:273px; margin:0px 20px 0px 0px;}
		.fqFormR {float:left; width:274px; margin:0px 20px 0px 0px;}
			.fqLine { font-family:"Century Gothic", Arial, Helvetica, sans-serif; color:#606060; font-size:1.1em; text-align:left; height:30px; line-height:30px; }
			.fqInputLine { text-align:left; height:30px; line-height:30px; }
				.fqInput { height:25px; width:200px; background:#141414; border:1px solid #252525; color:#FFF; }
				.fqInput:hover { background:#343434;   }
				.fqTextArea { width:250px; background:#141414; border:1px solid #252525; color:#FFF; height:167px; }
		.dotLine { margin:20px; border-bottom:dashed 1px #606060; }
		
		.fqCFormL {float:left; width:273px; margin:0px 20px 0px 20px;}
		.fqCFormM {float:left; width:273px; margin:0px 20px 0px 0px;}
		.fqCFormR {float:left; width:273px; margin:0px 20px 0px 0px;}
		
		.fqSendQuote { height:43px; margin-top:77px; text-align:right; }
		
		.sendingQuote { padding-top:30px; padding-bottom:30px; font-family:"Century Gothic", Arial, Helvetica, sans-serif; color:#252525; font-size:3em; text-align:center; font-weight:normal;}
/* __________ x-Index Free Quote __________ */

/* __________   Index Contact Us __________ */

#contactUs	{ text-align:center; font-family:Verdana, Geneva, sans-serif; font-size:2em; color:#FFF; padding-top:50px; padding-bottom:50px; background:#000; display:none; }
#topShade	{ display:none; }

/* __________ x-Index Contact Us __________ */


/* __________ Portfolio __________ */

#portfolioLeft { float:left; background:url(i/sideMenu.png) no-repeat #000; width:238px; height:auto; margin-right:24px;}
#portfolioRight { float:left; background:url(i/portfolioBg.png) no-repeat #000; width:638px; }

		.sideMenu { font-family:"Country Gothic", Arial, sans-serif; font-size:1.3em; width:238px; color:#FFF; margin:0px 0px 0px 0px; }
		.sideMenu ul {margin: 0; padding: 0;}
		.sideMenu li { list-style: none;  }
		.sideMenu li a { height:24px; line-height:24px;  color: #FFF; display: block; padding:0px 0px 0px 15px; margin-bottom:5px; text-decoration: none; font-size: 0.9em; }
		.sideMenu li a:hover { background:url(i/ftrHover.png); color:#111; }
		
		.smTitle { text-align:center; margin:30px; }
		
		.listWork { width:608px; margin-top:70px; margin-left:auto; margin-right:auto; }
		.listWorkItem a { color: #FFF; display: block; margin-top:30px; text-decoration: none; font-size: 0.9em;  border:5px #333 solid; }
		.listWorkItem a:hover {  border:5px #CCC solid; }
		
		#listWorkDetail-1 { background:url(i/dbpDetailsBg.jpg) no-repeat center top; }
		#listWorkDetail-2 { background:url(i/mpDetailsBg.jpg) no-repeat center top; }
		#listWorkDetail-3 { background:url(i/svipDetailsBg.jpg) no-repeat center top; }
		#listWorkDetail-4 { background:url(i/fookDetailsBg.jpg) no-repeat center top; }
		
		.listWorkDetail { color:#333333; padding:30px 0px 0px 170px; }
			.launchWebsite { text-align:right; margin-top:10px; }
		
/* __________ x-Portfolio __________ */


/* __________ Privicy + Section backgrounds + Services __________ */

.privicyPolicy 	{ 	width:568px; margin-top:70px; 	margin-left:auto; margin-right:auto; color:#FFF; font-size:1.1em; line-height:25px; 					padding:0px 20px 0px 20px; }
.aboutUs 		{ 	width:568px; margin-top:250px; 	margin-left:auto; margin-right:auto; color:#FFF; font-size:1.1em; line-height:25px; 					padding:0px 20px 0px 20px; }

	#privicyRight 					{ float:left; background:url(i/privicyBg.png) 				no-repeat #000; width:638px; }
	#strategicPlaningRight 			{ float:left; background:url(i/strategicPlaning.png) 		no-repeat #000; width:638px; }
	#webConsultancyRight 			{ float:left; background:url(i/webConsultancy.png) 			no-repeat #000; width:638px; }
	#webDesignAndDevelopmentRight 	{ float:left; background:url(i/webDesignAndDevelopment.png) no-repeat #000; width:638px; }
	#cmsRight 						{ float:left; background:url(i/cms.png) 					no-repeat #000; width:638px; }
	#seoRight 						{ float:left; background:url(i/seo.png) 					no-repeat #000; width:638px; }
	#emailMarketingRight 			{ float:left; background:url(i/emailMarketing.png) 			no-repeat #000; width:638px; }
	#webAnalyticsRight 				{ float:left; background:url(i/webAnalytics.png) 			no-repeat #000; width:638px; }
	/*About Us Page*/
	#aboutUsRight 					{ float:left; background:url(i/about2C.jpg) 				no-repeat #000; width:638px; }
	#ourServicesRight				{ float:left; background:url(i/services2C.jpg)			no-repeat #000; width:638px; }

		.serviceDisplay 			{ font-family:"Country Gothic", Arial, sans-serif; font-size:1.3em; width:auto; color:#FFF; margin:0px 0px 0px 0px; }
		.serviceDisplay ul 			{ margin: 0; padding: 0;}
		.serviceDisplay li 			{ list-style: none;  }
		.serviceDisplay li a 		{ height:24px; line-height:24px;  color: #FFF; display: block; padding:0px 0px 0px 15px; margin-bottom:5px; text-decoration: none; font-size: 0.9em; }
		.serviceDisplay li a:hover 	{ background:url(i/ftrHover.png); color:#111; }
		
/* __________ x-Privicy + Section backgrounds __________ */




/* __________ Footer __________ */
#footer { height:304px; background:#000 url(i/footer.jpg) center no-repeat; width:100%; }

	#footerContent { width:900px; margin-left:auto; margin-right:auto; }
		.ftL { float:left; width:285px; margin-right:22px; }
		.ftM { float:left; width:285px; margin-right:22px; }
		.ftR { float:left; width:265px; font-family:"Country Gothic", Arial, sans-serif; font-size:1.0em; color:#FFF; margin:0px 0px 0px 20px; }
		
		.ftrColumn { font-family:"Country Gothic", Arial, sans-serif; font-size:1.3em; width:265px; height:24px; line-height:24px; color:#FFF; margin:0px 0px 0px 0px; }
		.ftrColumn ul {margin: 0; padding: 0;}
		.ftrColumn li { list-style: none; }
		.ftrColumn li a { color: #FFF; display: block; padding:0px 0px 0px 15px; margin-bottom:5px; text-decoration: none; font-size: 0.9em; }
		.ftrColumn li a:hover { background:url(i/ftrHover.png); color:#111; }
/* __________ x-Footer __________ */

#PicNetEyeTracker		{ display:none; }
.h { display:none; }
.clr {clear:both;}
.line10 { height:10px; } .line20 { height:20px; } .line30 { height:30px; } .line40 { height:40px; } .line50 {height:50px; }
.line15 { height:15px; } .line25 { height:25px; } .line35 { height:35px; } .line45 { height:45px; } .line55 {height:55px; }