@charset "utf-8";
/* CSS Document */
/* v1.0 | 20080212 */

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, font, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-size: 100%;
	vertical-align: baseline;
	background: transparent;
}
body {
	line-height: 1.3em;
	background: url(../images/bg.jpg) repeat;
	}
	
p {margin-bottom: 10px;}
	
ol, ul {
	list-style: none;
}
blockquote, q {
	quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
	content: '';
	content: none;
}

/* remember to define focus styles! */
:focus {
	outline: 0;
}

/* remember to highlight inserts somehow! */
ins {
	text-decoration: none;
}
del {
	text-decoration: line-through;
}

/* tables still need 'cellspacing="0"' in the markup */
table {
	border-collapse: collapse;
	border-spacing: 0;
}

/*====================================================COLOURS*/
.green{color:#8a913f;}
.pink{color:#e21082;}
.dark{color: #2a2a2a;}
.lightGrey{color:#e5dfdf;}

/*====================================================TYPOGRAPHY*/
h1 {font-family: 'Molengo', arial, serif; font-size: 48px; text-align: center; color: #2a2a2a; text-align: center; line-height: 1.2em; font-weight: normal; padding-top: 50px; text-shadow: 0 1px 0 #fff;}
h2 {font-family: 'Molengo', arial, serif; font-size: 18px; color: #2a2a2a; padding-bottom: 10px; font-weight: normal; text-shadow: 0 1px 0 #fff;}
h3 {font-family: 'Molengo', arial, serif; font-size: 18px; color: #2a2a2a; padding-bottom: 10px; font-weight: normal; text-shadow: 0 1px 0 #fff;}
p {font-family: 'Lekton', arial, serif; font-size: 14px; color:#2a2a2a; }
.navigation {font-family: 'Molengo', arial, serif; font-size: 14px; color: #e5dfdf;}
h1 a {text-decoration: none; color:#8a913f;} h1 a:hover {text-decoration: none; color:#e21082;}

/*====================================================LAYOUT*/
#topGreen{width:100%; height: 2px; background:#8a913f;}
#topDark{width:100%; height: 98px; background:#2a2a2a;}
.logo {float: left; margin-top: 30px;}
.container{width:960px; margin: auto; padding: 0;}
.clear{clear: both;}
.clear30 {clear: both; height: 30px;}
.source {font-family: 'Molengo', arial, serif; font-size: 16px;}

/*====================================================NAVIGATION*/
ul.navigation {
	display: block;
	text-align: right;
	padding-top: 40px;
	}
	ul.navigation li {
		display: inline;
		padding-left: 30px;
		}
		ul.navigation li a {
			text-decoration: none;
			color: #e5dfdf;
			padding: 4px 6px;
			-webkit-transition-property:color, background; 
			-webkit-transition-duration: 0.3s, 0.3s; 
			-webkit-transition-timing-function: linear, ease-in;
			-webkit-border-radius: 05px;
			-moz-border-radius: 05px;
			border-radius: 05px;
			}
			ul.navigation li a:hover {
				-webkit-border-radius: 05px;
				-moz-border-radius: 05px;
				border-radius: 05px;
				background: #e21082;
				color: #fff;
				}
			ul.navigation li a.active {text-decoration: none; color: #fff; padding: 4px 6px; background: #e21082; -webkit-border-radius: 05px; -moz-border-radius: 05px; border-radius: 05px;}

/*====================================================INTRO TEXT*/
#introText { width:100%; height: 350px; background: url(../images/intro-bg.jpg) repeat;}
	
/*====================================================BODY TEXT*/
.left {float: left; width: 470px; margin-top:30px;}
.right, #map {float: right; width: 470px; margin-top: 30px;}
#map {float: right; width: 470px; margin:30px 0 80px 0; }
ul.bodyText {font-family: 'Lekton', arial, serif; font-size: 14px; color:#e21082; list-style: decimal; margin-left: 25px;}
.source a { text-decoration: none; color:#e21082; font-family: 'Lekton', arial, serif; font-size: 14px; }
.source a:hover {color:#8a913f; }

/*====================================================FREE SEO EVALUTAION FROM*/
#seoEvaluation {
	margin-top: 30px;
	width: 100%;
	color: #908875;
	}
	
.left #seoEvaluation p {margin: 0; padding: 0;}
	
input, select  {
	display: block;
    width: 70%;
    margin-bottom: 1em;
    padding: 12px 5px;
    background: #fff;
    border: 0;
    float: right;
    border:1px solid #8a913f;
    }

textarea {	
	display: block;
	float: right;
    width: 70%;
    margin-bottom: 1em;
    padding: 12px 5px;
    border:1px solid #8a913f;
	}
	
.submit {
	font-family: 'Lekton', arial, serif; font-size: 14px; color:#2a2a2a; 
	padding: 4px 6px;
	-webkit-transition-property:color, background; 
	-webkit-transition-duration: 0.3s, 0.3s; 
	-webkit-transition-timing-function: linear, ease-in;
	-webkit-border-radius: 05px;
	-moz-border-radius: 05px;
	border-radius: 05px;
    width:80px;
	float: right;
	background: #e21082;
	color: #fff;
    border: 0;
    clear: both;
	}
	
.submit:hover {
	cursor: default;
	background: #8a913f;
	color: #fff;
	}
	
label.error {
	background: none;
	color: #908875;
	padding: 0;
	margin-top:-10px;
	margin-bottom:-10px;
	font-size: 70%;
	font-style: italic;
	}
	
/*====================================================CONTACT US FROM*/
#contactUs {
	width: 100%;
	color: #908875;
	}
	
.left #seoEvaluation p {margin: 0; padding: 0;}

label {	
	font-family: 'Lekton', arial, serif; font-size: 14px; color:#2a2a2a;
	display: block;
	padding-top:20px;
	padding-bottom: 5px;
	}
	
input, select  {
	display: block;
    width: 96.5%;
    margin-bottom: 1em;
    padding: 12px 5px;
    background: #fff;
    border: 0;
    float: right;
    border:1px solid #8a913f;
    }

textarea {	
	display: block;
	float: right;
    width: 96.5%;
    margin-bottom: 1em;
    padding: 12px 5px;
    border:1px solid #8a913f;
	}
	
input.submit {
	font-family: 'Lekton', arial, serif; font-size: 14px; color:#2a2a2a; 
	padding: 4px 6px;
	-webkit-transition-property:color, background; 
	-webkit-transition-duration: 0.3s, 0.3s; 
	-webkit-transition-timing-function: linear, ease-in;
	-webkit-border-radius: 05px;
	-moz-border-radius: 05px;
	border-radius: 05px;
    width:60px;
	float: right;
	background: #e21082;
	color: #fff;
    border: 0;
	}
	
input.submit:hover {
	cursor: default;
	background: #8a913f;
	color: #fff;
	}
	
label.error {
	background: none;
	color: #908875;
	padding: 0;
	margin-top:-10px;
	margin-bottom:-10px;
	font-size: 70%;
	font-style: italic;
	}
	
.errorMessage { 
	color:#e21082;
	font-family: 'Sue Ellen Francisco', arial, serif;
	font-size: 120%;
	}
	
.noerrorMessage { 
	color:#e21082;
	font-family: 'Sue Ellen Francisco', arial, serif;
	font-size: 120%;
	}


/*====================================================SERVICES*/
.backToServices { background:url(../images/back.png); height:68px; width: 128px; float: right; }
.backToServices a {display: block; height: 68px; width:128px; text-indent: -9999999px;}
.backToServices:hover { background:url(../images/back-hover.png); height:68px; width: 128px; }

#services {
	width:100%;
	height: 320px;
	background: url(../images/intro-bg.jpg) repeat;
	}

.sections {
	width: 220px;
	height: 260px;
	float: left;
	padding: 30px 25px 0 0;
	}
	
.rightSection {
	width: 220px;
	height: 260px;
	float: right;
	padding: 30px 0 0 0;
	}
	
.sections p, .rightSection p { height: 200px;}

a.readMore {
	text-decoration: none;
	font-family: 'Lekton', arial, serif; font-size: 14px; color:#2a2a2a; 
	padding: 4px 6px;
	-webkit-transition-property:color, background; 
	-webkit-transition-duration: 0.3s, 0.3s; 
	-webkit-transition-timing-function: linear, ease-in;
	-webkit-border-radius: 05px;
	-moz-border-radius: 05px;
	border-radius: 05px;
	float: left;
	color: #e21082;
	}
a.readMore:hover { 
	text-decoration: none;
	cursor: default;
	background: #8a913f;
	color: #fff;
	}
	
#help {
	position: relative;
	display: block;
	width: 440px;
	height: 260px;
	float: left;
	padding: 30px 25px 0 0;
	background: url(../images/help.png) no-repeat;
	}
	
#help:hover {
	position: relative;
	display: block;
	width: 440px;
	height: 260px;
	float: left;
	padding: 30px 25px 0 0;
	background: url(../images/help-hover.png) no-repeat;
	}

/*====================================================TESTIMONIALS*/
.testImage {width: 85px; height: 100px; float: left; margin: 0 10px 10px 0;}

/*====================================================PORTFOLIO PAGE*/
.portfolioImage a {width: 960px; height: 60px; margin-top: 10px; opacity: 0.4;}
.portfolioImage a:hover {opacity:1;}
.stats { margin-left: 50px;}

/*====================================================FOOTER*/
#footer { width: 100%; height: 250px; background:#2a2a2a; color: #e5dfdf; padding: 30px 0;}
#footer h2 {color: #fff;}
#footer ul  {font-family: 'Molengo', arial, serif; font-size: 14px;  color: #e5dfdf;  line-height: 1.3em; font-weight: normal;  text-decoration: none}
.footerSections {
	color: #fff;
	width: 220px;
	float: left;
	margin-right: 25px;
	}
.footerRightSection{
	color: #fff;
	width: 220px;
	float: right;
	}
.footerSections ul li a, .footerRightSection ul li a { font-family: 'Molengo', arial, serif; font-size: 14px; text-align: center; color: #e5dfdf; text-align: center; line-height: 1.2em; font-weight: normal;  text-decoration: none; -webkit-transition-property:color, background; -webkit-transition-duration: 0.3s, 0.3s; -webkit-transition-timing-function: linear, ease-in;}
.footerSections ul li a:hover, .footerRightSection ul li a:hover {color: #8a913f;} 
.footerSections p, .footerRightSection p {color: #e5dfdf;}
#footer img {margin-top: 30px; opacity: 0.4;}
#footer img:hover {margin-top: 30px; opacity: 1;}
#small {width: 960px; margin: auto; background: #2a2a2a;}
#small a {font-size: 70%; color: #e5dfdf; text-decoration: none;}

/*====================================================CSS for the POP OUT FORM*/
.slide-out-div { padding: 20px; background: #fff; width: 370px;}
.slide-out-div.handle { background: url(../images/free-evaluation.png); height: 81px; width: 108px;}
.slide-out-div.handle:hover { background: url(../images/free-evaluation-hover.png);height: 81px; width: 108px;}