/*-----------------------------------------------------------------------------
version:   1.0
author:    sheri bodnaruk
email:     info@picainteractive.com
website:   http://www.picainteractive.com/
-----------------------------------------------------------------------------*/

/* =General
-----------------------------------------------------------------------------*/


/* Remove padding and margin */
* {
  margin: 0;
	padding: 0;
}

/* Put it back on certain elements */
p, pre, blockquote, form, fieldset, table, ul {
  margin: 1em 0;
}

h1, h2, h3, h4, h5, h6 {
	margin:.5em 0;
}

/* Class for clearing floats */
.clear {
	clear:both;
}


/* Remove border around linked images */
img {
	border: 0;
}

/* =Containers
-----------------------------------------------------------------------------*/
body {
	background:#b9db93 url(../images/background.gif) top center repeat-x;
}

#wrapper {
	width: 1000px;
	float:left;
	}
	
#innerWrapper {
	float:right;
	width:741px;
}

.logoSide {
	width: 250px;
	float:left;
}

.header {
	width:714px;
	float:left;
}

.container {
	float:left;
	width:741px;
	padding-top:10px;
	background: url(../images/contentTopShadow.gif) top center no-repeat;
}

.innerContainer, .whoContainer, .whatContainer, .contactContainer {
	width:741px;
	margin-top:15px;
	float:left;
}

.whatContainer {
	background: url(../images/contentWhoMiddleShadow.gif) top center repeat-y;
}

.whoContainer {
	background: url(../images/contentWhatMiddleShadow.gif) top center repeat-y;
}

.contactContainer {
	background: url(../images/contactMiddleShadow.gif) top center repeat-y;
}

.innerContainer {
	background: url(../images/contentMiddleShadow.gif) top center repeat-y;
}

.sideBar {
	width: 200px;
	padding-left:35px;
	float:left;
}

.contentContainer {
	float:right;
	width:500px;
}

.contentSingleContainer {
	float:left;
	padding-left:175px;
	width:500px;
}

.footer {
	background: #b9db93 url(../images/contentBottomShadow.gif) top center no-repeat;
	padding-top:23px;
	float:left;
	width:741px;
}

.whoFooter, .whatFooter, .contactFooter {
	padding-top:48px;
	float:left;
	width:741px;
}

.whatFooter {
	background: #b9db93 url(../images/whoBottomShadow.gif) top center no-repeat;
	}

.whoFooter {
	background: #b9db93 url(../images/whatBottomShadow.gif) top center no-repeat;
}

.contactFooter {
	background: #b9db93 url(../images/contactBottomShadow.gif) top center no-repeat;
}

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

body {
  font: 85.5%/1.6 "Trebuchet MS", "Bitstream Vera Sans", verdana, arial, helvetica, helve, sans-serif;
  color:#666;
}

.contentContainer p, .contentSingleContainer p {
	padding:0 40px 0 15px;
}

h1 + p {
	margin-top:5px;
}

.who h2, .what h2, .contact h2 {
	font-size:100%;
	color:#fff;
	height:30px;
	line-height:30px;
	padding-left:20px;
	margin:0;
	border-top:5px solid #fff;
	border-bottom:5px solid #fff;
}

.what h2 {
	background: url(../images/whoSideMenu.gif) top left repeat-x;
	}
	
.who h2 {
	background: url(../images/whatSideMenu.gif) top left repeat-x;
	}
	
.contact h2 {
	background: url(../images/contactSideMenu.gif) top left repeat-x;
	}
	
h2 {
	color:#71AD2F;
	padding-left:15px;
	font-size:110%;
}

h3 {
	color:#71AD2F;
}

p.copyright {
	text-align:right;
	font-size:80%;
	margin:0;
	padding-right: 30px;
}

p.contactInfo span {
	width: 45px;
	text-align:right;
	padding-right: 10px;
	display:block;
	float:left;
	font-weight:bold;
}

ul.linksList {
	list-style:none;
	padding-left: 15px;
}


/* =Headings
-----------------------------------------------------------------------------*/



/* =Links
-----------------------------------------------------------------------------*/

a {
	color:#71AD2F;
	text-decoration:none;
}

a:hover {
	color:#DBAC21;
	text-decoration:none;
}

.footer a, .whoFooter a, .whatFooter a, .contactFooter a {
	color:#666;
}

.footer a:hover, .whoFooter a:hover, .whatFooter a:hover, .contactFooter a:hover {
	text-decoration:underline;
}



/* =Branding
-----------------------------------------------------------------------------*/
#wrapper img.logo {
	padding:0px 0 0 0px;
	float:left;
}



/* =Main Nav
-----------------------------------------------------------------------------*/
.topNav {
	margin: 7px 5px 0 0;
	text-align:right;
}

.mainNav {
	width:741px;
	float:left;
	padding-top: 31px;
	height:65px;
	background: url(../images/bottomMenuShadow.gif) bottom center no-repeat;
}

.mainNav ul {
	float:left;
	list-style:none;
	margin:0;
	padding-left:110px;
}

.mainNav ul li {
	float:left;
	padding-left:5px;
}

.mainNav ul li a {
	display:block;
	width:115px;
	height:45px;
	text-align:center;
	text-decoration:none;
	padding-top:20px;
	font-size: 120%
}

li.home a {
	background: url(../images/home.gif) top center no-repeat;
	color:#7AA050;
}

li.home a:hover, li.home a.select {
	background: url(../images/homeOver.gif) top center no-repeat;
	color:#fff;
}

li.what a {
	background: url(../images/who.gif) top center no-repeat;
	color:#DFA711;
}

li.what a:hover, li.what a.select {
	background: url(../images/whoOver.gif) top center no-repeat;
	color:#fff;
}

li.who a {
	background: url(../images/what.gif) top center no-repeat;
	color:#54A4D5;
}

li.who a:hover, li.who a.select {
	background: url(../images/whatOver.gif) top center no-repeat;
	color:#fff;
}

li.helpful a {
	background: url(../images/helpful.gif) top center no-repeat;
	color:#E6C406;
}

li.helpful a:hover, li.helpful a.select {
	background: url(../images/helpfulOver.gif) top center no-repeat;
	color:#fff;
}

li.contact a {
	background: url(../images/contact.gif) top center no-repeat;
	color:#F76BA2;
}

li.contact a:hover, li.contact a.select {
	background: url(../images/contactOver.gif) top center no-repeat;
	color:#fff;
}

/* =sideBar buttons
-----------------------------------------------------------------------------*/

ul.buttons {
	list-style:none;
	text-align:center;
	margin-top:10px;
}

ul.buttons li a {
	display:block;
	width:195px;
	height:62px;
	padding-bottom:10px;
	text-decoration: none;
	color: #fff;
	font-size: 130%;
}

ul.buttons li.buttonOne a {
	background: url(../images/yellowButton.gif) top center no-repeat;
	line-height: 62px;
}

ul.buttons li.buttonOne a:hover {
	background: url(../images/yellowButtonOver.gif) top center no-repeat;
	color:#DFA711;
}

ul.buttons li.buttonTwo a {
	background: url(../images/pinkButton.gif) top center no-repeat;
	height: 52px;
	padding-top:10px;
	line-height:20px;
}

ul.buttons li.buttonTwo a:hover {
	background: url(../images/pinkButtonOver.gif) top center no-repeat;
	color:#F76BA2;
}

ul.buttons li.buttonThree a {
	background: url(../images/blueButton.gif) top center no-repeat;
	line-height: 60px;
}

ul.buttons li.buttonThree a:hover {
	background: url(../images/blueButtonOver.gif) top center no-repeat;
	color:#54A4D5;
}

/* =Sub Nav
-----------------------------------------------------------------------------*/
.what ul, .who ul, .contact ul {
	list-style:none;
	margin-top:0px;
}

.what ul li a {
	background-color:#F4DF8D;
	color:#DCA101;
}

.what ul li a, .who ul li a, .contact ul li a {
	display:block;
	height: 30px;
	line-height:30px;
	padding-left:20px;
	border-bottom:1px dashed #fff;
}

.what ul li a:hover, .what ul li a.select {
	background-color:#F8EBB7;
}

.who ul li a {
	background-color:#90D2F8;
	color:#54A4D5;
}

.who ul li a:hover, .who ul li a.select {
	background-color:#B9E1F8;
}

.contact ul li a {
	background-color:#f898be;
	color:#d24e83;
}

.contact ul li a:hover, .contact ul li a.select {
	background-color:#facfe0;
}


/* =titles
-----------------------------------------------------------------------------*/

h1 span {
	display:none;
	}
	
#homeTitle {
	background: transparent url(../images/homeTitle.gif) no-repeat top left; 	
  	height: 30px;
	margin:10px 0 0 12px;
	}
	
#whoTitle {
	background: transparent url(../images/whoWeAreTitle.gif) no-repeat top left; 	
  	height: 30px;
	margin:10px 0 0 12px;
	}
	
#whatTitle {
	background: transparent url(../images/whatWeDoTitle.gif) no-repeat top left; 	
  	height: 30px;
	margin:10px 0 0 12px;
	}

#helpfulTitle {
	background: transparent url(../images/helpfulLinksTitle.gif) no-repeat top left; 	
  	height: 30px;
	margin:10px 0 0 12px;
	}
	
#employmentTitle {
	background: transparent url(../images/employmentTitle.gif) no-repeat top left; 	
  	height: 30px;
	margin:10px 0 0 12px;
	}
	
#contactTitle {
	background: transparent url(../images/contactUsTitle.gif) no-repeat top left; 	
  	height: 30px;
	margin:10px 0 0 12px;
	}

/* =Main Content
-----------------------------------------------------------------------------*/




/* =Secondary Content
-----------------------------------------------------------------------------*/



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



/* =Forms
-----------------------------------------------------------------------------*/

/* Removes fieldset borders. even on Opea 7 */
fieldset {
  border: 1px solid transparent;
}

form {
	margin:0;
	padding:0;
}


/* =Tables
-----------------------------------------------------------------------------*/

table { 
  border-spacing: 0;
	border-collapse: collapse;
}

td {
  text-align: left;
	font-weight: normal;
}

th {
	font-weight:normal;
	padding-top:10px;
}

table.contactForm, table.checkboxNotification {
	width:400px;
	margin:10px 0 0 15px;
	padding:0;
	text-align:left;
}

.checkbox {
	padding:5px 10px 0 0;
}

.required {
	color:#BF311A;
}

.textfield input, .comments input {
	width:400px;
}

.colOne input, .colTwo input {
	width:195px;
}

.colOne input, .colOneNar input {
	margin-right:10px;
}

.colOneNar input {
	width: 120px;
}

.colTwoWide input {
	width: 265px;
}

table input {
	border-top: 2px solid #999;
	border-left: 2px solid #999;
	border-bottom: 1px solid #ccc;
	border-right: 1px solid #ccc;
}

.commentBox {
	height:175px;
	width: 100%;
}

.submitButton input {
	width:100px;
	height: 25px;
	background-color:#eee;
	color:#d24e83;
	margin-top: 15px;
	border-top: 1px solid #ccc;
	border-left: 1px solid #ccc;
	border-bottom: 2px solid #999;
	border-right: 2px solid #999;
}

p.contact {
	margin-bottom:0;
	padding-bottom:0;
}

/* =Misc 1
-----------------------------------------------------------------------------*/
.map {
	margin-left:15px;
}

.map iframe {
	border:1px solid #F76BA2;
}

/* =Misc 2
-----------------------------------------------------------------------------*/
