/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
HTML / BODY
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
html {height: 100%; margin-bottom: 1px}
body {background: #323c48; margin: 0; width: 100%}
.clear {clear:both;}
/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
TEXT
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
body, table, form, select, option, input {color: #333; font: 12px/20px trebuchet ms, tahoma, sans-serif}
p {margin: 0}
.text_centered {text-align: center}
.text_right {text-align: right}
.dropcap {font-size: 26px}
.description {font-size: 11px; font-style: italic; line-height: 11px}
.footnote {color: #666; font-size: 11px; font-style: italic}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
HEADINGS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
h1 {border-bottom: 1px solid #333c48; clear: both; color: #333c48; font: normal 24px georgia, san-serif; margin: 0 0 20px 0; padding-bottom: 5px}
h2 {clear: both; font: normal 17px georgia, san-serif; font-style: italic; margin: 0 0 20px 0; padding-bottom: 5px; color: #333545; border-bottom: 1px dashed #333545;}
#sidebar h2 {color: #303538; border-bottom: 1px solid #303538; }
h3, .highlight {color: #303538; font-size: 15px; font-weight: bold; margin: 0; font-style:italic;}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
LINKS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
a:link, a:visited {color: #00F; text-decoration: underline;}
a:hover {text-decoration: none}
#nav a {display: block; color: #767d82; background: #FFF; font-size: 14px; height: 25px; padding: 5px 0 0 10px; text-decoration: none; width: 220px}
#nav a:hover {background: #ecf5f5;}
#sidebar a {background:#FFF; color:#000; text-decoration:underline;}
#active, a#active:hover {background: url(../images/nav_bg2.gif) no-repeat 200px 4px; font-weight: bold}
a#activew, a#activew:hover {background: url(../images/nav_bg2w.gif) no-repeat 200px 4px; font-weight: bold; color:#ec762a;}
a#activep, a#activep:hover {background: url(../images/nav_bg2p.gif) no-repeat 200px 4px; font-weight: bold; color:#4685b9;}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
LISTS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
ul {list-style-type: circle; margin-top: 0}
ul#nav {border: 1px solid #56636b; border-width: 1px 0; list-style: none outside; margin: 33px 0 0 0; padding: 0}
#nav li {border-bottom: 1px dashed #777777; padding: 1px 0}
ul.chart {font-style: italic; list-style-type: none; margin: 0; padding: 0}
ul.chart li {float: left; padding: 4px 0; text-align: center; width: 25%}
ul.every_other li {background: #F4F1D4; border: 1px solid #DEDABD; border-width: 1px 0}
ul.height {font-style: italic; height: 130px; list-style-type: none; margin: 0; padding: 0; width: 480px}
ul.height li {border-bottom: 1px dashed #602100; margin-bottom: 15px}
ul.policies li {padding-top:20px;}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
FORMS
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
select {margin-bottom: 10px; width: 200px}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
IMAGES
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
img {border: none}
#sidebar img {margin-bottom: 10px;}
.image {border: 5px solid #dd5500}
.left {float: left}
.right {float: right}
.margin_left {margin-left: 10px}
.margin_right {margin-right: 10px}
.margin_bottom {margin-bottom: 10px}
.margin_top {margin-top: 10px}
.swatch {font-size: 11px; height: 58px; padding: 2px 0 0 5px; width: 135px}
.white {color: #FFF}
.orange {color: #dd5500}
.clear {clear: both}
#home {margin-top: -30px}
/*#col1 img {margin-top: 30px}*/

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
LAYOUT
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.container {margin: 0 auto; padding: 0 10px; position: relative; width: 760px;}
#header {background: url(../images/layout_header_bg2.gif) repeat-x; color: #fff; font: italic normal 20px georgia, san-serif; height: 40px; padding-top: 60px; text-align: right; border-bottom: 1px solid #000; }
#logo {float: left; left: 10px; position: absolute; top: -60px; z-index: 1}
#body {background: #fff; padding: 40px 0 30px 0}
#col1 {float: left; margin-right: 50px; width: 230px}
#sidebar {color: #616162; font-size: 11px; margin-top: 20px; padding-top: 20px}
#col2 {float: left; width: 480px; color: #303538;}
#col2 p {font-size:14px; line-height:25px;}
.size {width: 50%}
.divider {border-top: 1px dashed #DEDABD; clear: both; font-size: 0; height: 0; margin: 12px 0; overflow: hidden; width: 100%}
#footer {font-size: 11px; padding: 30px 0 40px 0; position: relative; color: #b8b8b8;}
#footer a {color: #fff;}
#footer a:hover {color: #dd5500;}
.clearfix:after {content: "."; display: block; height: 0; clear: both; visibility: hidden}
div#flashcontent {background-color: #fff; margin: 0px !important; padding: 0px !important; width: 480px; height: 350px; border: 3px solid #545567;}
.logo {margin: 40px 40px 0px 0px;}

/*~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~
WEB PORTFOLIO
~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~~*/
.webportfolio{
	float:left;
	width:224px;
	height:227px;
	margin:0 10px 15px 0;
	padding:11px 0 0 11px;
	background:url(/images/bgWebPortfolio.gif) no-repeat;
}
.webportfolio.right{
	margin-right:0;
}
.webportfolio img{
	width:208px;
	margin:0 auto;
	border:solid 1px #92989e;
}
.webportfolio a{
	font-size:12px;
	color:#323c48;
	text-decoration:none;
	font-family:Arial, sans-serif;
	text-transform:uppercase;
}