/* http://meyerweb.com/eric/tools/css/reset/ */
/* 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;
	font-family: Arial, Helvetica, sans-serif;
	color: #737373;
	background-image:url(images/bg-tile.jpg); 
	background-position:top center; 
	background-repeat:repeat; 
	margin:0px;
	font-size:14px;
	line-height:22px;
	
}


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;
}

/* IE PNG FIX */
img, div, td { behavior: url(iepngfix.htc) }

/* MY CSS */
a{
	color: #FF6600;
	text-decoration: none;
}
a:hover{
	text-decoration: none;
}

h1, h2, h3, h4, h5 {
	font-family: Verdana, Helvetica, Arial, sans-serif;
	font-weight: normal;
	color:#737373;
}
h2.textHeading {
	font-weight: bold;
}
.fixed {
		width:932px;
		margin:0 auto;	
		clear:both;
	}
	
	.fixed a:hover {
		color: #ff8a40;
	}
	
	H1{
		font-family: Verdana, Helvetica, Arial,  sans-serif;
		font-size: 28px;
		display:block;
		margin-bottom:30px;
		margin-top:10px;
		font-weight: normal;
		line-height: 31px;
		color: #141414;
	}
	.title{
		font-family: Verdana, Helvetica, Arial,  sans-serif;
		font-size: 16px;
		display:block;
		margin-bottom:5px;
		font-weight: normal;
		color: #333333;
	}
	
	.highlighted {
		color:#FF6600; font-size:24px; float:right; padding-top:20px; padding-bottom:10px; padding-left:20px; width:150px; line-height:30px;
	}
	.highlighted-line {
		color:#FF6600; font-size:30px; padding-top:20px; padding-bottom:10px; text-align:center;
	}
	.hTextBlock {
		width:860px; margin:auto; padding-bottom:40px;
	}
	
	.hBlockServiceMain {
		display:block; margin-bottom:20px; overflow:hidden;
	}
	.hBlockService {
		float:left; width:450px; padding-bottom:30px;
	}
	.hBlockService .cBlock{
		float:left; padding-top:10px; display:block; width:300px;
	}
	.hBlockService img{
		float:left; width:150px;
	}
	
	.hBlockService H2 {
		font-size:26px;
		display:block;
		padding-bottom:8px;
		line-height:28px;
		padding-top:20px;
		color: #F57422;
		height:60px;
	}
	
	.hBlockService p {
		padding-right:35px; line-height:21px;
	}
	
	.droppedLetter {
		float:left; font-size:80px; line-height:55px; padding-top:10px; padding-right:5px; 
	}
	
	#additionalServices {
		clear:both; margin:auto; width:800px; overflow:hidden; padding-top:15px; overflow:hidden;
		
	}
	
	#additionalServices .title {
		float:left; width:235px; font-size:18px; font-family: Verdana, Helvetica, Arial, sans-serif;
	}
	#additionalServices img {
		float:left; padding-top:2px; padding-left:5px; padding-right:5px; text-align:center;	
	}
	#additionalServices p {
		float:left; width:500px; padding-top:2px; line-height:19px;
	}
	
#ourWork {
	margin-top:60px;
}
	#ourWork .title {
		font-family:Verdana, Helvetica, Arial,sans-serif; font-size:43px; text-align:center;
	}
	#ourWork .title-sm {
		font-family:Verdana, Helvetica, Arial,sans-serif; font-size:25px; text-align:center; margin-bottom:20px;
	}

#container{width:800px;height:596px;margin:50px auto 0}

#parallax{
	position:relative;
	width:999px;
	height:320px;
	margin-bottom:0;
	overflow:hidden;
	margin-top: 0;
	margin-right: auto;
	margin-left: auto;
}
	
#header{
	overflow:hidden; 
	position:relative; 
	height:146px;
	width:999px; 
}

#logo {
	position:absolute; 
	top:20px;
	left:0px;

	overflow:hidden;
}


/* TOP NAV BAR */
#nav{
		position:absolute; padding-left:10px; top:40px; right:0px; width:443px; height:60px; background-image:url(images/menu-bg.png)
}

	#nav ul{
		float:left; padding-top:23px; padding-left:30px;
	}
	#nav li {
		display:inline-block;
		padding-right:25px;
		float:left;
	}
	#nav a{
		font-family: Arial, Helvetica, sans-serif;
		font-size: 18px;
		color: #ffffff;
	}
	#nav a:hover{
		color: #ff8a40;
	}


.quickStart {
	width:63%;   
	float:right;
}



.quickNav {
	margin:0 auto;	
	clear:both;
	overflow:hidden; 
	padding-top:20px;
	width:932px; 
}
	.quickNavLast {
		
	}
	.quickNav a{
		color: #333333;
		font-size: 12px;
		display:inline-block;
		padding:8px;
	}
	.quickNav a:hover{
		color: #ffffff;
	}
	
	.quickNav H3 {
			font-size:26px;
			font-family: Arial, Helvetica, sans-serif;
			padding-bottom:5px;
			margin-top:5px;
			font-weight: normal;
			padding:0px;
			padding-right:25px;
			text-align:right;
			float:left; 
			width:170px;
		}

		.quickNav li {
			display:inline-block; float:left; margin-right:10px;
			border-radius: 5px; background-color:#e9e9e9;
		}	
		.quickNav li:hover {
			border-radius: 5px; background-color:#f57422;
		}
		
		.quickNavliRight ul{
			float:right;
		}
		

#tagLine {
	font-family: Arial, Helvetica, sans-serif;
	background-color: #f57422;
	height:105px;
	color: #FFFFFF;
	font-size:30px;
	padding-top:30px;
	text-align:center;
	line-height:36px;
	overflow:hidden;
	text-align:center;
}	
#tagLine .large{
	font-size:40px;
	padding-top:5px;
	line-height:46px;
}

.hContentBlock{
	padding-left:20px; padding-bottom:40px; padding-top:40px;
}

.insideContent {
	margin-top:23px;
	margin-bottom:23px;
	overflow:hidden;
	line-height:21px;
	text-align:left;
}
.borderTop {
	border-top:1px solid #e9e9e9;
	padding-top:20px;
}
.borderTopBottom {
	border-bottom:1px solid #e9e9e9;
	border-top:1px solid #e9e9e9;
	padding-top:20px;
	padding-bottom:20px;
}
.insideContent p{
	padding-bottom:15px;
}
	
.stuffWeDoBlock {
		clear:both;
		float:left; 
		width:930px;
	}	
	
	.stuffWeDoBlock img {
		padding-top:10px;
		padding-bottom:5px;
	}	
	
	.stuffWeDoBlock ul {
		margin-top:10px;
	}

	.stuffWeDoBlock li {
		list-style-position: inside;
		list-style-image:url(images/bullet.jpg);
		margin-top:2px;
		margin-left:10px;
		margin-bottom:10px;
	}
	
	.stuffWeDoBlock p{

		margin-right:4px;
	}
	.stuffWeDoBlock H1{
		font-size:28px; font-family:Arial, Helvetica, sans-serif; display:block; padding-bottom:5px; margin:0px;
	}
	
	.stuffWeDoBlock .subTitle{
		font-size:18px;
		padding-bottom:10px;
		display:block;	
	}
	.stuffWeDoBlock li p{
		padding-left:3px;	
	}

	.stuffWeDoBlock a{
		font-size:16px;
	}


.project{
	float:left;
	margin-bottom:40px;
	position:relative;
	font-family: Arial, Helvetica, sans-serif;
	font-size: 12px;
	color: 9d9d9d;
	width:287px;
}
	.project .pTitle {
		float:left; padding-left:5px; padding-top:5px;
	}
	.project .pCase {
		float:right; padding-right:5px; padding-top:5px;
	}
	
	.project a {
		color: #9d9d9d;
		font-size: 12px;
	}

	.project img{
		float:left;
	}
	
.project-margin{
		margin-right:20px;
	}
	

#project-details a {
		font-family: Arial, Helvetica, sans-serif;
		font-size: 14px;
		color: #6a6a6a;		
	}
	#project-details .title{
		font-size: 18px;
		display:block;
		color:#191919;
		margin-top:40px;
		margin-bottom:5px;
	}
	#project-details .subTitle{
		font-size: 14px;
		display:block;
		color:#191919;
		margin-top:20px;
		margin-bottom:10px;
	}
	#project-details .url{
		font-size: 12px;
		display:block;
		padding-bottom:10px;
	}
	#project-details .description{
		display:block;
		line-height:21px;
		border-bottom:1px solid #cccccc;
		overflow:hidden;
		padding-bottom:20px;
	}
	#project-details .viewSite {
		display:block;
		margin-top:10px;
		margin-bottom:10px;
	}
	#project-details .viewSite img{
		float:left;
		padding-right:4px;
		padding-top:3px;
	}
	#project-details .viewSite p{
		float:left;
	}
	#project-details .viewSite a:hover{
		color: #d15100;
	}
	
	#project-details .tech-used{
		line-height:21px;
		border-bottom:1px solid #cccccc;
		overflow:hidden;
		display:block;
		padding-bottom:20px;
	}
	
	#project-details .services{
		border-bottom:1px solid #cccccc;
		line-height:21px;
		overflow:hidden;
		padding-bottom:20px;
		display:block;
	}
	
	#project-details .services a {
		font-size:10px;
	}
	
	
	#project-details .service{
		font-family: Arial, Helvetica, sans-serif;
		color: #FFFFFF;
		padding-right: 8px;
		padding-left: 8px;
		padding-top: 2px;
		padding-bottom: 2px;
		line-height:21px;
		overflow:hidden;
		display:inline-block;
		margin-right:3px;
		margin-bottom:3px;
		
	}
	#project-details .service:hover{
		background-color: #4e4e4e;
	}
	#project-details .web{
		background-color: #1BBAE8;
	}
	#project-details .cms{
		background-color: #c41be8;
	}
	#project-details .graphic{
		background-color: #ea8700;
	}
	
	#project-details .nav{
		clear:both;
		display:block;
		overflow:hidden;
		padding-bottom:20px;
		padding-top:20px;
	}
	
.featured {
	font-family: Arial, Helvetica, sans-serif;
	color: #505050;
	font-size: 28px;
	line-height: 32px;
	margin-top:60px;
}

.featured .highlight {
	font-size: 32px;
	color: #ff8a40;
}

.featured-grey-bg {
	background-image:url(images/featured-bg-grey.jpg);
	background-repeat:repeat-x; 
	text-align:center;
}
	.featured-imagebox {
		height:546px; background-position:center; background-repeat:no-repeat;
	}
	.featured-socialMedia {
		background-image:url(images/featured-socialMedia-2.jpg);
	}
	.featured-websiteDev {
		background-image:url(images/featured-websiteDevelopment.jpg);
	}
	

.profile {
	display:block;
	margin-bottom:15px;
	overflow:hidden;
}

	.profile img {
		float:left; padding-right:15px;
	}
	.profile .name {
		font-size:24px; padding:0px; padding-top:15px;
	}
	.profile .position {
		font-size:14px; padding-bottom:20px;
	}
	
	
	
#footer {
	clear:both;
	float:left;
	margin-bottom:60px;
	margin-top:40px;
	padding-top:40px;
	line-height:28px;
	border-top:1px solid #e9e9e9;

}
	#footer .col1{
		float:left; width:330px; padding-left:20px;
	}
	
	#footer .col2{
		float:left; width:230px; text-align:center
	}
	#footer .col3{
		float:left; width:260px; padding-left:60px;
		
		line-height:16px;
		font-size:12px;
		padding-top:2px;
	}
	#footer .col3 p{
		padding-bottom:6px;
	}
	

	#footer .connect {
		font-family: Arial, Helvetica, Verdana, sans-serif; 
		font-size:36px;
		padding-bottom:5px;
		
	}
	#footer .address {
		font-size:14px;
		line-height:18px;
		
	}
	#footer .phone {
		font-family: Arial, Helvetica, sans-serif;
		font-size:31px;	
		padding-bottom:5px;
		padding-top:3px;	
	}
	#footer .email a{
		font-family: Arial, Helvetica, sans-serif;
		font-size:14px;	
		color: #5a5a5a;
	}
	#footer img {
		padding-top:3px;
		padding-left:6px;
		padding-right:6px;
		padding-bottom:6px;
	}
	#footer .copyright {
		font-family: Arial, Helvetica, sans-serif;
		font-size:10px;
		padding-top:8px;	
	}
	#footer .copyright a{
		font-family: Arial, Helvetica, sans-serif;
		font-size:10px;
		padding-top:8px;
		color:#000000;
	}

	

/* FORMS */
.displayMessage{
	padding: 10px;
	border: 1px dotted #FF8A40;
	margin-bottom:10px;
	color: #333333;
	font-weight: bold;
	text-align:center;
}

input{
	color: #333333;
	font-family: 'DIN-Regular', 'Arial', sans-serif;
	font-size: 15px;
	padding: 4px;
	width: 190px;
	-moz-border-radius: 3px 3px 3px 3px;
	border: 1px solid #E5E5E5;
	outline: medium none;
}

textarea{
	color: #333333;
	font-family: 'DIN-Regular', 'Arial', sans-serif;
	font-size: 15px;
	padding: 4px;
	width: 250px;
	-moz-border-radius: 3px 3px 3px 3px;
    border: 1px solid #E5E5E5;
    outline: medium none;
	
}

input:focus{
	border: 1px solid #FF6018;
}
textarea:focus{
	border: 1px solid #FF6018;
}

input.submit{
    -moz-border-radius: 3px 3px 3px 3px;
    background: none repeat scroll 0 0 #ff6018;
    border: 0 none;
    color: white;
    display: inline;
    float: right;
    font-family: 'DIN-Regular','Arial',sans-serif;
    font-size: 15px;
    padding: 8px 10px;
    width: auto;
	cursor:pointer;
}


/* tooltip styling. by default the element to be styled is .tooltip  */
.tooltip {
	display:none;
	background:transparent url(images/black_arrow.png);
	font-size:15px;
	height:70px;
	width:210px;
	padding:20px;
	padding-top:20px;
	padding-bottom:20px;
	color:#fff;
	font-family: Arial, Helvetica, sans-serif;
	text-align:center;
	text-shadow: 1px 0px 0px #737373;
	font-weight: bold;
	line-height:20px;
}

/* style the trigger elements */
#demo img {
	border:0;
	cursor:pointer;
	margin:0 8px;
}

.tooltip.bottom {
	background:url(images/black_arrow_bottom.png);
	padding-top:40px;
	height:55px;
}

.tooltip.bottom {
	background:url(images/black_arrow_bottom.png);
}


/* parallax styles */

#parallax
    {
		position:relative;
		overflow:hidden;
		width:999px;
		height:400px;
		margin:auto;
}

	.parallax-viewport {
		position: relative;     /* relative, absolute, fixed */
		overflow: hidden;
	}
	.parallax-layer {
		position: absolute;
		left: -22px;
	}
	
/* tooltip styling. by default the element to be styled is .tooltip  */
.tooltip {
	display:none;
	background:transparent url(images/black_arrow.png);
	font-size:15px;
	height:70px;
	width:210px;
	padding:20px;
	padding-top:30px;
	color:#fff;
	font-family: Arial, Helvetica, sans-serif;
	text-align:center;
	text-shadow: 1px 0px 0px #737373;
	font-weight: bold;
	line-height:20px;
}

/* style the trigger elements */
#demo img {
	border:0;
	cursor:pointer;
	margin:0 8px;
}

.tooltip.bottom {
	background:url(images/black_arrow_bottom.png);
	padding-top:40px;
	height:55px;
}

.tooltip.bottom {
	background:url(images/black_arrow_bottom.png);
}

/*** Font-face ***/
@font-face {
    font-family: 'BebasNeueRegular';
    src: url('fonts/BebasNeue-webfont.eot');
    src: url('fonts/BebasNeue-webfont.eot?iefix') format('eot'),
         url('fonts/BebasNeue-webfont.woff') format('woff'),
         url('fonts/BebasNeue-webfont.ttf') format('truetype'),
         url('fonts/BebasNeue-webfont.svg#webfont4Bjy2lJe') format('svg');
    font-weight: normal;
}

@font-face {
	font-family: 'museo500';
    src: url('fonts/museo_slab_500-webfont.eot');
    src: url('fonts/museo_slab_500-webfont.eot?iefix') format('eot'),
         url('fonts/museo_slab_500-webfont.woff') format('woff'),
         url('fonts/museo_slab_500-webfont.ttf') format('truetype'),
         url('fonts/museo_slab_500-webfont.svg#webfont4Bjy2lJe') format('svg');	
}