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

 *

 * 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 and fonts of the eventCORE Web site.

 

 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 controls how links and body copy show up.  

   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: #CC9933;} /* #CC9933;} /* slightly darker blue */

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

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

a:link.menuLiner, 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.menuNo, a:hover.menuYes {color: #F4EDD1;}

a:hover.button {color: white;}





/* this makes sure all padding is out thru entire site */

BODY { padding: 0; margin: 0; }



/* Enhanced... this is used when the site is enhanced... 

  this keyword [enHanceD]  (H and D upper case) must appear in this style sheet...*/



#container {

	width: 900px; 

	text-align: left; 

	margin-right: auto; 

	margin-left: auto;

}

/*  end of enhanced section!!!! */



/* ^^^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 various items to their own line to give more control 



*/

BODY { background-color:  #FECA00;} /* sets the background color for page */

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

.barColor {background-color: #330000; } /* topMenu bar color */

.boxColor {background-color: #330000;} /* side menu bars (nav bars) */

.compColor {background-color: #330000;} /* lower left menu bar color */

.menuHead {background-color: #330000; } /* menu bars in left nav */

.cartBar {background-color: #FFFF99; } /* shopping cart header */

.bodyWhite {background-color:#FFFFFF } /* forces a white background */

.bodyLite {background-color: #FFFFCC } /* complementary alternate color for payment/cart ledger sheet look */

/* these can typically be set to no entry and it will use the underlying color */

.menuFoot {} /* these are the footer items at the bottom of the page */

.menuLine {} /* these set the items in the top bar and the progress bar */

.formelement {background-color: #FFFFCC;} /* standard form entry */

.formlite {background-color: #FFFFD5;} /* read only form entry */

span.button {background-color: #FFFF99;} /* 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.

*/



/* BORDER COLOR: This sets the COLOR for the BORDERS  (Used on cart pages, etc.) */

/* This tag is READ by siteSettings do NOT CHANGE SPACING! You MUST use six character color code! */

.borderColor { color: #A75C01;} 





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

.bodycopy, .smallText, .whiteSpace { color: #FFFFFF;}

.formelement, .formlite { color: #A75C01;}

.welcome { color: #FFFFFF;}

.bodyWhite {color:#000000 };

.button {color: #A75C01;}

.title {color: #A75C01;} 

.msgHead { color: #FF0000;}

.cartBar { color: #A75C01;}

.menuNo {color: #FFFF99; }	

.menuYes {color: #7A6D67; }

.menuFoot {color: #FFFFFF; }	

.menuHead, .barColor {color: #A75C01;}

.menuLine {color: #A75C01;} 

.menuLine a {color: #A75C01; text-decoration: none;} 

.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: #A75C01 /* top (Usually a lighter version of the left side...)*/ 

                #FFFF99  /* right  (Right & Bottom ususally match)*/

			    #FFFF99  /* bottom (matches right)*/

			    #A75C01CCCCCC; } /* 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, .smallText, .whiteSpace, .bodyWhite, .title {

	font-family: 'courier new', courier;

	font-size: 12px;

	line-height: 14px;}



.formelement, .formlite {

     font-family:Arial, Helvetica, sans-serif;

	 font-size:12px; }

	

.welcome  {font-family: 'courier new', courier;

	font-size: 15px;

	line-height: 18px;}

.smallText {font-size: 10px; line-height: 12px; }	

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

.whiteSpace {line-height: 5px;}	

	



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

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

  .button, .barColor, .cartBar {

  	font: 12px 'courier new', courier;}



.menuNo {margin-left: 20px; font-weight: bold;}	

.menuYes {margin-left: 20px; font-weight: bold;}	

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



span.button { 

  font-weight: bold;

  width:125px;

  text-align:center;

  padding:1px 2px;

  border-style:solid;

  border-width:3px;}