/* HTML ELEMENTS
----------------------------------------------------------------------------------------------------*/


body {
font-family:Helvetica, Arial, sans-serif;
background-color:#ffffff;
color:333333;
font-size:12px;
line-height:20px;
}

p {
	font-size:12px;
}



body#aboutpage a#aboutnav {
color:#cd1c8d;
font-weight:bold !important;
}

body#servicespage a#servicesnav {
color:#00aeef;
font-weight:bold !important;
}


body#portfoliopage a#portfolionav {
color:#87b700;
font-weight:bold !important;
}


body#processpage a#processnav {
color:#5d4188;
font-weight:bold !important;
}

body#blogpage a#blognav 

  {
color:#de6c09;
font-weight:bold !important;
}


body#contactpage a#contactnav {
color:#263a6e;
font-weight:bold !important;
}




img { border:0;
}


hr {
	border: 0 #ccc solid;
	border-top-width: 1px;
	clear: both;
	height: 0;
}

.websiteLink a {
font-weight:normal !important;

}

.websiteLink {
margin-top:-10px !important;
padding-top:0px !important;
}


.caseStudy {
/*border-bottom:2px solid #000000;*/
margin-bottom:35px;
padding:0;

}

.caseStudycontent {
float:left;
width:280px;
}

.caseStudy img {
float: right;
top: 10px;
display:block !important;
margin-left:10px;
margin: 0 0 0px 0;
}


.caseStudy h2 {
color:#000000 !important;
font-size:28px;
font-weight:bold;
border-bottom:none !important;
line-hright:1.2em;
letter-spacing:normal !important;
margin-bottom:10px !important;
}



.caseStudy .cs {
text-transform:uppercase;
color:#828282;
font-size:10px;
font-weight:bold;
margin-bottom:0px;

}

.noUnderline {
border-bottom:none !important;

}

.viewMore {
float:right;

}

.clientList li {
text-size:11px;
text-indent:0px;
list-style-type:none;



}


.clientList {
width:140px;
float:left;

}


.next {
float:right;
display:inline;
margin-top:-25px;

}

.caseStudyintro {
color:#585858;
font-size:16px;
line-height:1.6em;
}




.services {

}

.quickFacts {
margin-top:20px;

}


.quickFacts li {
text-size:12px;
text-indent:0px;
list-style-position:outside;
list-style-type:disc;
margin-left:20px;
line-height:1.2em;
margin-bottom:10px;





}










/* SECTION COLORS & Links colors
----------------------------------------------------------------------------------------------------*/

.blue {color:#00adf2; }
.green {color:#87b700; }
.pink {color:#cd1c8d; }
.cyan {color:#00aeef; }
.orange {color:#de6c09;}
.navy {color:#263a6e;}
.purple {color:#5d4188; }
.red { color:#af1900;}




 #home {
border-top:4px solid #000000;

}


.home {
background-image:url(../img/blue-body-bg.gif);
background-repeat:repeat-x;


}

.home #footer {
border-bottom:4px solid #000000;

 }


.home a {
color:#00adf2;
text-decoration:none;
font-weight:bold;
}

.home a:hover  {
color:#00adf2;
text-decoration:underline;

}

 #about {
border-top:4px solid #000000;

}


 #services {
border-top:4px solid #000000;

}

.about {
background-image:url(../img/pink-body-bg.gif);
background-repeat:repeat-x;


}

.services {
background-image:url(../img/pink-body-bg.gif);
background-repeat:repeat-x;


}



.about #footer {
border-bottom:4px solid #000000;

 }
 
 .services #footer {
border-bottom:4px solid #000000;

 }
 
 .about a {
color:#cd1c8d;
text-decoration:none;
font-weight:bold;
}


.about a:hover  {
color:#cd1c8d;
text-decoration:underline;

}


 .about a {
color:#cd1c8d;
text-decoration:none;
font-weight:bold;
}


.about a:hover  {
color:#cd1c8d;
text-decoration:underline;

}


 #portfolio {
border-top:4px solid #000000;

}

.portfolio{
background-image:url(../img/green-body-bg.gif);
background-repeat:repeat-x;


}


.portfolio #footer {
border-bottom:4px solid #000000;

 }
 
 .portfolio a {
color:#5f9202;
text-decoration:none;
font-weight:bold;
}

.portfolio a:hover  {
color:#5f9202;
text-decoration:underline;

}


#process {
border-top:4px solid #000000;


}

.process {
background-image:url(../img/navy-body-bg.gif);
background-repeat:repeat-x;


}

.process a {

color:#5d4188;
text-decoration:none;
font-weight:bold;


}

.process a:hover {
color:#5d4188;
text-decoration:underline;
}



.process #footer {
border-bottom:4px solid #000000;

 }



 #contact {
border-top:4px solid #000000;

}

.contact {
background-image:url(../img/navy-body-bg.gif);
background-repeat:repeat-x;


}


.contact #footer {
border-bottom:4px solid #000000;

 }
 
.contact a {
color:#263a6e;
text-decoration:none;
font-weight:bold;
}

.contact a:hover  {
color:#263a6e;
text-decoration:underline;

}



/* Typography
----------------------------------------------------------------------------------------------------*/


.logo { 
margin-top:18px;
float:left;
}


#mainHeading {

margin-top:50px;

}



.home h1 {
color:#0194cb;
letter-spacing:-2px;
font-weight:normal;
line-height:58px;
}


.about h1 {
color:#cd1c8d;
letter-spacing:-2px;
font-weight:normal;
line-height:58px;
}


.about h2 {
color:#cd1c8d;
font-weight:normal;
padding-bottom:7px;
border-bottom:1px solid #cd1c8d;
line-height:38px;
}



.services h1 {
color:#00aeef;
letter-spacing:-2px;
font-weight:normal;
line-height:58px;
}


.services h2 {
color:#cd1c8d;
font-weight:normal;
padding-bottom:7px;
border-bottom:1px solid #cd1c8d;
line-height:38px;
}



.portfolio h1 {
color:#5f9202;
letter-spacing:-2px;
font-weight:normal;
line-height:58px;
}


.portfolio h2 {
color:#5f9202;
font-weight:normal;
padding-bottom:7px;
border-bottom:1px solid #87b700;
line-height:38px;
}

.portfolio h3 {
color:#5f9202;
font-weight:normal;
}



.process h1 {
color:#5d4188;
letter-spacing:-2px;
font-weight:normal;
line-height:58px;
}


.process h2 {
color:#000000;
font-weight:normal;
padding-bottom:7px;
line-height:38px;
}

.process h3 {
color:#000000;
font-weight:normal;
}

.contact h1 {
color:#263a6e;
letter-spacing:-2px;
font-weight:normal;
line-height:58px;
}





h1 {
	font-size: 58px;
	line-height: 58px;
}

h2 {
	font-size: 38px;
	line-height: 38px;
}

h3 {
	font-size: 18px;
}

h4 {
	font-size: 16px;
}

h5 {
	font-size: 14px;
}



#web {

}

.servicesRendered {
color:#666666;
font-size:11px;

}

.webList {
margin-top:10px;
padding-left:0px;
text-indent:0px;
list-style-type:none;


}

.webList ul li {
padding-bottom:10px;
margin-left:0;
}


.portViews {
float:right; margin-top:50px; margin-left:40px; width:200px;
}

.portViews p {
float:left;
margin-right:10px;
margin-top:5px;
}

.viewButtons {
float:right;
}


/* `Spacing
----------------------------------------------------------------------------------------------------*/

ol {
	list-style: decimal;
}

ul {
	list-style: square;
}



p,
dl,
hr,
h1,
h2,
h3,
h4,
h5,
h6,
ol,
ul,
pre,
table,
address,
fieldset {
	margin-bottom: 13px;
}






/* Home styles
----------------------------------------------------------------------------------------------------*/




#homeIntro {
background-image:url(../img/home-intro-bg.gif);
background-repeat:no-repeat;
background-position:top left;
min-height:73px;
margin-top:25px;
}

#homeIntro p {
margin-left:30px;
margin-top:15px;
margin-right:25px;


}


#home h3 {
border-bottom:1px solid #000000;
width:298px;

}

.portfolioImg {
margin-bottom:15px;
border:1px solid #999999;
width:298px;
height:182px;
}

.miniportfolioImg {
width:90px;
border:1px solid #999999;



}

.processImg {
border:1px solid #999999;

}












/*  NAVIGATION 
----------------------------------------------------------------------------------------------------*/



.topNav {

float:right; 
margin-top:10px; 
font-size:12px; 



}

.topNav li {

display:inline;
margin-left:30px;


}


.topNav a {

color:#333333;
text-decoration:none;
font-weight:bold !important;
text-transform:uppercase;


}


.topNav .blue a:hover {color:#00adf2 !important; text-decoration:underline;}
.topNav .green a:hover {color:#87b700 !important;text-decoration:underline;}
.topNav .pink a:hover {color:#cd1c8d !important; text-decoration:underline; }
.topNav .cyan a:hover {color:#00aeef !important; text-decoration:underline; }
.topNav .orange a:hover {color:#de6c09 !important;text-decoration:underline;}
.topNav .navy a:hover {color:#263a6e !important; text-decoration:underline;}
.topNav .red a:hover { color:#af1900 !important; text-decoration:underline;}
.topNav .purple a:hover { color:#5d4188 !important; text-decoration:underline;}





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

#footer p {
margin-bottom:4px !important;
font-size:11px;
}

#footer a {
color:#333333 !important;
text-decoration:none;
font-weight:normal !important;
}

#footer a:hover {
color:#333333 !important;
text-decoration:underline;
font-weight:normal !important;
}



.bottomNav {

float:right; 
margin-bottom:4px !important;
font-size:11px; 



}

.bottomNav li {

display:inline;
margin-left:30px;


}


.bottomNav a {

color:#333333;
text-decoration:none;
font-weight:normal !important;
text-transform:uppercase;


}


.bottomNav .blue a:hover {color:#00adf2 !important; text-decoration:underline;}
.bottomNav .green a:hover {color:#87b700 !important;text-decoration:underline;}
.bottomNav .pink a:hover {color:#cd1c8d !important; text-decoration:underline; }
.bottomNav .cyan a:hover {color:#00aeef !important; text-decoration:underline; }
.bottomNav .orange a:hover {color:#de6c09 !important;text-decoration:underline;}
.bottomNav .purple a:hover {color:#671cad !important; text-decoration:underline;}
.bottomNav .red a:hover { color:#af1900 !important; text-decoration:underline;}





/* `Containers
----------------------------------------------------------------------------------------------------*/

.container_12,
.container_16 {
	margin-left: auto;
	margin-right: auto;
	width: 960px;
	min-height:480px;
}

/* `Grid >> Global
----------------------------------------------------------------------------------------------------*/

.grid_1,
.grid_2,
.grid_3,
.grid_4,
.grid_5,
.grid_6,
.grid_7,
.grid_8,
.grid_9,
.grid_10,
.grid_11,
.grid_12,
.grid_13,
.grid_14,
.grid_15,
.grid_16 {
	display: inline;
	float: left;
	margin-left: 10px;
	margin-right: 10px;
}

.container_12 .grid_3,
.container_16 .grid_4 {
	width: 220px;
	
}

.container_12 .grid_6,
.container_16 .grid_8 {
	width: 460px;
	min-height:400px;
}

.container_12 .grid_9,
.container_16 .grid_12 {
	width: 700px;
}

.container_12 .grid_12,
.container_16 .grid_16 {
	width: 940px;
}

/* `Grid >> Children (Alpha ~ First, Omega ~ Last)
----------------------------------------------------------------------------------------------------*/

.alpha {
	margin-left: 0;
}

.omega {
	margin-right: 0;
}

/* `Grid >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .grid_1 {
	width: 60px;
}

.container_12 .grid_2 {
	width: 140px;
}

.container_12 .grid_4 {
	width: 300px;
	float: left;
	margin-left: 10px;
	margin-right: 10px;

	
}

.portdiv { height:480px; }

.container_12 .grid_5 {
	width: 380px;
}

.container_12 .grid_7 {
	width: 540px;
}

.container_12 .grid_8 {
	width: 620px;
}

.container_12 .grid_10 {
	width: 780px;
}

.container_12 .grid_11 {
	width: 860px;
}

/* `Grid >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .grid_1 {
	width: 40px;
}

.container_16 .grid_2 {
	width: 100px;
}

.container_16 .grid_3 {
	width: 160px;
}

.container_16 .grid_5 {
	width: 280px;
}

.container_16 .grid_6 {
	width: 340px;
}

.container_16 .grid_7 {
	width: 400px;
}

.container_16 .grid_9 {
	width: 520px;
}

.container_16 .grid_10 {
	width: 580px;
}

.container_16 .grid_11 {
	width: 640px;
}

.container_16 .grid_13 {
	width: 760px;
}

.container_16 .grid_14 {
	width: 820px;
}

.container_16 .grid_15 {
	width: 880px;
}

/* `Prefix Extra Space >> Global
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_3,
.container_16 .prefix_4 {
	padding-left: 240px;
}

.container_12 .prefix_6,
.container_16 .prefix_8 {
	padding-left: 480px;
}

.container_12 .prefix_9,
.container_16 .prefix_12 {
	padding-left: 720px;
}

/* `Prefix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .prefix_1 {
	padding-left: 80px;
}

.container_12 .prefix_2 {
	padding-left: 160px;
}

.container_12 .prefix_4 {
	padding-left: 320px;
}

.container_12 .prefix_5 {
	padding-left: 400px;
}

.container_12 .prefix_7 {
	padding-left: 560px;
}

.container_12 .prefix_8 {
	padding-left: 640px;
}

.container_12 .prefix_10 {
	padding-left: 800px;
}

.container_12 .prefix_11 {
	padding-left: 880px;
}

/* `Prefix Extra Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .prefix_1 {
	padding-left: 60px;
}

.container_16 .prefix_2 {
	padding-left: 120px;
}

.container_16 .prefix_3 {
	padding-left: 180px;
}

.container_16 .prefix_5 {
	padding-left: 300px;
}

.container_16 .prefix_6 {
	padding-left: 360px;
}

.container_16 .prefix_7 {
	padding-left: 420px;
}

.container_16 .prefix_9 {
	padding-left: 540px;
}

.container_16 .prefix_10 {
	padding-left: 600px;
}

.container_16 .prefix_11 {
	padding-left: 660px;
}

.container_16 .prefix_13 {
	padding-left: 780px;
}

.container_16 .prefix_14 {
	padding-left: 840px;
}

.container_16 .prefix_15 {
	padding-left: 900px;
}

/* `Suffix Extra Space >> Global
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_3,
.container_16 .suffix_4 {
	padding-right: 240px;
}

.container_12 .suffix_6,
.container_16 .suffix_8 {
	padding-right: 480px;
}

.container_12 .suffix_9,
.container_16 .suffix_12 {
	padding-right: 720px;
}

/* `Suffix Extra Space >> 12 Columns
----------------------------------------------------------------------------------------------------*/

.container_12 .suffix_1 {
	padding-right: 80px;
}

.container_12 .suffix_2 {
	padding-right: 160px;
}

.container_12 .suffix_4 {
	padding-right: 320px;
}

.container_12 .suffix_5 {
	padding-right: 400px;
}

.container_12 .suffix_7 {
	padding-right: 560px;
}

.container_12 .suffix_8 {
	padding-right: 640px;
}

.container_12 .suffix_10 {
	padding-right: 800px;
}

.container_12 .suffix_11 {
	padding-right: 880px;
}

/* `Suffix Extra Space >> 16 Columns
----------------------------------------------------------------------------------------------------*/

.container_16 .suffix_1 {
	padding-right: 60px;
}

.container_16 .suffix_2 {
	padding-right: 120px;
}

.container_16 .suffix_3 {
	padding-right: 180px;
}

.container_16 .suffix_5 {
	padding-right: 300px;
}

.container_16 .suffix_6 {
	padding-right: 360px;
}

.container_16 .suffix_7 {
	padding-right: 420px;
}

.container_16 .suffix_9 {
	padding-right: 540px;
}

.container_16 .suffix_10 {
	padding-right: 600px;
}

.container_16 .suffix_11 {
	padding-right: 660px;
}

.container_16 .suffix_13 {
	padding-right: 780px;
}

.container_16 .suffix_14 {
	padding-right: 840px;
}

.container_16 .suffix_15 {
	padding-right: 900px;
}

/* `Clear Floated Elements
----------------------------------------------------------------------------------------------------*/

/* http://sonspring.com/journal/clearing-floats */

.clear {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 0;
}

.clear50 {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 50px;
}

.clear25 {
	clear: both;
	display: block;
	overflow: hidden;
	visibility: hidden;
	width: 0;
	height: 50px;
}



/* http://www.positioniseverything.net/easyclearing.html */

.clearfix:after {
	clear: both;
	content: '.';
	display: block;
	visibility: hidden;
	height: 0;
}

.clearfix {
	display: inline-block;
}

* html .clearfix {
	height: 1%;
}

.clearfix {
	display: block;
}


.floatright {
float:right;
}

.floatleft {
float:left;
}