/* Basics
----------------------------------------------------------------------------------------------------*/

* {	margin: 0; padding: 0;	text-align: justify;}

a:link, a:visited, a:focus {	outline: none; text-decoration: none; color: #000;	}

a:hover {text-decoration: underline;}

img {	border: none;	}

body {	font: 13px/1.5 'Helvetica Neue', Arial, 'Liberation Sans', FreeSans, sans-serif; background: #ecf0f4;}

.container {	margin-left: auto; margin-right: auto; width: 970px; position: relative;	}

.last {margin: 0;}

/* Layout 
----------------------------------------------------------------------------------------------------*/

#nav {background: url(../img/nav.jpg) repeat-x; height: 90px;}
#logo {float: left; display: inline; width: 319px; height: 122px; background: url(../img/logo.png) no-repeat; text-indent: -9999px;}


/*------------------------------ Top Navigation ----------------------- */

#navigation {margin-top: 56px; float: left; display: inline; margin-left: 30px; text-indent: -99999px; width: 600px;}
#navigation a {display: block; height: 16px;}
#navigation li {list-style: none; height: 16px; float: left; display: inline; margin-right: 40px; overflow: hidden;}
#home {background: url(../img/navigation.jpg) top left no-repeat; width: 45px; }
#portfolio {background: url(../img/navigation.jpg) -45px 0 no-repeat; width: 84px; }
#services {background: url(../img/navigation.jpg) -129px 0 no-repeat; width: 74px; }
#mission {background: url(../img/navigation.jpg) -203px 0 no-repeat; width: 100px; }
#contact {background: url(../img/navigation.jpg) -303px 0 no-repeat; width: 71px; }

#home a:hover {background: url(../img/navigation.jpg) 0 -16px no-repeat; }
#portfolio a:hover {background: url(../img/navigation.jpg) -45px -16px no-repeat;}
#services a:hover {background: url(../img/navigation.jpg) -129px -16px no-repeat;  }
#mission a:hover {background: url(../img/navigation.jpg) -203px -16px no-repeat; }
#contact a:hover {background: url(../img/navigation.jpg) -303px -16px no-repeat; }



/*------------------------------ Header ----------------------- */

#header {background: url(../img/header.jpg) repeat-x; height: 331px; _margin-top: -35px /* IE6 */; }

#headlines {float: left; display: inline; clear:both; width: 451px; height: 260px; background: url(../img/headlines.png) no-repeat; margin-left: 15px;  text-indent: -99999px; margin-top: 12px; *margin-top: 49px; /* IE6 & 7 */}
#headlines h1 {text-transform: uppercase; margin-bottom: 12px; color: #f9f9f9; font: normal 30px Arial, Helvetica, sans-serif;}
#headlines h4 {color: #f9f9f9; font: normal 20px Arial, Helvetica, sans-serif;}


#slideshow {width: 483px; height: 284px; background: url(../img/slideshow.jpg) no-repeat; position: absolute; right: -40px; top: 20px;}

#slideshow img {position: absolute; right: 60px; z-index: 999 ; } /* Ribbon */

/*a#view_port, a#req_quote {display: block; width: 145px; height: 33px; float: left; display: inline; }

a#view_port { margin: 9px 0 0 6px; }

a#req_quote { margin: 9px 0 0 33px;} */

/*------------------------------ Content ----------------------- */

#content {background: url(../img/content_tshadow.png) no-repeat; margin-top: -6px; overflow: hidden;}

#con_container {background: url(../img/content_bg.png) repeat-y; margin-top: 6px; padding: 15px 25px; float: left; display: inline; width: 920px;}

.con_left {float: left; display: inline; width: 568px; background: #fff; margin-right: 20px; border: 1px solid #daedfa; -moz-border-radius: 8px; -webkit-border-radius: 8px; padding: 20px; margin-bottom: 5px; position: relative; }

.con_left_box {float: left; display: inline; width: 130px; margin-right: 10px; }

#arrow { position: absolute; bottom: 30px; right: -40px; }

.con_left_text {float: left; display: inline; width: 428px;}

h2#online_marketing {background: url(../img/online-marketing.png) no-repeat; width: 238px; height: 25px; text-indent: -9999px; font: 20px Georgia, "Times New Roman", Times, serif;}

h2#webdesign_services {background: url(../img/web-design-services.png) no-repeat; width: 257px; height: 25px; text-indent: -9999px; font: 20px Georgia, "Times New Roman", Times, serif;}

.more {margin-top: 15px; width: 85px; height: 30px; background: url(../img/read_more.png) no-repeat; text-indent: -99999px; float: right; display: inline;}

.con_left_text p {color: #666;}

.con_right {float: right; display: inline; width: 248px; background: #fff; border: 1px solid #daedfa; -moz-border-radius: 8px; -webkit-border-radius: 8px; padding: 20px; margin-bottom: 5px; color: #706f6f;}

.con_right span {font: bold 13px/1.7 Arial, Helvetica, sans-serif; letter-spacing: 1.1}

h2#websites_features,  h2#free_tips {background: url(../img/websites-features.png) no-repeat; width: 185px; height: 35px; text-indent: -9999px; font: 20px Georgia, "Times New Roman", Times, serif; }

h2#free_tips { background: url(../img/free-tips.png) no-repeat; }

ul#psd {margin-left: 0px; list-style: none;}

ul#psd li {font: 15px Arial, Helvetica, sans-serif; background: url(../img/bullet.jpg) no-repeat; margin-bottom: 20px; padding-left: 25px; text-align: left;}




#con_bottom {background: url(../img/con_bottom.png) no-repeat; height: 70px; clear:both; text-align: right;}

#con_bottom a {margin-right: 30px; margin-top: 25px; color: #015792;}




/*------------------------------ Footer ----------------------- */

#footer {background: #99c4db url(../img/footer_bg.png) repeat-x; min-height: 178px; height: 178px; overflow: hidden; margin-top: -41px;}

#footer a {color: #015792;}

/*#testi_link {background: url(../img/testi_read.png) no-repeat; width: 83px height: 32px; text-indent: -9999px;}*/

#col1, #col2, #col3 {float: left; display: inline; margin-top: 50px; color: #6b7175;}

#col1 {width: 200px; }

#col2 {font-weight: bold; width: 390px; background: url(../img/testimonial.png) no-repeat; padding-left: 110px;}

#col2 #name {float: right; display: inline;}

#col3 {text-align: right; width: 260px;}

#foot_logo {background: url(../img/foot_logo.png) no-repeat; width: 139px; height: 49px; display: block; text-indent: -9999px; float: right; display: inline; margin-left: 120px; margin-bottom: 10px;}

#col3 span {clear: both;}



/*------------------------------ Portfolio ----------------------- */

ul.gallery {
	width: 920px; /*--Adjust width according to your scenario--*/
	list-style: none;
	margin: 0; padding: 0;
	float: left;
}
ul.gallery li {
	float: left;
	margin: 0 7px 15px 7px; padding: 0;
	text-align: center;
	border: 1px solid #ccc;
	-moz-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	-khtml-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	-webkit-border-radius: 3px; /*--CSS3 Rounded Corners--*/
	display: inline; /*--Gimp Fix aka IE6 Fix - Fixes double margin bug--*/
}
ul.gallery li a.thumb {
	width: 280px; /*--Width of image--*/
	height: 150px; /*--Height of image--*/
	padding: 5px;
	border-bottom: 1px solid #ccc;
	cursor: pointer;
}

ul.gallery li.middle {margin: 0 8px 10px 8px;}

ul.gallery li span { /*--Used to crop image--*/
	width: 280px;
	height: 150px;
	overflow: hidden;
	display: block;
}
ul.gallery li a.thumb:hover {
	background: #333; /*--Hover effect for browser with js turned off--*/
}
ul.gallery li h2 {
	font-size: 1em;
	font-weight: normal;
	text-transform: uppercase;
	margin: 0; padding: 10px;
	background: #f0f0f0;
	border-top: 1px solid #fff; /*--Subtle bevel effect--*/
}
ul.gallery li a {text-decoration: none; color: #777; display: block;}

#content_p {background: url(../img/con_top.png) no-repeat; overflow: hidden; clear: both; padding-top: 6px;}



#header_p {_margin-top: -35px /* IE6 */; border-top: 2px solid #f9f9f9; }

#header_p h1 {height: 40px; color: #3f4142; text-transform: uppercase; font: 30px Arial, Helvetica, sans-serif; margin-left: -7px; *margin-left: 0px;}

#header_p h2 {font: 20px Tahoma, Geneva, sans-serif; line-height: 30px; margin-bottom: 20px; }

#h_image {float: left; display: inline; clear:both; width: 300px; text-align: right; margin-top: 15px; *margin-top: 52px; /* IE6 & 7 */ margin-bottom: 20px; }

#details {color: #959798; float: right; display: inline; width: 610px; *margin-top: 33px; padding-right: 10px;}



/*------------------------------ Testimonials ----------------------- */


.testi_box {overflow: hidden; margin-bottom: 25px;  border: 3px double #daedfa; -moz-border-radius: 8px; -webkit-border-radius: 8px; padding: 20px; _float: left; _display: inline;}

.client { float: left; display: inline; width: 190px; border: 10px solid #ccc; margin-right: 20px;height: 130px;}

.testimonial {float: left; display: inline; width: 644px;}

.testimonial p {color: #828181; font: 13px/20px Arial, Helvetica, sans-serif; margin-bottom: 10px;}

.testimonial span {font: 17px Arial, Helvetica, sans-serif; font-style: normal; color: #6A9BBC;}



/*------------------------------ Services ----------------------- */



.service_details {overflow: hidden; margin-bottom: 25px; clear:both;}

.numbers {font: 150px Helvetica, sans-serif; color: #ccc; text-shadow: 2px 2px #999; float: left; display: inline; width: 100px;}

.service_details h3 {font: 25px Arial, Helvetica, sans-serif; margin-bottom: 10px; text-transform: uppercase; }

.service_details p {color: #828181; font: 13px/20px Arial, Helvetica, sans-serif;}

.diagram {width: 200px; height: 200px; float: right; display: inline; margin-left: 15px; /*border: 2px solid #fff; border-radius: 8px; -moz-border-radius: 8px; -webkit-border-radius: 8px;*/ position: relative; top: -15px; text-align: center;}

#details .clink {color: #015792; }

/*------------------------------ Contact ----------------------- */



h4 {font: 25px Georgia, "Times New Roman", Times, serif; height: 35px; text-transform: uppercase; color: #015792;}

h4 img {float: left; margin-right: 10px; position: relative; top: -4px;}

#contact_form {float: left; display: inline; width: 100%; color: #666; min-height: 400px;}


/*------------------------------ From ----------------------- */

.previewLabel { float: left; display: inline; width: 70px; text-align: right; margin-right: 5px; font-size: 14px;}
.af-textWrap { float: left; display: inline; }
.af-element { margin-bottom: 10px; overflow: hidden; }
.buttonContainer { float: right; display: inline; margin: 0; padding: 0;}

