html, body, div, span, 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, strong, sub, sup, tt, var,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td {
	margin: 0;
	padding: 0;
	border: 0;
	outline: 0;
	font-weight: inherit;
	font-style: inherit;
	font-size: 100%;
	font-family: inherit;
	vertical-align: baseline;
   border-spacing:0px;
	
}
*{font-family: "trebuchet MS", verdana, helvetica, sans-serif; font-size: 12px; }

ul {
	list-style: none;
}

table {border-collapse: separate;border-spacing: 0;}
caption, th, td {text-align: left;font-weight: normal;}
blockquote:before, blockquote:after,q:before, q:after {	content: "";}
blockquote, q {quotes: "" "";}


a { color: #780e78; text-decoration: none;}
a:hover { text-decoration: underline;}

h1{ color: #005d52; font-size: 24px; padding: 5px 0px 20px 0px; line-height: 28px;}
h2{ color: #005d52; font-size: 18px;}
h3{ color: black; font-weight: bold; font-size: 16px; margin:10px 0 5px 0;}
h4{ }
h5{}

strong { color: #005d52; font-weight: bold;}

em { font-style: italic; }

.clearMe{clear: both; height:1px;}
input[type="text"], input[type="password"] { border: 1px solid black;}
select{border: 1px solid black;}

input, textarea, select{margin-bottom: 5px; padding-left: 3px;}
textarea{width: 250px;height: 150px;}

br{clear: left;height: 10%;}
fieldset {border: 1px solid #dbd4d4 ;  padding: 5px;}

fieldset legend {font-weight: bold;padding: 3px 6px 3px 6px; color: #005d52;}


ul.transportation_methods { margin-top: 10px; }
ul.transportation_methods li { list-style-type: disc;list-style-position: inside;}

ul.blurbs li { margin: 15px 0px;}

html, body{position:relative; min-width:1200px;}

/* Site Template */
body {width: 1200px; margin: 0 auto; font-family: "trebuchet MS", verdana, helvetica, sans-serif; font-size: 12px; line-height: 14px; background: url(/UI/Skins/default/Images/body_bg.png) top center repeat-y gray; }
.body{width: 1200px; margin: 0 ; background: url(/UI/Skins/default/Images/background.png) top center no-repeat; }
.container{width: 1060px; margin:0 auto; padding: 5px 0 0 0;}
.leftbox, .midbox {float:left;}

/* Header nav */
#header { height: 92px; background-color: white; width: 942px; padding: 5px 10px; margin: 0 auto 20px auto; background: url(/UI/Skins/default/Images/header_bg.png) top center no-repeat; }
#header h1{padding: 0;}
#header a { color: #2a575f; font-size: 14px; font-weight: bold; text-decoration: none;}
#header a:hover{color: #7f0f7f;}
#header ul.navigation {float: right; clear:right; width:auto;}
#header ul.navigation li.first { border: none;}
#header ul.navigation li {float: left; border-left: 1px gray solid; margin: 2px; padding: 0px 8px 0px 10px; color: #50757B;}

#content { padding: 0px 20px; margin: 0px 30px; }

#footer { height: 150px; background-color: #555; color: white; padding: 5px 0px; margin: 0px 30px 0 29px;}
#footer a { color: white;}
#footer h3{color:white; margin-top:5px;}



/* Begin Styles for Inner Page */
/* Inner Content page template styles */
#content_top{ margin: 0 auto;width: 940px; height: 10px; background: url(/UI/Skins/default/Images/content_top.png) top center no-repeat;}
#content_inner {margin: 0 auto;width: 940px; min-height: 600px; background: url(/UI/Skins/default/Images/content_inner.png) top center repeat-y;}
#main {  float: right; width: 625px; padding: 10px 20px 20px 30px; margin-right: 20px;}
#back_to_home {  float: right; width: 625px; padding: 10px 20px 20px 30px; margin-right: 20px;}
#side_nav { float: left; width: 234px; }
ul.sidebar{ border-top: 1px dotted gray;}
ul.sidebar li {padding: 6px 0 9px 25px; border-bottom: 1px dotted gray;}
ul.sidebar li a {padding: 0px 0 10px 40px; font-size: 14px; font-weight: bold; background: url(/UI/Skins/default/Images/arrow_dark.png) top left no-repeat;}
ul.sidebar li a:hover{ text-decoration: none; color: #005d52; background: url(/UI/Skins/default/Images/arrow_green.png) top left no-repeat;}

.datasnapshot{background: #ffffff; border-bottom: 1px solid #dbd4d4; height: 75px; margin: 0 1px 25px 1px; }
.calculator{padding: 60px 20px 5px 20px; background: url(/UI/Skins/default/Images/cost_calc.png) top center no-repeat; height: 215px; margin: 0 1px 0 1px}
.calculator h1{ color: white; font-size: 20px; }
#content_bottom{ margin: 0 auto;width: 940px; height: 10px; margin-bottom: 20px; background: url(/UI/Skins/default/Images/content_bottom.png) bottom center no-repeat;}

/* End Styles for Inner Page */

#logo { float: left;}

#login { float: right;border-top: 5px #1e759e solid;margin: 5px;padding: 10px 0px;height: 25px;}
#login input { background-color: #efefef;border: 1px solid #a08620;color: #a08620;}



/* Home page banner*/
#banner { height: 320px; background: url(/UI/Skins/default/Images/banner_bg.gif) top center no-repeat; margin: 5px 7px;padding-left: 15px;}
#banner p {margin: 15px;width: 290px;}
#banner #get_involved { margin: 20px 40px; }
#banner h2 {padding-top:10px;}

/* Home page sections */

#sections { height: 450px; position: relative;  }
#sections > li {width: 305px; height: 200px;float: left;margin: 15px 7px;position: relative;}

#sections dl {background: url(/UI/Skins/default/Images/section_top.png) top left no-repeat; position: relative;top: 10px;height: 140px;padding: 20px 10px;}
#sections dt { font-weight: bold;margin-left: 10px;padding: 0px 5px; font-size: 15px; border-bottom: 1px black solid; float: left;position: absolute;top: -15px;color: #2a575f;}
#sections dt div { padding: 5px;background-color: #fef8e7;float: left; border-top: 1px black solid; border-left: 1px black solid; border-right: 1px black solid;}
#sections dd.section_image {float: right;margin-top: 10px;}
#sections dd.section_content {}
#sections dd.section_content li { 	color: #780e78;}
#sections dd.section_err {}
#sections dd.section_err li { color: Red;}
#sections dd.section_more { position: absolute;bottom: 0px;left: 0px;right: 0px; background: url(/UI/Skins/default/Images/section_bottom.png) top left no-repeat; text-align: right;padding: 5px 5px;}
#sections dd.section_more a { color: white;padding: 2px 5px;font-size: 11px;}


#ambag_info { width: 400px;float: left;margin-left: 10px;}
#ambag_info dt {float:left;margin-right: 10px;}
#ambag_info dd {margin-bottom: 10px;float: left;width: 280px;}
#ambag_info #ambag_address { width: 240px;}

#footer ul.navigation { width: 180px;float: left;border-left: 1px solid #909090;border-right: 1px solid #909090;padding: 0px 30px;margin: 10px 20px;text-align: center;}
#footer ul.navigation li { float:left;width: 50%;text-align: left;}
#footer p#copyright { clear: left;border-top: 1px solid #909090;padding: 10px 10px;margin: 0px 30px;text-align: center;}

#sustainable_transportation { float: left;width: 300px;}
#sustainable_transportation li { float: left;width: 140px;}

/* General form styles */

.jbFormRowButton input[type="submit"], .jbFormRowButton  input[type="button"] {
   margin-top:15px;
}
.jbFormItemInput  input[type="submit"], .jbFormItemInput  input[type="button"] .jbFormItemInput  input[type="file"]{
   margin-left:10px;
   border: 1px solid blue;
}
.jbFormRow{
   padding:5px;
   display:block;
}
.odd , .odd input[readonly="readonly"]{
   background-color:#f4f4f4;
}
.odd.heading{
   background-color:#CCDDD7;
   font-weight:bold !important;
}

/* Begin companyinfo Styles */

#companyinfo { position: relative;}
#companyinfo h1 {padding: 5px 0 10px 0; line-height: 25px;}
#companyinfo div.assocUser {float: left;	width: 99%;margin: 15px 0px;}
#companyinfo div.assocUser dl {height: 300px;}
#companyinfo div.leftbox {width:150px}
#companyinfo div.midbox {width:350px; padding-top:19px;}
#companyinfo div.leftbox , #companyinfo div.midbox {margin-bottom:16px; line-height:16px;}
#companyinfo div.leftbox br , #companyinfo div.midbox br {margin-bottom:2px;}
#companyinfo div.leftbox a, #companyinfo div.midbox a {font-size:14px;}
#companyinfo div.leftbox.empty {float:none; margin-bottom:0px;}
#companyinfo div.midbox.empty {float:none; width:500px; padding-top:0px}

.jbFormTitle {}
.companyinfo_td {padding: 6px 0px 0px 6px;vertical-align: top;	text-align: left; min-height: 200px;}

table.listFilter{width: 75%;}
table.listFilter td input{width: 200px; }

/* User login styles*/
#login label {float: none;}
#login input {width: auto;}

/* User profile styles*/
label{float: left;min-width: 220px;}

.longerQuestion {}
.longerQuestion .jbFormRow{ clear: both;}
.longerQuestion .jbFormRow span.jbFormItemLabel {display: block;padding: 5px 10px 5px 0px;width: auto;float: left;}
.longerQuestion .jbFormRow span.jbFormItemInput {display: block;float: right;margin-right: 25px;padding: 5px 0px 0px 0px;}

.togglers {border-top:1px solid #DDDDDD; padding: 5px 0 0 0; background: url(/UI/Skins/default/Images/toggler_bg.gif) top left repeat-x;}
.togglers .jbFormRow span.jbFormItemInput{float: right; }
.togglers .jbFormRow { }

.indentQns { height: auto; } 
.indentQns .jbFormRow{ clear: both;}
.indentQns .jbFormRow span.jbFormItemLabel {display: block;padding: 5px 10px 5px 0px;width: 400px;float: left;margin-left: 15px;}
.indentQns .jbFormRow span.jbFormItemInput {display: block;float: right;margin-right: 25px;vertical-align: middle;}

.boxes{width: 1em;}

#submitbutton{margin-left: 120px;margin-top: 5px;width: 50px;}


.jbFormRowButton {list-style: none;}


.UserDisplayClass { position: relative; background-color: white;}
.UserDisplayClass div.jbFormTitle { font-weight: bold;margin-left: 10px;padding: 0px 5px;font-size: 15px;border-bottom: 1px black solid;float: left;position: absolute;top: -15px;}
.UserDisplayClass div.jbFormTitle { border-top: 1px black solid;border-left: 1px black solid;border-right: 1px black solid;padding: 5px;background-color: #fef8e7;float: left;}
.UserDisplayClass form.jbForm fieldset {border: 1px #dbd4d4 solid;padding: 5px;}
.UserDisplayClass form.jbForm fieldset legend {font-weight: bold;padding: 5px;}
.UserDisplayClass .jbFormRow { 	padding: 2px;}

.UserDisplayClass dt { font-weight: bold;margin-left: 10px;padding: 0px 5px;font-size: 15px;border-bottom: 1px black solid;float: left;position: absolute;top: -15px;color: #2a575f;}
.UserDisplayClass dt div { border-top: 1px black solid;border-left: 1px black solid;border-right: 1px black solid; padding: 5px;background-color: #fef8e7;float: left;}
.UserDisplayClass dd.UserDisplayClass_addlink {float: right;}
.UserDisplayClass span.jbFormItemLabelNote {width: auto;}

.legend { width: 75%; padding: 10px 0 5px 0; font-size: 90%;}
.legend li {display: inline;list-style: none;padding-left: 5px;padding-right: 5px;}
.legend img {vertical-align: middle;}

.jbGrid > thead > tr > th {font-weight: bold;}
.jbGrid td{padding: 5px !important;}
.jbGrid{width:100%;}

/* begin error display styles */

#loginbox #errmsg{ margin: 0px 0px;padding: 0px;border: none;}
#errmsg { position: relative;border: 1px solid Red;background-color: white;padding: 2px;margin-top: 10px;color: Red;}
#errmsg ul li{ color: Red;padding: 2px;margin: 2px;}
#errmsg h1 { color: Red; padding: 2px; margin: 2px; font-size: 100%;}
.drawLine {border-top: 1px solid #DDDDDD;}

.TTtable {padding: 2px 2px 2px 0px;}
.TTtable tr th, .TTtable .odd.heading {padding: 2px 16px 2px 0px;font-weight: bold;text-align: left; color: #005d52;}
.TTtable tr td {padding: 1px 16px 1px 0px; vertical-align: middle; text-align: center;}
.TTtable tr td select {border: 1px solid black;}
.TTtable input, .TTtable select {margin:0px;}
.TT_readonly {border: none;background-color: inherit;}
.TT_highlightRow {background-color: #EDEDED;}
.TT_highlightRow input {background-color: #EDEDED;}
.TT_highlightRow.odd {background-color: #dDdDdD;}
.TT_highlightRow.odd input {background-color: #dDdDdD;}
.TT_submitbtn {cursor:pointer;border: none;background-color: inherit; text-decoration: underline;font-size: 100%;vertical-align: top; padding:0px; margin:0px;}

.TTREPtable {padding: 2px;}
.TTREPtable tr th , .TTREPtable .odd.heading{padding: 2px;font-weight: bold;text-align: left; color: #005d52; width: 10%;}
.TTREPtable tr td {padding: 1px 5px; vertical-align: middle; text-align: left; width: 10%;}
.TTREPtable td{border-right: 1px solid #CCDDD7;}
.TTREPtable td.last{border:0px none;}

.TTApproveTable {padding: 2px 2px 2px 0px;}
.TTApproveTable tr th , .TTApproveTable .odd.heading{padding: 2px 24px 2px 0px;font-weight: bold;text-align: left; color: #005d52;}
.TTApproveTable tr td {padding: 1px 24px 1px 0px; vertical-align: middle; text-align: left;}
.TTApproveTable tr td select {border: 1px solid black;}


/* =calendar */
.eventscalendar {
   min-width:600px; 
   border-bottom:1px solid #CCDDD7;}
.eventscalendar thead th{ 
   padding:5px;}
.eventscalendar tbody th{ 
   padding:5px;
   background:#CCDDD7; }
.eventscalendar tr td{
   vertical-align:top; 
   width:90px; height:90px;
   padding:5px;
   border-left: 1px solid #CCDDD7;}
.eventscalendar tr td.last{ 
   border-right: 1px solid #CCDDD7;}
.eventscalendar tr td.today{
   border:2px solid #CCDDD7;
   background:#f5f9f7;
}
.eventscalendar tr.odd td.today{
   background:#e0ebe7;
}
.eventscalendar .calendar-day{ 
   position:relative; 
   left:-5px; top:-5px; 
   float:left;
   width:14px; padding:4px; 
   text-align:center;
   border-bottom:1px solid #CCDDD7;
   border-right:1px solid #CCDDD7;
   background: #fafafa;}
.eventscalendar .odd .calendar-day{
   background: #eaeaea;
}
.eventscalendar .today .calendar-day{
   top:-7px; left:-6px;
   background:#CCDDD7;
}
.eventscalendar .calendar-event{
   font-size:10px;
   line-height:10px;
}


/**
  * Bar Graph (on the home page right now, but maybe we'll do other graphs)
  * graph placement, 
  * these probably shouldn't be edited
  */

/**
  * example heights settings
  * these should be replaced by a javascript call
  */  

#graph1  .resizable-bar{
  height:60%;}
#graph2  .resizable-bar{
  height:30%;}  
#graph3  .resizable-bar{
  height:99%;}

div#graph-container{
	margin-top: 10px;}
	
div#graph-and-text{
	padding: 0px 0px 8px 10px;
	border: 1px solid;
	background-color:#ffffff;
	margin-bottom: 10px;
	width: 356px; }
	
div#graph-and-text h3{font-size: 14px; color:#780E78;}
	
div.graph{
  float:left; position:relative; height:63px; margin-bottom:15px;
  font-family:Arial, sans-serif;  font-size:10px;}

div.graph ul{
  float:left; height:100%;
  border-right:1px solid #adaaad;
  margin:0px; padding:0px;}
div.graph ul li{
  position:relative;  right:-5px;  text-align:right;
  list-style:none;  padding:4px 0px 3px;}
div.graph ul li span{
  color:#adaaad; font-size:11px; margin-left:4px;}
div.graph .number-caption{
  float:left; position:relative; top:50%; 
  margin-top:-20px; padding-left:3px;}
div.graph .number-caption span{
  max-width:55px; margin-top:3px; line-height:9px;
  text-align:center; display:block;}
div.graph .number-caption div{
  color:#29555a; font-size:18px; font-family:Georgia, Arial, serif;}
div.graph .bottom-type-caption{
  clear:both; border-top:1px solid #adaaad; 
  text-align:center; padding:0px 20px 0px 14px;}  
  
div.graph .bar-container{
  float:left;  position:relative; top:0px;
  width:14px;  height:100%; margin-left:6px;}
div.graph .bar-container .resizable-bar{
  width:100%; position:absolute;  bottom:0px;
  background-color:#b5d35a;}

#graph1 .bottom-type-caption{padding:0px 30px 0px 24px;}  
#graph2 .bottom-type-caption{padding:0px 10px 0px 10px;}  
#graph3 .bottom-type-caption{padding:0px 24px 0px 10px;}  
  
/*
** larger graph mods
*/

.graph.big{ /* set height here to be 56 + the padding on the mid-mark*/
   height:136px; margin: 20px 10px 110px 10px;}
div.graph.big .mid-mark{ /*use this guy to set overall height of the rule*/
   padding:40px 0;}
div.graph.big .bar-container{ /*set the width of each bar*/
  width:70px;}

  /*bar colors*/
div.graph.big .b1 .resizable-bar, div.graph.big li.b1 span{
   background-color:#e5efc4;}
div.graph.big .b2 .resizable-bar, div.graph.big li.b2 span{
   background-color:#d3e59c;}
div.graph.big .b3 .resizable-bar, div.graph.big li.b3 span{
   background-color:#b5d35a;}

 /*graph legend set up*/
div.graph.big ol li {
   padding:2px;}
div.graph.big ol li span{
   height:12px; width:12px; position:relative; top:3px;
   display:inline-block; border:1px solid gray; margin-right: 5px; }
div.graph.big ol{
   list-style:none; text-align:left; border:1px solid #cccccc; 
   display:inline-block; padding:6px; margin-left:20px; margin-top: 10px;}

.each-graph {}
  
 #banner-text-background{background-color:#fff7e7;width:370px;
 	border-right:solid 1px;
	position:relative; top:4px;height:313px;
	padding-right:10px;}
div#sustainability {text-align: center;}

/* End bar graph styles */
/* End bar graph styles */
/* End bar graph styles */

.non-clearing-br br {clear: none;}

/* Activity Report Styles */

.ARtable {padding: 2px;}
.ARtable tr td {padding: 1px 16px 1px 0px; vertical-align: middle; text-align: left;}