/*
Brooks 2007 Stylesheet v1
Target: Screen
Author: gary mcclumpha
*/

/* Basic stuff */



* {
	margin: 0;
	padding: 0;
}

body {
	font: normal 62.5%/1.4em Arial, Helvetica, Verdana sans-serif;
	margin-top:20px;
	text-align:center;
	}

h1, h2, h3, h4, h5, h6, form, ol, ul, li, dl {
	margin:0;
	padding:0;
	}
	

h1, h2, h3, h4, input, textarea {
	font-family:Arial, Helvetica, sans-serif;
	}

.clear{
clear:both;
}

a {
color:#666666;
}

a:hover{
color:#009999;
}

.clear {
clear:both;
}

/* structure */

/*#holder{
width:844px;
background:url(../img/frame_top_new.jpg) no-repeat 0 0;
margin: 0 auto;
padding: 40px 0 0 0;
text-align:left;
}*/

#content {
width:570px;
margin: 0 auto;
text-align:left;
}

#base-frame {
width:844px;
height:74px;
}


/* branding header */

#header {
position:relative;
width: 570px;
height:47px;
background:url(../img/brooks.gif) no-repeat 0 0;
}

#nav-holder{
position:absolute;
right:0px;
bottom:0px;
height:15px;
width:305px;
}

/* picture navigation */


#pic-nav-holder {
width:570px;
height:150px;
padding: 80px 0 20px 0;
}

.nav-pic {
	margin: 0; 
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.nav-pic li {
	margin: 0; 
	padding: 0;
	display: inline;
	
}

.nav-pic a {
	float:right;
	border: none;
	overflow: hidden;
	height: 0;
	/* add indent for IE 5.5 */
	text-indent:-3333px;
}

.nav-pic a:hover, .nav-pic a:active {
	background-position: 0 -150px;
}

#pages .nav-pic a:hover, #pages .nav-pic a:active {
	background-position: 0 0;
}

#pages .nav-pic a.selected-pic {
	background-position: 0 0;
}

.nav-about-pic a { width: 122px; height:150px; background: url(../img/frames/frame1.jpg) no-repeat 0 0; }
.nav-services-pic a { width: 122px; height:150px; background: url(../img/frames/frame2.jpg) no-repeat 0 0; margin-left:27px;}
.nav-clients-pic a { width: 122px; height:150px; background: url(../img/frames/frame3.jpg) no-repeat 0 0; margin-left:27px;}
.nav-contact-pic a { width: 122px; height:150px; background: url(../img/frames/frame4.jpg) no-repeat 0 0; margin-left:27px;}

#pages .nav-about-pic a { width: 122px; height:150px; background: url(../img/frames/frame1.jpg) no-repeat 0 0; background-position: 0 -150px;}
#pages .nav-services-pic a { width: 122px; height:150px; background: url(../img/frames/frame2.jpg) no-repeat 0 0; margin-left:27px;background-position: 0 -150px;}
#pages .nav-clients-pic a { width: 122px; height:150px; background: url(../img/frames/frame3.jpg) no-repeat 0 0; margin-left:27px;background-position: 0 -150px;}
#pages .nav-contact-pic a { width: 122px; height:150px; background: url(../img/frames/frame4.jpg) no-repeat 0 0; margin-left:27px;background-position: 0 -150px;}




/* copy area */

#copy-area {
position:relative;
width:570px;
background-color:#FFFFFF;
margin-bottom:20px;
}

#mike {
position:absolute;
top:0;
left:4px;
width:116px;
height:180px;
}

#mike-cap{
position:absolute;
top:185px;
left:4px;
width:116px;
height:20px;
}

#copy-area #mike-cap p  {
padding:0;
margin:0;
}

#home #copy-area {
width:570px;
height:170px;
background:url(../img/mf_logo.gif) no-repeat 5px 80px;
}

#copy-area p {
padding: 0 0 10px 155px;
font-size:1.2em;
line-height:1.4em;
color:#666666;
}

#copy-area p.heading {
font-weight:bold;
color:#009999;
padding: 0 0 10px 155px;
}

#copy-area h1 {
padding: 0 0 0 155px;
font-weight:normal;
font-size:1.4em;
line-height:1.4em;
color:#009999;
}

#copy-area .subhead{
color:#009999;
}

/* Main Nav Styles */

.nav {
	margin: 0; 
	padding: 0;
	list-style: none;
	overflow: hidden;
}

.nav li {
	margin: 0; 
	padding: 0;
	display: inline;
	
}

.nav a {
	float:right;
	border: none;
	margin: 0 0 0 20px;
	overflow: hidden;
	height: 0;
	/* add indent for IE 5.5 */
	text-indent:-3333px;
}

.nav a:hover, .nav a:active {
	background-position: 0 -15px;
}

.nav a.selected {
	background-position: 0 -15px;
}

.nav-about a { width: 84px; height:15px; background: url(../img/about.gif) no-repeat 0 0; }
.nav-services a { width: 43px; height:15px; background: url(../img/services.gif) no-repeat 0 0; }
.nav-clients a { width: 35px; height:15px; background: url(../img/clients.gif) no-repeat 0 0; }
.nav-contact a { width: 41px; height:15px; background: url(../img/contact.gif) no-repeat 0 0; }

/* client list */

#copy-area #col-two {
float:right;
width:215px;
}

#copy-area #col-one {
float:left;
width:355px;
}


#copy-area #col-one p {
padding: 0 0 3px 155px;
font-size:1.2em;
line-height:1.4em;
color:#666666;
}

#copy-area #col-two p {
padding: 0 0 3px 0;
font-size:1.2em;
line-height:1.4em;
color:#666666;
}