/*########## INSTRUCTIONS ##########
1. comments that start with constant: indicate colors that don't change among the color schemes
2. comments with the words lighter or darker indicate the colors that do change depending on the color scheme
For example using the blue color sheme, darker means use the darker blue and lighter means use the lighter blue
3. ems are used as the unit of measurement to maintain proportional sizing which is important for 508 compliance

/*########## BLUE COLOR SCHEME ##########
 #475B82 = darker blue
 #6E81A6 = lighter blue

/*########## GREEN COLOR SCHEME ##########
 #6A8989 = darker green
 #98B7B7 = lighter green
 
/*########## PURPLE COLOR SCHEME ##########
 #797C9C = darker purple
 #9FA2BA = lighter purple
 
/*########## TAN COLOR SCHEME ##########
 #706C60 = darker tan
 #B3AE9C = lighter tan
 
/*########## GRAY COLOR SCHEME ##########
 #838386 = darker gray
 #AAAAAB = lighter gray

/*########## COMMON AMONG ALL COLOR SCHEMES ########## 
 #A90101 = red
 #5C5C5C = dark gray
 #CCCCCC = medium gray
 #F4F4F5 = light gray
 #FFFFFF = white
 #000000 = black
*/

body{
  margin:0; 
  padding:0;
}

/*###############
HDR AND FTR BEGINS 
###############*/
.hdrBG{ /* for the cell that contains the required cancer.gov header */
  background-color:#A90101; /* constant: red */
}
.subhdrBG{ /* for the cell that contains the application header */
  background-color:#6E81A6; /* lighter */
  border-left:1px solid #CCCCCC; /* constant: medium gray */
  border-right:1px solid #CCCCCC; /* constant: medium gray */
  border-top:1px solid #CCCCCC; /* constant: medium gray */
}
.ftrTable{ /* for the table that contains the footer */
  padding-top:0.4em;
}

/*###############
MENU BEGINS 
###############*/
td.mainMenu{
  /*background-color:#5C5C5C; constant: dark gray */
  font-family:arial,helvetica,verdana,sans-serif;
  border-bottom:1px solid #CCCCCC; /* constant: medium gray */
  /* border:1px solid #CCCCCC; */ /* constant: medium gray */
}
td.mainMenuItem{ /* for the off state of the main menu (top) cells */
  font-size:0.6em;
  font-weight:bold;
  background-color:#5C5C5C; /* constant: dark gray */
  padding-left:1em;
  padding-right:1em;
}
td.mainMenuItemOver{ /* for the over state of the main menu (top) cells */
  font-size:0.6em;
  font-weight:bold;
  background-color:#838386; /* darker */
  padding-left:1em;
  padding-right:1em;
}
td.footerMenu{ /* for the basic style of the footer menu (bottom) area */
  background-color:#5C5C5C; /* constant: dark gray */
  font-family:arial,helvetica,verdana,sans-serif;
  border-top:1px solid #CCCCCC; /* constant: medium gray */
  border-bottom:1px solid #CCCCCC; /* constant: medium gray */
}
td.footerMenuItem{ /* for the off state of the footer menu (bottom) cells */
  font-size:0.6em;
  font-weight:bold;
  background-color:#5C5C5C; /* constant: dark gray */
  padding-left:1em;
  padding-right:1em;
}
td.footerMenuItemOver{ /* for the over state of the footer menu (bottom) cells */
  font-size:0.6em;
  font-weight:bold;
  background-color:#838386; /* darker */
  padding-left:1em;
  padding-right:1em;
}
td.subMenu{ /* for the basic style of the sub-menu area */
  background-color:#6E81A6; /* lighter */
  font-family:arial,helvetica,verdana,sans-serif;
}
td.subMenuPrimaryTitle{ /* for the title elements of the sub menu (left-side) */
  font-size:0.6em;
  font-weight:bold;
  padding-left:0.8em;
  background-color:#5C5C5C; /* constant: dark gray */
  color:#FFFFFF; /* constant: white */
  border-top:1px solid #CCCCCC; /* constant: medium gray */
  border-bottom:1px solid #CCCCCC; /* constant: medium gray */
  border-right:1px solid #CCCCCC; /* constant: medium gray */
}
td.subMenuPrimaryItems{ /* for the items under the sub-menu title elements */
  font-size:0.6em;
  background-color:#FFFFFF; /* constant: white */
  font-weight:bold;
  padding-top:0.8em;
  padding-bottom:0.8em;
  padding-left:0.3em;
  border-right:1px solid #CCCCCC; /* constant: medium gray */
}
td.subMenuSecondaryTitle{ /* for the off state of the cell for the elements (usually common among pages) below the primary items */
  font-size:0.6em;
  font-weight:bold;
  padding-left:0.8em;
  background-color:#6E81A6; /* lighter */
  color:#FFFFFF; /* constant: white */
  border-bottom:1px solid #CCCCCC; /* constant: medium gray */
  border-right:1px solid #CCCCCC; /* constant: medium gray */
}
td.subMenuSecondaryTitleOver{ /* for the over state of the cell for the elements (usually common among pages) below the primary items */
  font-size:0.6em;
  font-weight:bold;
  padding-left:0.8em;
  background-color:#838386; /* darker */
  color:#FFFFFF; /* constant: white */
  border-bottom:1px solid #CCCCCC; /* constant: medium gray */
  border-right:1px solid #CCCCCC; /* constant: medium gray */
}
td.subMenuFill{ /* for the empty cell below the sub-menu items */
  border-right:1px solid #CCCCCC; /* constant: medium gray */
}
td.subMenuFooter{ /* for the last row in the submenu left of the footer menu */
  font-size:0.6em;
  font-weight:bold;
  padding-left:0.8em;
  background-color:#5C5C5C; /* constant: dark gray */
  color:#FFFFFF; /* constant: white */
  border-top:1px solid #CCCCCC; /* constant: medium gray */
  border-bottom:1px solid #CCCCCC; /* constant: medium gray */
  border-right:1px solid #CCCCCC; /* constant: medium gray */
}

/*############### 
LINKS BEGIN 
###############*/
a:link,a:visited,a:active{ /* default links */
	color:#000000; /* constant: black */
	text-decoration:underline;	
	white-space: nowrap;
}
a:hover{
	color:#A90101; /* constant: red */
}
a:link.subMenuPrimary,a:visited.subMenuPrimary,a:active.subMenuPrimary{ /* for the text links in the primary submenu */
	color:#5C5C5C; /* constant: dark gray */
	text-decoration:underline;	
	white-space: nowrap;
}
a:hover.subMenuPrimary{
	color:#A90101; /* constant: red */
}
a:link.subMenuSecondary,a:visited.subMenuSecondary,a:active.subMenuSecondary{ /* for the text links under the secondary submenu (quick links area) */
	color:#FFFFFF; /* constant: white */
	text-decoration:none;	
	white-space: nowrap;
}
a:hover.subMenuSecondary{
	color:#FFFFFF; /* constant: white */
}
a:link.mainMenuLink,a:visited.mainMenuLink,a:active.mainMenuLink{ /* for the text links in the main menu */
	color:#FFFFFF; /* constant: white */
	text-decoration:none;
	white-space: nowrap;
}
a:hover.mainMenuLink{
	color:#FFFFFF; /* constant: white */
}
a:link.footerMenuLink,a:visited.footerMenuLink,a:active.footerMenuLink{ /* for the text links at the top of the footer */
	color:#FFFFFF; /* constant: white */
	text-decoration:none;
	white-space: nowrap;
}
a:hover.footerMenuLink{
	color:#FFFFFF; /* constant: white */
}
a:link.dataPagingLink,a:visited.dataPagingLink,a:active.dataPagingLink{ /* for the previous and next links for the paging areas */
	color:#5C5C5C; /* constant: dark gray */
	text-decoration:underline;
	white-space: nowrap;
}
a:hover.dataPagingLink{
	color:#A90101; /* constant: red */
	text-decoration:underline;
}

/*############### 
FORM BEGINS 
###############*/
.formRequiredNotice{ /* for the asterisk cell */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:1em;
  background-color:#F4F4F5; /* constant: light gray */
  color:#000000; /* constant: black */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
}
.formRequiredLabel{ /* for the required form labels */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  font-weight:bold;
  background-color:#F4F4F5; /* constant: light gray */
  color:#000000; /* constant: black */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
	text-align:right;
}
.formRequiredLabelV2{ /* for the required form labels */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  font-weight:bold;
  background-color:#F4F4F5; /* constant: light gray */
  color:#000000; /* constant: black */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */  
	text-align:right;
}
.formLabel{ /* for the non-required form labels */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  background-color:#F4F4F5; /* constant: light gray */
  color:#000000; /* constant: black */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
  text-align:right;
  padding: 0.1in 0 0.1in 0;
}
.formLabelCenter{ /* for the non-required form labels */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  background-color:#F4F4F5; /* constant: light gray */
  color:#000000; /* constant: black */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
	text-align:center;
}
.formTitle{ /* for header cells (top) of forms */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.8em;
  font-weight:bold;
  padding-left:0.8em;
  background-color:#5C5C5C; /* constant: dark gray */
  color:#FFFFFF; /* constant: white */
  border-top:1px solid #5C5C5C; /* constant: dark gray */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
}
td.formField{ /* for the cell that contains the form elements */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  color:#000000; /* constant: black */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
  background-color:#F4F4F5; /* constant: light gray */
  padding: 0.1in 0 0.1in 0.1in;
}

td.formFieldLeftBorder{ /* for the cell that contains the form elements */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  color:#000000; /* constant: black */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
  background-color:#F4F4F5; /* constant: light gray */
  border-left:1px solid #5C5C5C;
}

td.formFieldNoBorder{ /* for the cell that contains the form elements */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.8em;
  color:#000000; /* constant: black */
  background-color:#F4F4F5; /* constant: light gray */
}


td.formFieldLogin{ /* for the cell that contains the form elements */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  color:#000000; /* constant: black */
}
input.formField,textarea.formField,select.formField{ /* for the form elements themselves (on elements) */
  font-family:arial,helvetica,verdana,sans-serif;
  border:1px solid #5C5C5C; /* constant: dark gray */
  font-size:1em;
}
input.formFieldSized,textarea.formFieldSized,select.formFieldSized{ /* for the form elements themselves and with a constant width (on elements) */
  font-family:arial,helvetica,verdana,sans-serif;
  border:1px solid #5C5C5C; /* constant: dark gray */
  font-size:1em;
	width:25em;
}
input.formFieldSized1,textarea.formFieldSized1,select.formFieldSized1{ /* for the form elements themselves and with a constant width (on elements) */
  font-family:arial,helvetica,verdana,sans-serif;
  border:1px solid #5C5C5C; /* constant: dark gray */
  font-size:1em;	
}
input.actionButton{ /* optional style for form and action buttons */
  border-right:2px solid #5C5C5C; /* constant: dark gray */
  border-bottom:2px solid #5C5C5C; /* constant: dark gray */
  border-top:1px solid #CCCCCC; /* constant: medium gray */
  border-left:1px solid #CCCCCC; /* constant: medium gray */
}
.formMessage{ /* for messages above the form */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:1.0em;
  color:#000000; /* constant: black */
}
.formDescription{ /* for messages above the form */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:1.0em;
  color:rgb(51,51,153); /* constant: black */
}
.normalForm{ /* for a general form in a content page */
  border:1px solid #5C5C5C; /* constant: dark gray */
}

/*############### 
SIDEBAR BEGINS 
###############*/
.sidebarSection{ /* for the individual sidebar sections */
  background-color:#F4F4F5; /* constant: light gray */
  font-family:verdana, arial, helvetica, sans-serif;
  font-size:0.7em;
}
.sidebarTitle{ /* for the titles of the individual sidebar sections */
  font-size:1em;
  font-weight:bold;
  padding-left:0.8em;
  background-color:#5C5C5C; /* constant: dark gray */
  color:#FFFFFF; /* constant: white */
}
.sidebarContent{ /* for the areas under the sidebar titles and requires text */
  font-size:1em;
  padding:0.8em;
  border-left:1px solid #CCCCCC; /* constant: medium gray */
}
.sidebarLogin{ /* for the sidebar login cells */
  font-size:0.7em;
  padding-left:0.8em;
}

/*###############
DATA TABLE BEGINS 
###############*/
.dataTablePrimaryLabel{ /* for the first row */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.8em;
  font-weight:bold;
  background-color:#5C5C5C; /* constant: dark gray */
  color:#FFFFFF; /* constant: white */
  border-top:1px solid #5C5C5C; /* constant: dark gray */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  padding-left:0.4em;
}
.dataTableSecondaryLabel{ /* for the optional second row */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  font-weight:bold;
  background-color:#CCCCCC; /* constant: medium gray */
  color:#5C5C5C; /* constant: dark gray */
  border-top:1px solid #5C5C5C; /* constant: dark gray */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  padding-left:0.4em;
}
.dataTableHeader{ /* for the horizontal column headers */
  font-family:arial,helvetica,verdana,sans-serif;
  background-color:#CCCCCC; /* constant: medium gray */
  color:#000000; /* constant: black */
  font-weight:bold;
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
}
.dataTable{ /* for the main table below the labels */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  color:#000000; /* constant: black */
  border-top:1px solid #5C5C5C; /* constant: dark gray */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
}
.dataRowLight{ /* for the light color of alternating rows */
  background-color:#FFFFFF; /* constant: white */
  color:#000000; /* constant: black */
}
.dataRowDark{ /* for the dark color of alternating rows */
  background-color:#F4F4F5; /* constant: light gray */
  color:#000000; /* constant: black */
}
.dataCellText{ /* for text output cells */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
  text-align:left;
}
.dataCellNumerical{ /* for numerical output cells */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-bottom:1px solid #5C5C5C; /* constant: dark gray */
  text-align:right;
}
.dataPagingSection{ /* for the cell that contains the paging table */
  border-right:1px solid #5C5C5C; /* constant: dark gray */
  border-top:1px solid #5C5C5C; /* constant: dark gray */
  border-left:1px solid #5C5C5C; /* constant: dark gray */
  background-color:#F4F4F5; /* constant: light gray */
}
.dataPagingText{ /* for the cells that contain the paging text */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  font-weight:bold;
  color:#5C5C5C; /* constant: dark gray */
  padding-right:0.5em;
  padding-left:0.5em;
}
.actionSection{ /* for the cell that contains the action buttons table */
  /*border-left:1px solid #5C5C5C; /* constant: dark gray */
  /*border-right:1px solid #5C5C5C; /* constant: dark gray */
  /*border-bottom:1px solid #5C5C5C; /* constant: dark gray */
}

/*###############
STANDARD CONTENT BEGINS 
###############*/
table.contentPage{ /* for overall top style for a content page */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:1em;
  color:#000000; /* constant: black */
  border-left:1px solid #CCCCCC; /* constant: light gray */
  border-right:1px solid #CCCCCC; /* constant: light gray */
}
table.contentBegins{ /* for overall top style for first cell in content area (not home page) */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:1em;
  color:#000000; /* constant: black */
  padding:1em;
}
h2,.h2{ /* for header of page */
  font-size:1.6em;
  font-weight:bold;
  color:#5C5C5C; /* constant: dark gray */
  text-align:center;
}
h3,.h3{ /* for title of page */
  font-size:1.3em;
  font-weight:bold;
}
p,.p{ /* for paragraphs */
  padding-left:1em;
}
.standardText{ /* for stand-alone text not affected by any cascading text styles */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  color:#000000; /* constant: black */
}

/*###############
MISCELLANEOUS BEGINS
###############*/
.bannerHome{ /* for the banner area of the home page */
  background-color:#475B82; /* darker*/
}
.txtHighlight{ /* adds emphasis to text */
  color:#A90101;
}
.welcomeTitle{ /* for titles of sections inside the content area */
  font-family:verdana, arial, helvetica, sans-serif;
  font-size:0.7em;
  font-weight:bold;
  padding-left:1em;
  background-color:#CCCCCC; /* constant: medium gray */
  border-top:1px solid #CCCCCC; /* constant: medium gray */
}
.welcomeContent{ /* for the area below the title content of the home page */
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;
  padding:1em;
  line-height:1.5em;
}
img.img{ /* for images that need a border */
  border:1px solid #5C5C5C; /* constant: dark gray */
}

.validationError{
  color:#A90101;
  font-family:arial,helvetica,verdana,sans-serif;
  font-size:0.7em;  
}

.accountStatusDiv{
  background-color: InactiveCaptiontext;
  position:absolute;
  left:300px;
  top:150px;
  border: 2px solid black;
  padding:50px;
  z-index:1000;
  font-size:100%;
  color:ActiveCaption;
  width:400px;
}

.hideDiv{margin: 0px 5px 0px 5px;display: none;width:100%;}