* {
	margin:0; 
	padding:0;
} /*required to remove default padding and margins */
html,body {
	color:#000;
	font-size:22px;
	font-family: Verdana, Geneva, sans-serif;
	height:100%
} /* you need this to allow for 100% on any other elements */
h2 {
	font-size:22px;
}
h3 {
	font-size:16px;
	color:#777;
	font-weight:500;
}
#wrap {
	width:808px;
	margin:0 auto;
	height:100%;
	padding-left:10px;
	padding-right:10px;
}
.header {
	height:170px;
	z-index:5;
}
#main {
	height:100%;  
	min-height: 100%; 
	height: auto !important; 
	border-left-width:129px;
	border-left-color:#000;
	border-left-style:solid;
	margin-top:-170px;
	z-index:2;
}
#logo {
	float:left;
	z-index:6;
}
#nav {
	width: 599px;
	height: 55px;
	list-style:none;
	float:left;
	padding-left:59px;
	padding-top:35px;
}
#bodyContent {
	width:535px;
	padding-top:170px;
	padding-left:80px;
}

/*HACK TO FIX FLOAT MESS*/
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden;}
.clearfix {display: inline-block;}/* Hides from IE-mac */
/*.clearfix {height: 1%;}*/
.clearfix {display: block;}/* End hide from IE-mac */
/*END FLOAT MESS*/

/*NAVIGATION*/ 

ul#topnav {
	margin:0; 
	padding: 0;
	list-style: none;
	width:577px;
}
ul#topnav li {
	/*float: right;*/
	margin: 0; 
	padding: 0;
}
ul#topnav a {
	float: left;
	display: block;
	height: 55px;
	text-indent: -99999px;
	background-position: left top;
}
ul#topnav a:hover {
	background-position: left -55px;
}
#work li.work a,
#services li.services a,
#about li.about a,
#contact li.contact a {
	background-position: left bottom;
}
ul#topnav li.work a {
	background-image: url(/images/work_a.png);
	width: 119px;
}
ul#topnav li.services a {
	background-image: url(/images/services_a.png);
	width: 161px;
}
ul#topnav li.about a {
	background-image: url(/images/about_a.png);
	width: 132px;
}
ul#topnav li.contact a {
	background-image: url(/images/contact_a.png);
	width: 165px;
}

/* END NAVIGATION*/


a:link {text-decoration: none; color: #cecece; 
	-moz-outline-style: none;
	outline: none; font-weight:bold;
}
a:visited {text-decoration: none; color: #cecece; -moz-outline-style: none;
	outline: none;font-weight:bold;}
a:active {text-decoration: none; color: #777;
	-moz-outline-style: none;
	outline: none;font-weight:bold;
}
a:hover {text-decoration: none; color: #777; -moz-outline-style: none;
	outline: none;font-weight:bold;}

.quote {
	font-size:28px; 
	font-weight:bold; 
	font-color:#ccc;
}
#linkedin {
	position:relative;
	display: block;
	width: 246px;
	height: 63px;
	background: url(../images/linkedin.png) no-repeat 0 0;
	float:left;
	padding-right:43px;
}
#linkedin:hover {
	background-position:0 -63px;
}
#linkedin span {
	position: absolute;
	top: -999em;
}

#google {
	position:relative;
	display: block;
	width: 246px;
	height: 63px;
	background: url(../images/google-profile.png) no-repeat 0 0;
	float:left;
}
#google:hover {
	background-position:0 -63px;
}
#google span {
	position: absolute;
	top: -999em;
}


#expertise {
	position:relative;
	display: block;
	width: 538px;
	height: 179px;
	background: url(../images/expertise.png) no-repeat 0 0;
	float:left;
}
#expertise:hover {
	background-position:0 -179px;
}
#expertise span {
	position: absolute;
	top: -999em;
}

#designer-developer {
	position:relative;
	display: block;
	width: 538px;
	height: 370px;
	background: url(../images/designer-developer.png) no-repeat 0 0;
	float:left;
}
#designer-developer:hover {
	background-position:0 -370px;
}
#designer-developer span {
	position: absolute;
	top: -999em;
}


#design {
	float:left;
	width:196px;
	list-style-type: none;
	border-right: 1px solid #bcbcbc;
	padding:0;
	margin:0;
}
#design p {
	color:#777;
	text-align:left;
}

#development {
	float:left;
	width:313px;
	list-style-type: none;
	padding-left:25px;
}
#development p {
	color:#777;
	text-align:left;
}

/*-------------- BEGIN PORTFOLIO -------------------*/
.portfolioCopy {
	float:left;
	width:198px;
	padding-right:35px;
	height:100%;
}
.portfolioCopy p {
	font-size:16px;
	padding-top:24px;
	margin:0;
}
.tommy-boat {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/tommy-boat-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .tommy-beach {
	float:left;
  width:300px;
  height:250px;
  border:1px solid #e8e8e8;
  }
  .findingNature {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/finding-nature-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .pmiFlash {
	float:left;
  width:300px;
  height:250px;
  border:1px solid #e8e8e8;
  margin-bottom:20px;
  }
  .pmiImage {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/pmi-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .deb {
	float:left;
  width:300px;
  height:250px;
  border:1px solid #e8e8e8;
  }
  .murrays {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/murrays-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .toddscookbook {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/toddscookbook-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .somb {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/somb-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
   .flashsite {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/flashsite-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .spitko {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/spitko-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .maureensmile {
	  float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/maureensmile-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .tca {
	float:left;
  width:300px;
  height:250px;
  background:url(../images/portfolio/tca-detail.jpg) repeat;
  border:1px solid #e8e8e8;
  }
  .pestworld {
	float:left;
  width:300px;
  height:250px;
  border:1px solid #e8e8e8;
  }
.transbox
  {
  width:300px;
  height:70px;
  margin:0;
  background-color:#000;
  /* for IE */
  filter:alpha(opacity=60);
  /* CSS3 standard */
  opacity:0.6;
  position: relative; 
  top: 90px;
  }
.transbox p
  {
  font-size:24px;
  text-transform:capitalize;
  text-align:center;
  }
  .transbox p a {
	  display: block;
	  padding:20px 10px;
  	text-decoration: none;
	outline: 0;
  }
  
.transbox p a:link {color:#ccc; }      /* unvisited link */
.transbox p a:visited {color:#ccc; }  /* visited link */
.transbox p a:hover {color:#fff; }  /* mouse over link */
.transbox p a:active {color:#fff; }  /* selected link */
  
/*-------------- END PORTFOLIO -------------------*/
