/* Website for Chazin and Company */
/* Summer 2008 */
/* Site design and development by Red Letter Design, www.RedLetterDesign.net */

/* Notes:
Medium blue for text elements: #224880
Lt brown for lines and borders: #958a71
Lighter brown: #d9ceb3 (lines)
Lightest brown: #F2EFE8 (area backgrounds)

*/

/* Reset browser default styles to insure consistency across various browsers */
html, body, div, 
applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, font, img, ins, kbd, q, s, samp,
small, strike, sub, sup, tt, var,
dd, dl, dt, li, ol, ul,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
margin: 0; padding: 0; 	border: 0; 	font-size: 100%; line-height: 1; text-align: left; 	vertical-align: baseline; }
a img, :link img, :visited img { border: 0; }
ol, ul { list-style: none; }
q:before, q:after, blockquote:before, blockquote:after { content: ""; }

/* Helpful fixes */
a {outline: none;}  /* get rid of Firefox link boxes */
html { height: 100%; } /* forces vertical scrollbars in FF to avoid horizontal shift on short pages, combined with min-height on body */
body { min-height: 101%; } /* forces vertical scrollbars in FF to avoid horizontal shift on short pages, combinded with height on html */
* html ul li a { vertical-align: bottom; zoom: 1; } /* fixed IE6 bug that adds extra padding to a within li, esp for nav */

/* Layout Structure */
body { margin: 0; padding: 0; background: #ffffff url(../images/background.jpg) center top repeat; }
div#wrapper { position: relative; margin: 0 auto; padding: 0; width: 790px; background: #000000 url(../images/content.jpg) repeat-y center top; }
	div#content { position: relative; width: 520px; margin: 0; padding: 240px 30px 20px 240px; min-height: 770px; 
								background: url(../images/header.jpg) no-repeat top left;}
	* html div#content { height: 770px;  } /* IE hack for min-height */
		div#header { position: absolute; top: 48px; right: 27px; width: 360px;	height: 75px; }
		div#nav { position: absolute; top: 240px; left: 30px; width: 180px; }
div#footer { width: 750px; margin: 0 auto; padding: 12px 20px 0 20px; height: 60px; background: url(../images/footer.jpg) no-repeat top left; }
	div#footerRight { float: right; width: 300px; }
	div#footerCredit { margin-top: 10px; }	

div#printHeader {display: none;}


/* Typography */
body, input, textarea {	font-family:  Georgia, "Times New Roman", Times, serif; color: #3f3f3f;}
h1 { font-size: 24px; font-weight: normal; color: #224880; line-height: 30px; margin: 0; padding: 0 0 10px 0px; }
h2 { font-size: 18px; font-weight: normal; color: #224880; line-height: 22px; font-style: italic; margin: 0 0 5px 0; padding: 10px 0 0 0; }
h3 { font-size: 15px; font-weight: normal; color: #224880; font-style: italic; padding: 0 0 3px 0; }
p, li { font-size: 15px; line-height: 20px; margin: 0; padding: 0 0 15px 0; }
td, th { font-size: 13px; line-height: 18px; margin: 0 0 10px 0; padding: 0; text-align: left; font-weight: normal; }
th { font-weight: bold; }
strong { color: #224880; font-weight: bold;}
em { color: #224880; font-style: italic;}
blockquote { padding: 5px 20px; }
a { color: #224880; }
a:link { color: #224880; }
a:visited { color: #224880; }
a:hover { color: #990000; }
a:active { color: #90000; }
ul { list-style-position: outside; list-style-type: square; margin: 0 0 10px 2em; padding: 0 0 0 0;}
ol { list-style-position: outside; list-style-type: decimal; margin: 0 0 20px 2em; padding: 0 0 0 0; }
ul ul, ol ul { list-style-type: disc; margin: 10px 0 10px 2em; list-style-position: outside; }
ol ol, ul ol { list-style-type: lower-alpha; margin: 10px 0 10px 2em; list-style-position: outside; }
li { margin: 0 0 10px 0; padding: 0; }
ul.listCompact { list-style-position: outside; list-style-type: square; margin: 0 0 20px 2em; padding: 0 0 0 0; }
ol.listCompact { list-style-position: outside; list-style-type: decimal; margin: 0 0 20px 2em; padding: 0 0 0 0; }
ul.listCompact li, ol.listCompact li { margin: 0; padding: 0; }
table { margin: 10px 0; padding: 0; }
td { padding: 4px; margin: 0; vertical-align: top;}
th { padding: 4px; margin: 0; vertical-align: top; }

/* Primary Navigation */
div#nav ul { list-style: none; list-style-position: outside; text-indent: 0; margin: 0; padding: 0; }
div#nav li { margin: 0; padding: 0; border-bottom: 1px solid #d9ceb3; }
div#nav li.currentNav { font-weight: bold;  }
div#nav li a { display: block;  margin: 0; padding: 10px 5px 3px 0; font-size: 16px; line-height: 1.4; color: #224880; text-decoration: none; }
div#nav li a:hover { font-weight: bold; color:#990000; }
div#nav li.currentNav a:hover { font-weight: bold; color: #224880; background: transparent; }

/* Content under navigation */
div#navbase { width: 180px; padding: 0; margin: 15px 0 0 0; }
div#navbase img { border: 1px solid #958a71; margin: 0 0 15px 0;}
div#navbase p { font-size: 13px; }
div#navbase p strong { font-size: 15px; font-weight: normal; color: #990000; }

/* Graphics */
img.photoRight { border: 1px solid #958a71; padding: 0; background-color: #ffffff; margin: 5px 0 5px 10px; float: right; }
img.photoLeft { border: 1px solid #958a71; padding: 0; background-color: #ffffff; margin: 5px 10px 5px 0; float: left; }
img.graphicRight { border: none; padding: 0; margin: 5px 0 5px 5px; float: right; }
img.graphicLeft { border: none; padding: 0; margin: 5px 5px 5px 0; float: left; }

/* Response Forms */
form.response { border: 1px solid #d9ceb3; margin: 10px 0 20px 0; padding: 10px; background: #fcfcfa url(../images/gradient.jpg) top left repeat-x;   }
form.response input, form.response textarea { margin: 3px 8px 3px 0; padding: 3px; }
form.response input.formInput, form.response textarea { border: 1px solid #d9ceb3; color: #224880; font-size: 13px; }
form.response label { display: block; margin: 0px 0 10px 0; letter-spacing: 1px; color: #3c3c3c; padding: 0; font-size: 11px; }
form.response div#honeypot { display: none; } /* spambot trap */
form.response .fieldwarning { color: #990000; font-weight: bold; padding-left: 0; }
form.response .retMessage { background-color: #ffffff; color:  #224880; padding: 5px 7px !important; margin: 5px 0; border: 1px solid  #d9ceb3; }
form.response .warning { color: #990000; font-weight: normal; font-style: italic; padding-left: 0; }

/* Special uses */
.floatclear { clear: both; }

/* Header content */
div#header h1 { font-size: 17px; font-weight: normal; font-style: italic; color: #000000; text-align: right; line-height: 1.2; margin: 0; padding: 0; }
div#header p { font-size: 11px; font-weight: normal; color: #000000; text-align: right; line-height: 1.2; margin: 0; padding: 10px 0 0 0; }

/* Footer content */
div#footer p { font-size: 12px; font-weight: normal; line-height: 1.4; margin: 0; padding: 5px 0 0 0; color: #ffffff; text-align: left; }
div#footer p a, div#footer p a:link, div#footer p a:visited { color: #ffffff; text-decoration: none; }
div#footer p a:hover { color: #990000; font-weight: bold; }
div#footer div#footerRight p {text-align: right; }
div#footer div#footerCredit p { font-size: 9px; color: #999999; }
div#footer div#footerCredit p a { color: #999999; }
div#footer div#footerCredit p a:hover { color: #ffffff; background-color: transparent; font-weight: normal; }

/* Resources */
div.resource { border: 1px solid  #aaaaaa; margin: 5px 0 20px 0; padding: 10px; width: 500px; background: #ffffff url(../images/resourceTab.jpg) repeat-x top left;  }
div.resource h2 { font-family: Tahoma, Arial, Helvetica, sans-serif; text-transform: uppercase; font-weight: bold; font-size: 14px; line-height: 1.0; padding: 0 0 10px 0;  font-style: normal;  }

/* Staff Photos */
div.staffBox {width: 160px; padding: 0; margin: 0 12px 20px 0; float: left; }
div.staffBox img { width: 158px; height: 200px; border: 1px solid black; padding: 0; margin: 0}
div.staffBox p.name { width: 152px; padding: 5px 3px 3px 3px; margin: 0 0 5px 0; border: 1px solid black; border-top: none; background-color: #dcd5c4;}
div.staffBox p.staffPosition { font-size: 12px; font-style: italic; margin: 0 0 5px 0; padding: 0;  } 
div.staffBox p.emailLink { font-size: 12px; italic; margin: 0 0 5px 0; padding: 0;}