/*
How to use this stylesheet:
--- Most elements will inherit their style automatically via the base values.
--- Use the extra styles as exceptions to the base styles when needed.
--- Specific classes get a proper name (such as OWA classes for Outlook Web Access).
HTML examples of correct usage:
Apply classes to the parent element only whenever possible.
Instead of:
|
Please keep this file neat n' tidy. If you need a style added, please ask Bree.
*/
/* BASE VALUES */
body {font-size: 9pt; color: #000000; font-family: Arial, Verdana, Helvetica, Sans-Serif; background-color: #94b7db; border-left: 0px; border-right: 0px; border-top: 0px;}
table {font-size: 9pt; color: #000000; font-family: Arial, Verdana, Helvetica, Sans-Serif}
A {color: #003399; text-decoration: underline;}
A:hover {color: #000099; text-decoration: none;}
select, textarea {border: 1px solid #000099; background: #EFEFEF; font-size: 8pt; color: #000099;}
.input {border: 1px solid #000099; background: #EFEFEF; font-size: 8pt; color: #000099;}
hr {color: #333366; height: 1px; background-color: transparent;}
/* USE FOR ABBREVIATIONS & ACRONYMS */
/* to use, set title attribute of element. IRS */
abbr, acronym, .help {border-bottom: 1px dotted #333333; cursor: help;}
/* EXTRA STYLES ... Use these as exceptions to the base values */
.lighttext {color: #3399CC;}
.heavytext {color: #006699;}
.heavy {background: #336699; color: #FFFFFF;}
.heavy a {color: #FFFFFF; text-decoration: underline;}
.heavy a:hover {color: #FFFFDD; text-decoration: none;}
.heavy a:active {color: #FFFFFF; text-decoration: none;}
.light {background: #3399CC; color: #FFFFFF;}
.light a {color: #FFFFFF; text-decoration: underline;}
.light a:hover {color: #FFFFEE; text-decoration: none;}
.light a:active {color: #FFFFFF; text-decoration: none;}
/* This is the basic class to handle body text and body links */
body {font-size: 10pt; color: #000000; font-family: Arial, Verdana, Helvetica, Sans-Serif; background-color: #94b7db; border-left: 0px; border-right: 0px; border-top: 0px;}
body a:hover {color: #000000; font-family: Arial, Verdana, Helvetica, Sans-Serif; text-decoration: underline;}
body a:active {color: #000000; font-family: Arial, Verdana, Helvetica, Sans-Serif; text-decoration: underline;}
.texthead {font-size: 12pt; color: #003399; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
/* Created by Rich, The miniwhite is used for a smal href instance */
.white {color: #FFFFFF;}
.miniwhite {font-size: 8pt; color: #FFFFFF;}
/* Use the mini class for footers, captions, disclaimers and other tiny text */
.mini {font-size: 8pt; color: #000000;}
/* You'll need to make an exception for checkboxes and apply this style to them, because of how IE handles them in relation to CSS styles */
.check {border: 0px; background: transparent}
/* Use this class for HTML text subheads */
.header {font-size: 12pt; font-weight: bold;}
/* Use this class for grid headers */
.gridheader {color: #FFFFFF; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif; background-color: #333366}
.gridheader a {color: #FFFFFF; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.gridheader a:visited {color: #FFFFFF; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.gridheader a:hover {color: #CCCCCC; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.inverted {color: #FFFFFF; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif; background-color: #333366}
.inverted a {color: #FFFFFF; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.inverted a:visited {color: #FFFFFF; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.inverted a:hover {color: #CCCCCC; font-size: 10pt; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.inverted body {font-size: 10pt; color: #FFFFFF; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.inverted table {font-size: 10pt; color: #FFFFFF; font-family: Arial, Verdana, Helvetica, Sans-Serif}
.blueheader {font-weight: bold; font-size: 11pt; color: #333366; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.highlight {font-weight: bold; font-size: 10pt; color: orange; font-family: Arial, Verdana, Helvetica, sans-serif;}
/* Use this class for footer content */
.cbktfooter {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; padding: 3px 0px;}
.cbktfooter a {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;}
.cbktfooter a:visited {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;}
.cbktfooter a:hover {color: #CCCCCC; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;}
.cbwsfooter {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; padding: 3px 0px;}
.cbwsfooter a {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif;}
.cbwsfooter a:visited {color: #FFFFFF; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; }
.cbwsfooter a:hover {color: #CCCCCC; font-size: 10px; font-family: Verdana, Arial, Helvetica, sans-serif; }
/* Used for the quick search in the banner */
.qsinputcbkt {width: 75px; color: #333366; background-color: #FFFFFF; border: solid 1px; }
.qsinputcbwshome {width: 75px; color: #333366; background-color: #FFFFFF; border: solid 1px; }
.qsinputcbws {width: 125px; color: #333366; background-color: #FFFFFF; border: solid 1px thin; }
/* END EXTRA STYLES */
/* DATA ENTRY TABLES */
/* mike j - for data entry tables where you have a 2 column label/field setup */
/* example:
*/
.etable {}
.etable td {padding: 2px;}
.etable .label {text-align: right; padding-left: 5px; padding-right: 5px; white-space: nowrap;}
.etable .entrylg input {width: 300px;}
.etable .entrylg select {width: 300px;}
.etable .entrymd input {width: 200px;}
.etable .entrymd select {width: 200px;}
.etable .entrysm input {width: 100px;}
.etable .entrysm select {width: 100px;}
/* END DATA ENTRY TABLES */
/*
Use the repeated classes below to handle tables with repeating data. It's set up so you won't have to worry about
the alternating the presentation of the data. Here is an example of correct usage:
| Test | Test |
| Test | Test |
| Test | Test |
*/
.reptable {border: 1px solid #336699;}
.reptable .head td {color: #FFFFFF; background-color: #336699; padding-left: 4px; padding-right: 4px; padding-top: 2px; padding-bottom: 2px; font-weight: bold; border-right: 1px solid #6699CC;}
.reptable td {padding-left: 4px; padding-right: 4px; padding-top: 2px; padding-bottom: 2px; border-bottom: 1px solid #CCCCCC;}
.reptable .none td {border-bottom:none;}
/* The following class is similar to reptable, but lacks the bottom grey underline. You should use reptable for data, and repcopy for other stuff ... such as news headlines on the front page, etc ... non data elements that need to have a class applied. */
.repcopy {border: 1px solid #336699;}
.repcopy .head td {color: #FFFFFF; background-color: #336699; padding-left: 4px; padding-right: 4px; padding-top: 2px; padding-bottom: 2px; font-weight: bold; border-right: 1px solid #6699CC;}
.repcopy td {padding-left: 4px; padding-right: 4px; padding-top: 2px; padding-bottom: 2px; border-bottom: 1px solid #FFFFFF;}
.repcopy .none td {border-bottom:none;}
/* END REPEATER classes */
/* Outlook Web Access classes */
.owatable {color: #000000; text-decoration: none;}
.owatable td {color: #000000; text-decoration: none; padding-left: 5px; padding-right: 5px;}
.owatable .head {font-weight: bold; border-top: 1px solid #CCCCCC; border-bottom: 1px solid #CCCCCC; background-color: #EAEAEA;}
.owatable a {color: #003399; text-decoration: underline;}
.owatable a:hover {color: #000099; text-decoration: none;}
.owatable a:active {color: #990000; text-decoration: none;}
.owahead {color: #000000; font-size: 10pt; text-decoration: none; padding-left: 5px; padding-right: 5px; padding-top: 2px; padding-bottom: 2px; background-color: #CCCCCC; font-weight: bold;}
.owatable .pastevent, .owatable .pastevent a
{color: #999999; text-decoration: none;}
/* splash page promo box classes */
.promohead {color: #003366; text-decoration: none; font-weight: bold;}
.promotext {color: #000000; text-decoration: none;}
.promolink a {color: #003366; text-decoration: underline;}
.promolink a:hover {color: #006666; text-decoration: underline;font-size: 7pt;}
.promolink a:active {color: #000099; text-decoration: underline;font-size: 7pt;}
.blue {font-size: 9pt; color: #003399; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.white {font-size: 9pt; color: #FFFFFF; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.disclaimer {font-size: 8pt; color: #000000; font-style: italic; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.tiny {font-size: 8pt; color: #000000; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
.error {font-size: 9pt; color: red; font-family: Arial, Verdana, Helvetica, Sans-Serif;}
/* MapPoint Specific */
.BGColorMapBorder {background-color:#134B8E;}
.BGColorWin {background-color:white;}
.whitecopy {font-family: Arial, Verdana, sans-serif; color: #FFFFFF; font-size: 11px; font-weight: normal; text-decoration: none; letter-spacing: 1px; line-height: 16px;}
.whitecopylarge {font-family: Arial, Verdana, sans-serif; color: black; font-size: 14px; font-weight: bold; text-decoration: none;}
.redcopy {font-family: Arial, Verdana, sans-serif; color: #FF0000; font-size: 11px; font-weight: normal; text-decoration: none; letter-spacing: 1px; line-height: 16px;}
.landingTitle {font-family: Verdana, Arial, sans-serif; font-size:27; color: #333366;}