/************************
	LAYOUT STRUCTURE
************************/
body {margin: 0; padding: 0; line-height: 1.5em;
font-family: 'trebuchet ms', arial, verdana, sans-serif; font-size: small; background: #FFF;
max-width: 100%;
}
textarea {font-family: 'trebuchet ms', arial, verdana, sans-serif; font-size: small;}

#header {background: url('../files/header_bg.jpg') no-repeat 100% 0 #2F4F7F; height: 107px;}
#header img {width: 269px; height: 107px; border: 0; color: #FFF; font-weight: bold; font-size: 1.3em;}


#contentwrapper {float: left; width: 100%; background: #FFF; color: #000; padding-bottom: 20px;}
#leftCol {float: left; width: 200px; margin-left: -100%; padding: 0 5px 0 5px; background: url('../files/left_bg.jpg') repeat-y;}
#rightCol {margin-left: 210px; padding: 10px; background: #FFF; min-height: 300px;}
#leftCol, #rightCol {border-top: 3px solid #BBB;}

#leftFade {display: block; margin: 30px -5px 0 -5px; padding: 0; height: 45px; background: url('../files/left_bg_fade.jpg') repeat-y;}

#footer {clear: left; width: 100%; background: black; color: #FFF; padding: 4px 0; margin: 0;}
#footer ul {margin: 0 0 0 5px; padding: 0;}
#footer li {list-style: none; display: inline; margin-right: 5px;}
#footer a, #footer a:visited {color: #FFF; text-decoration: none;}
#footer a:hover {color: #E86D09; text-decoration: underline;}

/*a#webdesigner, a:visited#webdesigner {color: #BBB;}*/

#mainNav {margin: 0; padding: 0; height: 40px; color: #000; background: url('../files/mainnav_bg.gif') repeat-x #E3E1D4; border-bottom: 1px solid #1C3152;}
#mainNav ul {margin: 0; padding: 0;}
#mainNav li {list-style: none; display: inline; margin: 0; height: 40px;}
#mainNav li a, #mainNav li a:visited {
	display: block; float: left;
	line-height: 38px; height: 38px; margin: 0; padding: 0 10px;
	border-style: solid; border-width: 2px 1px 1px 0; border-color: #FFF #CCC #1C3152 #FFF; 
	color: #253D6C; background: transparent; text-decoration: none; font-weight: bold; letter-spacing: 1px;
}
#mainNav li a:hover {background: #EE6800; color: #FFF; border-color: #F1BF13 #FFF #AE5109 #FFF;}
#mainNav li a.current {background: #27334B !important; border-color: #27334B !important; color: #FFF !important;}


/* pseudo padding for old browsers */
.innertube{margin: 10px; margin-top: 0;}


/** LIMITED WIDTH TEXT BLOCKS */
.limited {max-width: 700px; text-align: justify;}


/*******
	GRID/COLUMN SYSTEMS
********/
.gridContainer {float: left; margin: 0 0 2em 0; padding: 0; width: 99%;}
.col2 {float: left; width: 48.5%; padding: 3px 0;}
.col3 {float: left; width: 30%; padding: 3px 0;}

.touch {width: auto;} /* makes column as narrow as possible */

#searchBox {margin: 0; width: 230px; padding: 10px 5px 10px 5px; background: url('../files/search_bg.png') no-repeat 0 100% #CBC5B8;}
#searchBox p {margin: 0;}
#searchBox label {font-weight: bold;}
#siteSearch {width: 10em;} /* text input field */


/**************
	STYLES & TOOLS
**************/
#leftCol table {clear: left;}
th, td {text-align: left; vertical-align: top; padding: 4px;}
address {font-style: normal;}

#rightCol a {color: #315995;}
#rightCol a:visited {color: #666;}
#rightCol a:hover {color: #AD172B;}

#leftCol ul.button {margin: 0; padding: 0;}
#leftCol ul.button li {list-style: none; margin: 0; padding: 0;}
#leftCol ul.button a {display: block; width: 200px; margin: 0 -5px 0 -5px; padding-left: 10px; line-height: 25px; font-weight: bold;}
#leftCol ul.button a:hover {background: #E86D09; color: #FFF;}

#leftCol a {color: #063B76;}
#leftCol a:hover {color: #B00;}

.buttonLink, .buttonLink:visited {background: url('../files/mainnav_bg.gif'); color: #183B63 ! important; font-weight: bold; padding: 5px; line-height: 200%; border: 1px solid #999; text-decoration: none;}
.buttonLink:hover {color: #B00 ! important; text-decoration: underline;}


h1 {color: #183B63; letter-spacing: 2px; margin-top: 0.5em; font-weight: normal; border-bottom: 2px solid #253D6C; padding-bottom: 4px;}
h2 {font-size: 1.4em; color: #E86D09;}
.reverse {background: #DDD; color: #183B63; padding-left: 5px; line-height: 150%; letter-spacing: 1px;}

.space {margin: 2.5em;}
.clear {clear: both; height: 2px;} /* use on dedicated clearing DIVs -- must have height specified */
.clear2 {clear: both;} /* use on pre-existing elements, e.g h2, p */
.icon16 {width: 16px; height: 16px; border: 0;}

.imageRight {float: right; margin: 0 0 12px 12px;}
.imageLeft {float: left; margin: 0 12px 12px 0;}
.imageRight img, .imageLeft img {margin: 0;}

.highlight1 {color: #E86D09;} /* PI orange */
.highlight2 {color: #183B63;} /* PI navy */

.bold {font-weight: bold;}
.small {font-size: 12px; color: #777; line-height: 100%;}

.left {text-align: left !important;}
.right {text-align: right;}
.center {text-align: center;}
.formShort {width: 4em;}