/* -------------------------------------------------------------------------

 *

 * main.css   Controls the ways that links appear on the pages.

 *  a. = anchor (a href...)  

 *  td. = class in a td cell

 *  li. = list item 

 * Colors: 

 

 This stylesheet controls the basic colors of the website.

 

 Places where basic colors need to be changed are marked with ^^^color^^^ 

 Do a SEARCH on the keyword ^^^color^^^ to see all the places you need to change.

 

 

*/



/* LINK NAVIGATION:  These need to appear first in the stylesheet ------------ */





a:hover {font-weight: bold;}



/* This is how a link shows up in body copy.  

   This (#0F4AAC) is a slightly darker variation of standard blue (#0000FF)  

   Most likely doesn't need to be changed unless a different look is desired. */

   

a:link.bodycopy, a:visited.bodycopy, a:active.bodycopy {color: #0F4AAC;} /* slightly darker blue */



a:link.menuNo, a:visited.menuNo, a:active.menuNo,

a:link.menuYes, a:visited.menuYes, a:active.menuYes, 

a:link.menuLine, a:visited.menuLine, a:active.menuLine, 

a:link.menuFoot, a:visited.menuFoot, a:active.menuFoot,

a:link.button, a:visited.button, a:active.button

{text-decoration: none;}



a:hover.button {color: white;}



/* ^^^color^^^   BACKGROUND COLOR SETTINGS  



  This section is VERY IMPORTANT in that it controls the main colors of all of the menu bars...

  The first section sets the BACKGROUND COLORS for various areas...

  

  BACKGROUND COLORS:

  -- You can move the "menu" items (menuHead, menuLine) to the 

  -- various color combinations to do different colors



  barColor: (Like the  is the TOP BAR & MENU BAR[home] [help] bar

  boxColor is the SIDE MENU BARS

  compColor is the complementary BAR color

  body is the background color...



 */

.barColor {background-color: #D8B466; } /* #598AC8;} */

.boxColor {background-color: #A1A1A2;}

.compColor {background-color: #D37C7C;}

.body, .bodycopy, .whiteSpace, .title {background-color: #FFFFFF;} /* sets background color for text areas */

.menuFoot, .menuLine {} /* just shows that no background is set... it uses the background of the overriding site. */

.formelement {background-color: #A3CEED;} 

.formlite {background-color: #BEF1C2;} 

span.button {background-color: #D8B466;} /* usually a darker version of formelement  */ 



/* SPAN BUTTON BORDER COLORS 

   The background-color is the basic start to the button color.  

   The border-color goes around the four sides of the button starting with the top then clockwise.  

   The top & last (first, fourth) are lighter colors.  The middle two are darker colors to create a shadow effect.

   The "lighter" color should be lighter than your backgournd color...

   You most likely only need to change the first and last to match your color scheme

   The middle two are a kind of "gray" that will work with most anything.

   The hover.button sets the color of the text when you hover over the button.

*/



/* FONT COLORS: This sets the COLOR for the various FONTS */

.bodycopy, .whiteSpace, .formelement { color: black;}

.welcome { color: black;}

.button, .title {color: #30203E;}

.menuNo {color: #FAFAFA; }	

.menuYes {color: #FFFF99; }

.menuFoot {color: #30203E; }	

.menuHead, .barColor {color: #30203E;}

.menuLine {color: #30203E;}

.formlite {color: gray;}	



span.button { 

  /* Typically right/bottom are your darkest color.  Left & top match and are a lighter version of comp color (or gray #CCCCCC)

  /* Background COLOR of button is set above  */

  border-color:#DADA8F  /* top (Usually a lighter version of the left side...)*/ 

               #7A123F  /* right  (Right & Bottom ususally match)*/

			   #7A123F  /* bottom (matches right)*/

			   #DADA8F; } /* left (Usually lighter Version) */ 



/* __________________________________________________________________________________________________________________________________*/

/* ALL COLORS ARE SET ABOVE THIS LINE.... ONLY FONT SIZE AND SPACING BELOW!!! */



/* This sets the font family and standard size for Standard TEXT (Verdana) fonts */

.bodycopy, .whiteSpace, .formelement, .formlite {

	font-family: Verdana, Arial, Swiss, helvetica, SunSans-Regular;

	font-size: 12px;

	line-height: 14px;}

	

.welcome {font-family: Verdana, Arial, Helvetica, sans-serif;

	font-size: 12px;

	line-height: 15px;}



/* This sets the font family and standard size for MENU fonts */



.menuLine, .menuHead, .menuNo, .menuYes, .menuFoot,

  .button, .title, .barColor {

	font-family: Arial, Swiss, Verdana, helvetica, SunSans-Regular;

	font-size: 12px;

	line-height: 14px;}

	

.menuNo {margin-left: 20px;}	

.menuYes {margin-left: 20px;}	

.menuHead {margin-left: 30px; line-height: 20px; font-weight: bold;}

.title {font-size: 26px; line-height: 40px;}

.whiteSpace {line-height: 5px;}	



span.button { 

  font-weight: bold;

  width:125px;

  text-align:center;

  padding:1px 2px;

  border-style:solid;

  border-width:3px;}



/*

L = Link

B = Background Color

F = Font Color

C = Font Characteristics

O = Other Characteristics



bodycopy   	LBFC	General Body copy

menuHead	FCO	Appears in left menu bar, heading of each section

menuLine	LBFC	Menu item that appears in the TOP menu line

menuNo		LFCO	Menu item that is NOT highlighted

menuYes		LFCO	Menu item that IS highlighted

menuFoot	LBFC	Menu item that appears in bottom left menu box

button		LBFCO



barColor	BFC		Used to determine the background color of the menu bars

boxColor	B		Used to determine the color of the biger menu box

compColor	B		Used to determine the color of the comp box in lower left.

body		B		General box

whiteSpace	BFCO	Small spacer

title		BFCO	Top of page section

formelement	BFC		In the form box

formlite	BFC		In the 'read-only' form box

welcome		FC		Special Welcome text



*/