@charset "utf-8";
/* CSS Document */
@media all{
.debug{
margin: 10px;
padding: 10px;
background-color: #EEEEEE;
border: 1px solid gray;
font-size: 1.5em;

}
.debug:before{
content: "Debug";
display: block;
font-size: 1.5em;
}


body{
margin: 20px;
font-family: Verdana, Arial, Helvetica, sans-serif;
font-size: 100%;
font-size: 0.8em;
}
.clearing{
clear: both;
height: 10px;
margin-bottom: -10px;
}
a img{
border: none;
}
sup{
font-size: 0.7em;
vertical-align: middle;
position: relative;
top: -0.6em;
}
table{
border-collapse: collapse;
}
tr{
}
td{
padding: 5px 0;
}
.contentWrapper{
width: 800px;
margin: 0 auto;
background-color: #EBEEDD;
border: 1px solid #AEB988;
padding: 0 20px 10px 20px;
}
#header_top{
float: left;
height: 69px;
width: 840px;
margin: 0 -20px;
background: url(../images/header_top_en.jpg) no-repeat;
}
[lang="fr"] #header_top{
background: url(../images/header_top_fr.jpg) no-repeat;
}
#header_bottom{
float: left;
height: 129px;
width: 840px;
margin: 0 -20px 1em -20px;
background: url(../images/header_bottom.jpg) no-repeat;
}
form{
}
h1{
font-size: 2.6em;
font-weight: normal;
margin: 10px 0 15px 0;
color: #587133;
}
h2{
font-size: 1.8em;
font-weight: normal;
margin: 15px 0 5px 0;
}
h3{
font-size: 1.3em;
font-weight: bold;
color: #444444;
margin: 10px 0 0 0;
}
h4{
font-size: 1em;
font-weight: bold;
color: #222222;
margin: 10px 0 0 0;
}

.inputWrapper, .dataWrapper{
margin: 0.5em 0;
}
.inputWrapper .label, .inputWrapper .units{
padding-top: 0.25em;
}
.label{
float: left;
width: 360px;
}
[lang="fr"] .label{
width: 340px;
}
.value{
float: left;
text-align: right;
padding: 0 2px;
width: 92px;
}
.value input{
float: right;
text-align: right;
width: 60px;
}
#policyFilterForm .value{
text-align: right;
padding: 0 2px;
width: 80px;
}
#policyFilterForm .value input{
text-align: right;
width: 52px;
}
.units{
float: left;
margin-left: 5px;
}

.policyFilterCriteria td{
padding-right: 20px;
}
.policyFilterOperatorWrapper{
margin: 1em 0;
}

.pavementStructure{
margin-top: 0.5em;
}
.pavementStructure th{
font-weight: normal;
text-align: left;
}
.pavementStructure th.col1{
text-align: left;
}
.pavementStructure .col1{
width: 160px;
}
.pavementStructure td.col2, .pavementStructure td.col4, .pavementStructure td.col6, .pavementStructure td.col8{
text-align: right;
}
.pavementStructure .col2, .pavementStructure .col4, .pavementStructure .col6, .pavementStructure .col8{
padding: 0 10px 0 20px;
}

.leftColumn{
width: 390px;
float: left;
clear: left;
}
.rightColumn{
width: 390px;
float: right;
}
.columnsWrapper{
margin-bottom: 1em;
}

.filterOperator{
width: 175px;
padding: 0 0 0 10px;
}
.filterField select{
width: 180px;
}

#fuelUsage td{
font-size: 0.8333em;
}
#fuelUsage th{
font-weight: normal;
}
.fuelUsageCol1{
text-align: left;
padding-right: 30px;
}
.fuelUsageCol2, .fuelUsageColSeperator, .fuelUsageCol3{
text-align: center;
}
.fuelUsageColSeperator{
padding-left: 10px;
padding-right: 10px;
}

#costFilterForm .filterField{
width: 175px;
}
#costFilterForm .filterValue, #costFilterForm .filterValue input{
text-align: right;
}
#costFilterForm .filterValue{
padding-right: 10px;
}
input[type="submit"]{
margin: 0 0 0 auto;
}

.message{
margin: 10px;
padding: 10px;
color: #A98710;
background-color: #FEF4CD;
border: 1px solid #F0CD09;
}
.error{
color: #B10505;
background-color: #F5D9D3;
border-color: #A22B2B;
}

#tooltip {
position: absolute;
z-index: 3000;
border: 1px solid #111;
background-color: #eee;
padding: 5px;
opacity: 0.85;
font-size: 0.7em;
width: 200px;
}
#tooltip h3, #tooltip div { margin: 0; }
#tooltip p{
margin: 0.5em 0;
}

#help{
display: none;
}

#resultsPage th, #resultsPage td{
text-align: center;
padding: 5px 5px;
}
#resultsPage th{
color: #666666;
}

#resultsPage .fuelCostSavings td, #resultsPage .fuelCostSavings th{
text-align: right;
}

#resultsPage .fuelCostSavings th.col1{
text-align: left;
}
#resultsPage .fuelCostSavings table{
width: 390px;
}
#resultsPage h2{
padding-top: 1em;
border-top: 1px solid #AAAAAA;
margin-top: 1em;
}
tr.rowTotal th, tr.rowTotal td{
border-top: 1px solid #BBBBBB;
}
.provinceRadio{
margin: 2px 0;
}
.provinceRadio span{
position: relative;
top: -4px;
}
.navButtons{
margin-bottom: 60px;
}
.navButtons input[name="back"]{
float: left;
}
.navButtons input[name="submit"]{
float: right;
}
label.required{
font-weight: bold;
}
#loginForm label, #registerForm label{
float: left;
width: 170px;
}
#loginForm label.noFloat{
float: none;
width: auto;
}
.note{
font-size: 0.9em;
font-style: italic;
}
div.helpref{
float: left;
margin: 0 3px 0 0;
}

#utilMenu{
list-style-type: none;
margin: 43px 0 0 0;
padding: 0 0 0 48px;
float: right;
background: url(../images/menu_bg.gif) left no-repeat;
}
#utilMenu li{
background: url(../images/menuitem_bg.gif) repeat-x;
float: left;
height: 20px;
padding: 6px 7px 0 7px;
}
#utilMenu li.item1{
padding-left: 0;
}
#utilMenu a{
color: white;
font-weight: bold;
font-size: 9px;
font-family: Verdana, Arial, Helvetica, sans-serif;
text-decoration: none;
}
#utilMenu a:hover{
color: #CCCCCC;
}

#userManager{
font-size: 0.7em;
}
#userManager td, #userManager th{
padding: 2px 4px;
border-bottom: 1px solid black;
}
#userManager th a{
text-decoration: none;
}
#userManager th{
font-size: 1em;
white-space: nowrap;
vertical-align: middle;
}
#userManager th img{
width: 12px;
height: 12px;
}

#costFilterForm .label{
width: 270px;
}

#resultsPage .costData th, #resultsPage .costData td{
text-align: right;
padding: 4px 10px;
border: 1px solid black;
}

h2.sliderHeader a, h2.sliderHeader a:visited{
text-decoration: none;
color: #0000EE;
}

#inputsSummary h4{
padding: 0 0 0 5px;
}
#inputsSummary ul{
list-style-type: none;
margin: 0;
padding: 0;
}
#inputsSummary li{
padding: 5px;
}
#inputsSummary strong{
color: #666666;
}
#inputsSummary th{
font-weight: bold;
color: #666666;
}
#inputsSummary .col1{
text-align: left;
}

#resultsPage #inputsSummary .col1, #resultsPage #inputsSummary .col2, #resultsPage #inputsSummary .col3, #resultsPage #inputsSummary .col4, #resultsPage #inputsSummary .col5{
width: auto;
padding: 4px 10px;
}

.subHeading{
font-size: 1.2em;
font-style: italic;
}

#settingsForm .label{
width: 220px;
}
#settingsForm .value{
width: auto;
}

.pavementStructure .col2{
width: 89px;
}
.pavementStructure .col3{
width: 27px;
}
.pavementStructure .col4{
width: 89px;
}
.pavementStructure .col5{
width: 44px;
}
.pavementStructure .col6{
width: 89px;
}
.pavementStructure th{
font-weight: bold;
text-align: center;
}

#policyFiltersForm .label{
width: 180px;
font-weight: bold;
}
#policyFiltersForm input[type="text"]{
width: 75px;
}
#policyIntro, #costIntro{
margin-top: -0.5em;
} 
.warning{
margin: 2px 0;
}
.warning img{
position: relative;
top: 2px;
margin-right: 4px;
}

#loginForm input[type="text"], #loginForm input[type="password"], #registerForm input[type="text"]{
width: 150px;
}

#settingsForm input[type="text"], #settingsForm input[type="password"]{
width: 150px;
}
}

@media print{
#utilMenu{
display: none;
}
.columnsWrapper{
page-break-inside: avoid;
}
h1{
margin-top: 1em;
}
h2.sliderHeader a, h2.sliderHeader a.visited{
color: black;
}
h2.sliderHeader img{
display: none;
}
.sliderContent{
display: block !important;
}
#header_top, #header_bottom{
display: none;
}
}
