@charset "utf-8";
/* CSS Document */

/*-------------------------------------------------------------------------------------------
/ Company
-------------------------------------------------------------------------------------------*/
#Company #marketingMix{
	position: absolute;
	top: 30px;
	right: -205px;
}
#Company #bg{
	background:url(/images/company/small-city-bg.png) no-repeat;
	background-position: 0px 50px;
}
#Company #subNav{
	margin-left: 50px;	
}

/*-------------------------------------------------------------------------------------------
/ Website Development
-------------------------------------------------------------------------------------------*/
#websiteDevelopment{
	background-image:url(/images/template/bg/green.png);
}
	#websiteDevelopment .cornerImage{
		position: absolute;
		top: -55px;
		left: -55px;
	}
	#websiteDevelopment #introParagraph{
		margin-top: 20px;
	}
	#websiteDevelopment #contentMiddle{
		padding-left: 130px;
		width: 700px;
	}
			#websiteDevelopment .section#siteDesign .icon{
				left: -100px;
				top: -20px;
			}
			#websiteDevelopment .section#webpageDesign .icon{
				left: -80px;
				top: -30px;
			}
			#websiteDevelopment .section#copywriting .icon{
				left: -90px;
				top: -30px;
			}
			#websiteDevelopment .section#production .icon{
				left: -90px;
				top: -20px;
			}
			#websiteDevelopment .section#webHosting .icon{
				left: -90px;
				top: -20px;
			}
			#websiteDevelopment .section#webmail .icon{
				left: -90px;
				top: -20px;
			}
	
/*-------------------------------------------------------------------------------------------
/ Website Development
-------------------------------------------------------------------------------------------*/
#websiteMaintenance{
	background-image:url(/images/template/bg/purple.png);
}
	#websiteMaintenance .cornerImage{
		position: absolute;
		top: -55px;
		left: -55px;
	}
	#websiteMaintenance #contentMiddle{
		padding-left: 130px;
		width: 700px;
	}
			#websiteMaintenance .section#links .icon{
				left: -100px;
				top: -20px;
			}
			#websiteMaintenance .section#newsletter .icon{
				left: -90px;
				top: -30px;
			}
			#websiteMaintenance .section#naturalSearchOptimization .icon{
				left: -90px;
				top: -30px;
			}
			#websiteMaintenance .section#keywordSearchMarketing .icon{
				left: -90px;
				top: -20px;
			}
			
/*-------------------------------------------------------------------------------------------
/ Custom Applications
-------------------------------------------------------------------------------------------*/
#customApplications{
	background-image:url(/images/template/bg/blue.png);
}
	#customApplications .cornerImage{
		position: absolute;
		top: -55px;
		left: -55px;
	}
	#customApplications #contentMiddle{
		padding-left: 130px;
		width: 700px;
	}
			
/*-------------------------------------------------------------------------------------------
/ Portfolio
-------------------------------------------------------------------------------------------*/
#portfolio{
	background-image:url(/images/template/bg/green.png);
}
	#portfolio .cornerImage{
		position: absolute;
		top: -55px;
		left: -55px;
	}
	#portfolio #contentMiddle{
		padding-left: 130px;
		width: 800px;
	}
		#portfolio .section#featuredProjects .icon{
			left: -100px;
			top: -20px;
		}
		#portfolio .section#recentProjects .icon{
			left: -100px;
			top: -20px;
		}
#portfolio table {
	margin-top: 20px;
}
	#portfolio table a img{
		background-color: #b2c085;
		padding: 8px;
		-webkit-border-radius: 10px;
		-moz-border-radius: 10px;
		-webkit-box-shadow: 2px 2px 3px #666;
		-moz-box-shadow: 2px 2px 3px #666;
	}
		#portfolio table a:hover img{
			background-color: #98a66b;
		}
#portfolio table tr td{
	text-align:center;
	color: #b0bc22;
	font-weight:bold;
	font-size: 14px;
}
#portfolio h2 span{
	font-size: 12px;	
}

/*-------------------------------------------------------------------------------------------
/ Portfolio Detail
-------------------------------------------------------------------------------------------*/
#portfolioDetail{
	background-image:url(/images/template/bg/green.png);
}
	#portfolioDetail .section .icon{
		left: -85px;
		top: -20px;
	}
	#portfolioDetail .cornerImage{
		position: absolute;
		top: -75px;
		left: -75px;
	}
	#portfolioDetail #contentMiddle{
		padding-left: 130px;
		width: 700px;
	}
	#portfolioDetail #portfolioImageColumn{
		float: left;
		margin: 0px 10px 20px 0px;
		width: 420px;
	}
		#portfolioDetail #portfolioImageColumn ul{
			list-style-type: none;
			padding: 5px 0px 0px 0px;
			margin: 0px;
		}
			#portfolioDetail #portfolioImageColumn ul li{
				background-image: none;
				padding-left: 0px;
				float: left;
				margin: 5px 10px 5px 0px;
				
			}

/*-------------------------------------------------------------------------------------------
/ Portfolio Archive
-------------------------------------------------------------------------------------------*/
#portfolioArchive{
	background-image:url(/images/template/bg/green.png);
}
#portfolioArchive table a img{
	background-color: #b2c085;
	padding: 8px;
	-webkit-border-radius: 10px;
	-moz-border-radius: 10px;
	-webkit-box-shadow: 2px 2px 3px #666;
	-moz-box-shadow: 2px 2px 3px #666;
}
	#portfolioArchive table a:hover img{
		background-color: #98a66b;
	}
#portfolioArchive table tr td{
	text-align:center;
	color: #b0bc22;
	font-weight:bold;
	font-size: 14px;
}

/*-------------------------------------------------------------------------------------------
/ Contact
-------------------------------------------------------------------------------------------*/
#contact .cornerImage{
	position: absolute;
	top: -85px;
	left: -55px;
}
#contact #contentMiddle{
	padding-left: 130px;
	width: 700px;
}
	#contact .section#contactInfo .icon{
		left: -110px;
		top: -20px;
	}
#contact #mapWrapper{
	position: absolute; 
	top: 85px; 
	right: 10px; 
	z-index:10;
}
	#contact iframe{
		-webkit-box-shadow: 2px 2px 6px #666;
		-moz-box-shadow: 2px 2px 6px #666;
		margin: 20px 20px 5px 0px;
	}
	#qrCodeImage{
		margin-top: 30px;
		margin-bottom: 0px;
		text-align:center;
	}
	#qrCodeDecription{
		margin-top: 5px;
		text-align:center;
		font-size: .8em;
	}
#contact #contactInfo{
	
}
	#contact #contactInfo tr{
		
	}
		#contact #contactInfo tr td{
			padding: 5px;
		}
#contact form{
	margin-top: 10px;
}
	#contact form input{
		margin-bottom: 10px;
		width: 350px;
	}
	#contact form label{
		font-weight: bold;
	}
	#contact form p.label{
		font-weight: bold;
	}
	#contact form fieldset{
		display: inline-block;
		padding: 10px 20px 10px 0px;
		width: 330px;
	}
		#contact form fieldset legend{
			font-weight: bold;
			margin: 0px 0px 0px 10px;
		}
		#contact form fieldset checkbox{
			height: 20px;
			width: 20px;
		}
		#contact form fieldset img{
			height: 20px;
			width: 20px;
		}
	#contact form textarea{
		height: 100px;
		width: 350px;
		margin-bottom: 10px;
	}
		
/*-------------------------------------------------------------------------------------------
/ Hosting
-------------------------------------------------------------------------------------------*/
#hosting{
	
}
	#hosting .section .icon{
		left: -85px;
		top: -20px;
	}
	#hosting .cornerImage{
		position: absolute;
		top: -75px;
		left: -75px;
	}
	#hosting #contentMiddle{
		padding-left: 130px;
		width: 700px;
	}
	
/*-------------------------------------------------------------------------------------------
/ FTP
-------------------------------------------------------------------------------------------*/
#FTP #loginForm{
	width: 300px;
	margin: auto;
}
	#FTP #loginForm label, #FTP #loginForm input{
		font-size: 18px;
	}
#FTP #contentMiddle{
	padding: 100px 130px 70px 30px;	
}