/*	
	Copyright (c) 2009 Grant Jameison.
	Doc: default
	Revision: 1.0
	
--------------------------------------------------------------------------------------------
	Global 
--------------------------------------------------------------------------------------------*/

html, body {
	margin:0;
	padding:0;
	height:100%;
	width:100%;
}

body {
	font-family:'Lucida sans', 'Lucida Grande', Arial, sans-serif;
	font-size:0.75em;
	color:#666666;
	background:url(../images/headerSlice.gif) repeat-x;
}


a:link img, a:active img, a:visited img {
	border:0;
}

/* Generic Links */

a:link, a:visited, a:active {
	color:#000;
	text-decoration:none;
}
a:hover {
	color:#ffc658;
	text-decoration:none;
}


/*--------------------------------------------------------------------------------------------
	Structural 
  --------------------------------------------------------------------------------------------*/

#wrapper {
	width:1000px;
	margin:0 auto;
	position:relative;
}

#container {
	background:url(../images/bannerSlice.gif) repeat-x 0 92px;
	width:100%;
	margin:0;
}

#header {
	width:1000px;
	height:92px;
	float:left;
}

.left_panel {
	position:relative;
	width:250px;
	min-height:390px;
	height:auto !important;
	height:390px;
	float:left;
}
 .right_panel {
	position:relative;
	width:750px;
	min-height:390px;
	height:auto !important;
	height:390px;
	float:left;
}
.left_panel2 {
	position:relative;
	width:250px;
	min-height:100px;
	height:auto !important;
	height:100px;
	float:left;
}
.reduce {
	width:230px;
}
 .right_panel2 {
	position:relative;
	width:750px;
	min-height:100px;
	height:auto !important;
	height:100px;
	float:left;
}
.enlarge {
	width:770px;
}
#hero_panel {
	width:748px;
	height:388px;
	float:left;
	padding:1px 0 0 2px;
	position:relative;
}
#slideshow {
	z-index:1;
	position:relative;
}
#output {
	width:728px;
	height:70px;
	padding:0 0 12px 20px;
	color:#FFFFFF;
	position:absolute;
	bottom:0;
	z-index:100;
	background:url(../images/outputPanel.png) no-repeat;
}

#output p {
	color:#FFFFFF;
}
#output a:link, #output a:visited, #output a:active {
	color:#ffc658;
}

#output a:hover{
	color:#fff;
}

.full_col {
	width:1000px;
	float:left;
	margin:10px 0;
}

.full_col a{
	font-size:0.92em;
}
.full_col .left_panel {
	width:750px;
}
.full_col .right_panel {
	width:250px;
}

.service_panel {
	width:355px;
	float:left;
	background:url(../images/panelBg.gif) repeat-x bottom;
	height:80px;
	margin:0 10px 10px 0;
}
.serviceTxt {
	width:255px;
	float:left;
	padding:10px;
}
.service_panel img {
	float:left;
	margin:10px;
}

a:link .service_panel, a:visited .service_panel, a:active .service_panel {
		background:url(../images/panelBg.gif) repeat-x bottom;
}
a:hover .service_panel {
		background:#666;
}

.quarter_panel {
	width:230px;
	float:left;
	padding:0;
}
.quarter_panel img {
	margin:0 0 15px 0;
}

#explore .quarter_panel {
	padding:0 25px 0 0;
}

.full_col .left_panel .quarter_panel {
	padding:0 20px 0 0;
}

.full_col .right_panel .quarter_panel {
	padding:0 0 0 20px;
}

.double_panel {
	width:460px;
	padding:0 40px;
	float:left;
}

.triple_panel {
	width:690px;
	padding:0 0 0 40px;
	float:left;
}


#explore .quarter_panel.last {
	padding:0;
	margin:0;
}
#content {
	width:448px;
	padding:0 50px 0 2px;
	float:left;
}


#details {
	width:230px;
	float:left;
	margin: 15px 0 0 0;
}

.social {
	width:70px;
	float:left;
}
#explore #social {
	width:120px;
	float:right;
	height:35px;
	padding:15px 0 0 0;
}

/* Footer */
#explore {
	width:1000px;
	}

#exploreBtn {
	width:850px;
	height:35px;
	float:left;
	background:url(../images/plus.gif) no-repeat 5px 15px;
	cursor:pointer;
	position:relative;
	color:#666;
	padding:15px 0 0 30px;
	font-size:1.17em;
}

#exploreBtn.open {
	background:url(../images/minus.gif) no-repeat 5px 15px;
}

#explore ul, #explore li {
	margin:0;
	padding:0;
	list-style:none;
}


#clientsinfocontainer{
	width:750px;
	height:138px;
	float:left;
	border:dotted #666666;
	border-width:0 0 1px 0;
	background:none;
	margin:0 0 0 0;
	padding:0 0 0 0;
	display:table;
}


.clientspic{
	width:338px;
	height:138px;
	float:left;
	margin:0;
	padding:0;
	
}
.clientsinfo{
	width:412px;
	margin:0;
	padding:0;
	display: table-cell;
	vertical-align:middle;
	}


#footer {
	width:1000px;
	margin:0 auto;
	position:relative;
	background:url(../images/footerBg.gif) repeat-x;
}

#footer_txt {
	width:1000px;
	height:20px;
	margin:0px auto;
	padding:0;
	text-align:right;
	color:#666666;
	font-size:0.83em;
}

/*--------------------------------------------------------------------------------------------
	Navigation 
  --------------------------------------------------------------------------------------------*/  
/* Main nav */

#header img{
	float:left;
	white-space:nowrap;
}

#nav_panel {
	height:92px;
	width:750px;
	background:url(../images/img_nav_bg.gif) no-repeat;
	float:left;
}

#nav_panel ul {
	margin:0;
	padding:0;
	list-style:none;
}

#nav_panel li {
	margin:48px 30px 0 0;
	padding:0;
	list-style:none;
	float:left;
}

#nav_panel li a:link, #nav_panel li a:active, #nav_panel li a:visited {
	color:#FFF;
	height:16px;
	padding:0 10px 0 0;
	font-size:1.17em;
}

#nav_panel li a#selected, #nav_panel li a:hover{
	color:#ffc658;
}
#nav_panel .first {
	margin:38px 18px 0 10px;
}
#nav_panel .end {
	margin:48px 0px 0 0;
}


/* Subnav  */

#subnav {
	width:250px;
	float:left;
}


#subnav li.thumbnail {
	list-style:none;
}

#subnav a:link, #subnav a:active, #subnav a:visited {
	float:left;
	width:125px;
	height:97px;
	margin:0;
	background:url(../images/homeTab.gif) no-repeat;
}
#subnav a img { 
	filter:alpha(opacity=100);
	opacity: 1;
}
#subnav a:hover img, #subnav li.activeSlide a img { 
	filter:alpha(opacity=60);
	opacity: 0.6;
}

#subnav a:focus { 
	outline: none; 
}

/* Worknav  */
#worknav {
	width:250px;
	position:absolute;
	bottom:10px;
}

#worknav a:link, #worknav a:active, #worknav a:visited {
	margin: 10px 15px 0px 0;
	color:#cc9900;
	padding:2px 3px 1px 3px;
	float:left;
	width:15px;
	height:15px;
	text-align:right;
}
#worknav a.activeSlide { 
	background:#303030;
}
#worknav a:focus { 
	outline: none; 
}

/* Gallery  */
.gallery ul, .gallery li{
	list-style:none;
	margin:0;
	padding:0;
	float:left;
}

.gallery a:link img, .gallery a:active img, .gallery a:visited img {
	width:170px;
	height:89px;
	filter:alpha(opacity=100);
	opacity: 1;
	margin:0 0 10px 20px;
}
.gallery a.activeSlide img{ 
	filter:alpha(opacity=30);
	opacity: 0.3;
}
.gallery a:focus { 
	outline: none; 
}


/* Content Nav */

ul.contentNav {
	margin:0;
	padding:0;
	list-style:none;
	float:left;
	width:230px;
}

.contentNav li {
}

.contentNav li a:link, .contentNav li a:active, .contentNav li a:visited {
	padding:0;
}


/*--------------------------------------------------------------------------------------------
	Typography
  --------------------------------------------------------------------------------------------*/
/* Headings */
h1 {
	font-size:2em;
	margin:10px 0;
	padding:0;
	font-weight:normal;
}

#worknav h1 {
	color:#FFF;
}

h2 {
	font-size:1.67em;
	margin:0 0 10px 0;
	padding:0;
}

h3 {
	font-size:1.17em;
	margin:0 0 10px 0;
	padding:0;
}

#content h3 {
	font-size:1.17em;
	margin:1em 0 10px 0;
	padding:0;
}

.service_panel h3, .service_panel p {
	margin:0;
	padding:0;
}

.right_panel2 h4 {
	margin:0;
	padding:0;
	font-size:1em;
	
}

h4 {
	margin:0;
	padding:0;
	font-size:1em;
	font-weight:normal;
	
}

.right_panel2 #details p {
	margin:0;
	padding:0;
	font-size:1em;
	
}


/* Type */
p {
	font-size:1em;
	line-height:1.3em;

}

p.date {
	border:dotted #666666;
	border-width:0 0 1px 0;
	padding:0 0 10px 0;
	font-size:0.92em;
	color:#999999;
}

#testimonials p {
	margin:0 0 10px 0;
	padding:0;
	font-size:1em;
	line-height:1.3em;
}

#testimonials p.date {
	border:dotted #666666;
	border-width:0 0 1px 0;
	padding:0 0 10px 0;
	font-size:0.92em;
	color:#999999;
}


#content li {
	color:#999999;
	font-size:0.92em;
}


hr {
	border:dotted #666666;
	border-width:1px 0 0 0;
	height:1px;
	background:none;
	margin:10px 0;
}

.folio {
	width:97%;
	border:dotted #333;
	border-width:1px 0 0 0;
	margin:20px 0;
	display:inline;
	float:left;
}

.small{
	font-size:0.75em;
	line-height:14px;
	
}

/*--------------------------------------------------------------------------------------------
	Forms - form, input, label etc
  --------------------------------------------------------------------------------------------*/
form {
	padding:0;
	margin:0;
}

label {
	width: 100px;
	float: left;
	text-align: left;
	margin-right: 5px;
	display: block
}

input, textarea {
	border:#FFC700 solid 1px;
	background:#000000;
	color:#FFFFFF;
}

input#searchbtn {
	border:#FFC700 solid 1px;
	background:#FFC700;
	color:#000000;
	cursor:pointer;
}


