/* ==================================================================
 * this stylesheet is the main stylesheet for all sk8stuff pages
 * it is used in conjunction with common_style
 * and some specialty pages will use additional stylesheets
 * COLOR SCHEME:
 *   outside edge, dark headers:  #663300   dark brown
 *   masthead background:         #ffffc0   yellow
 *   highlightboxes, shaded       #ffffe0   light yellow
 *   medium headers               #eeeebb   heavier yellow
 *   light internal borders       #c0c0c0   grayish
 * ==================================================================
 */

/*
 ****************************************************
 * Page Structural Area Definitions
 * (to achieve centered fixed-width look,
 *   use margin: auto; width: 750px; in div#pageN)
 ****************************************************
 */

body { padding: 8px; margin: 0px; }
p { font-style: normal; }

div#pageN { 
   background: white;  
   margin: 1px;
   padding: 0px;
}
@media screen {
   body { background: white; }
   div#pageN { 
      border: 6px solid #663300; 
      width: 870px;
      margin: auto; 
     -moz-border-radius: 12px;
     -webkit-border-radius: 12px;
     border-radius: 12px; 
  }   
}

div#content {
   padding: 4px;
   margin-top: 5px;
}

/*
 ***************************************
 * rightcolnm is used for textual menus on right side of page
 * similar to rightcol on main page (this is slightly modified
 * though for non-main pages) 
 ***************************************
 */

div.rightcolnm {
	  float: right;
	  margin: 0px 0px 0px 12px;
	  padding: 4px 4px 4px 8px;
	  width: 210px;
	  border-left: 1px solid #663300;
	  border-bottom: 1px solid #663300;
	  background: #fffff0;
}
div.rightcolnm ul {
	margin-top: 2px;
	margin-bottom: 2px;
	margin-left: 1em;
	padding-left: 1em;                
}
@media screen {
   div.rightcolnm li { font-size: 10px; }
}
@media print {
   div.rightcolnm li { font-size: 8pt; }
}  

/*
 ***************************************
 * rightcolapp is used for textual menus on right side of 
 * the applause page.  similar to rightcol on michigan page 
 * but a little bit wider
 ***************************************
 */

div.rightcolapp {
	  float: right;
	  margin: 0px 0px 0px 12px;
	  padding: 0px 0px 4px 4px;
	  width: 280px;
	  border-left: 1px solid #663300;
	  border-bottom: 1px solid #663300;
	  background: #fffff0;
}
div.rightcolapp ul {
	margin-top: 2px;
	margin-bottom: 2px;
	margin-left: 0.95em;
	padding-left: 0.6em;      
}
div.rightcolapp h3 {
   margin-top: 0px;
   padding: 2px 4px;
   margin-left: -4px;
   display: block;
   background: #663300;
   color: white;
}
div.rightcolapp a:visited, div.rightcolapp a:link, div.rightcolapp a:hover { font-weight: normal;}
@media screen {
   div.rightcolapp li { font-size: 10px; }
}
@media print {
   div.rightcolapp li { font-size: 8pt; }
}      

/*
 ******************************************************************
 * masthead is the yellow area at the top of the page
 * it contains my picture, and the logo (Figure Skater's Website)
 * and the navmenu button area
 ******************************************************************
 */

div#masthead {
	width: 100%;
	padding-top: 4px;
	padding-bottom: 4px;            
	border-bottom: 2px solid #663300;
}

@media screen {
   span.logotextscreen, div.logotextscreen { font-size: 3em; color: #663300; font-weight: bold;}
   div.logotextprint, span.logotextprint { display: none }
   div#masthead { background: #ffffcc; }
}
@media print {
   div.logotextprint, span.logotextprint { 
      font-size: 12pt;
      color: #808080; 
      font-family: Verdana, Arial, Helvetica;
      width: 100%; 
      text-align: center; 
    }
   div.logotextprint .sml {
      text-align: left; float: left; width: 328px;
   }
   div.logotextprint .smr {
      text-align: right; float: right; width: 328px;
   }
   span.logotextscreen, div.logotextscreen { display: none }
   div#masthead { background: white; }
}


/*
 *************************************************************************
 * simplefoot is the white copyright text at the bottom of standard pages
 *************************************************************************
 */
 
div#simplefoot {
	margin-top: 3px;
	padding: 6px;
	clear: both;
	text-align: center;
	font-size: 0.75em;
	width: 865px;;
}
div#simplefoot a:link, div#simplefoot a:visited {
	color: #808080; 
	text-decoration: none;
}
div#simplefoot a:hover { font-weight: bold;}

@media screen {
	div#simplefoot { color: #808080; width: 870px; margin: auto; }
}
@media print {
	div#simplefoot { color: black; border-top: 1px solid black; }
}

/*
 ********************************************************************
 * navmenu is the "menupage links" in the top yellow area (masthead)
 ********************************************************************
 */

div.navmenu {
	color: #663300;                                          
	padding: 0px 4px 4px 4px;                                       
}                                     

div.navmenu ul {
   padding: 0px;
	margin: 0px;
	text-align: center;
}                 
div.navmenu li {                                    
	list-style-type: none;
	display: inline;
	/* padding: 0px 3px 0px 3px;  */
	padding: 0px 6px 0px 5px;                                                       
	margin: 0px 0px 0px 0px;              
	/* border-right: 1px solid #c0c0c0; */
	font-style: normal;
	font-size: 12px;                                                                           
}                                                     
div.navmenu li.youarehere {
   background: #ececb1;
}
div.navmenu li.nobar {
	border-right: none;
}
div.navmenu li a {
	text-decoration: none; 
	font-weight: bold;
}
div.navmenu li a.light {
	text-decoration: none;
	font-weight: normal;
}
div.navmenu ul.nvGnl li a, div.navmenu ul.nvGnl li a:link, div.navmenu ul.nvGnl li a:visited  {
	color: #990000;                                 
}
div.navmenu ul.nvSpecial li a, div.navmenu ul.nvSpecial li a:link, div.navmenu ul.nvSpecial li a:visited  {
	color: #00995c;                                 
}
div.navmenu ul.nvConnect li a, div.navmenu ul.nvConnect li a:link, div.navmenu ul.nvConnect li a:visited  {
	color: #995c00;                                 
}
div.navmenu ul.nvLocal li a, div.navmenu ul.nvLocal li a:link, div.navmenu ul.nvLocal li a:visited  {
	color: #005c99;     
	// was once #995c00 rust                                     
}
div.navmenu ul.nvUtil li a, div.navmenu ul.nvUtil li a:link, div.navmenu ul.nvUtil li a:visited  {
	color: #000000;                                 
}
div.navmenu ul.nvGnl li a:hover, div.navmenu ul.nvSpecial li a:hover, div.navmenu ul.nvConnect li a:hover, div.navmenu ul.nvLocal li a:hover, div.navmenu ul.nvUtil li a:hover {
	color: red;
}

/*
 ********************************************************************
 * adblock styles are for advertising buttons 
 *    these go in single row across the screen under the masthead
 *    (or later, in vertical row for mobile formats)
 ********************************************************************
 */

div#adblock {
	padding-top: 0px;
	padding-bottom: 0px;   
	background: #ffffcf;      
	border-bottom: 2px solid #663300;
   border-right: 1px solid #663300;
}            
div#adblock div.adbutton {  
   float: left;   
   width: 138px;
   border-left: 1px solid #663300;
   color: white;
   padding: 1px 3px 1px 3px;
   text-align: center;    
   overflow: hidden; 
   white-space: nowrap;                                                             
}  
div#adblock div.thanks { 
   color: #663300; 
   font-size: 0.66em; 
   white-space: normal; 
   word-wrap:  break-word; 
   width: 138px; 
   border-left: 0px;   
}
div#adblock a:link, div#adblock a:visited {
   text-decoration: none;
   color: white;
}   
div#adblock a:hover {
   text-decoration: none;
   color: black;
}
div.ad1 { font-weight: bold; font-size: 0.85em; }
div.ad2 { font-weight: normal; font-size: 0.66em; }

/*
 *************************************************************************
 * upbutton is the floating "up" navigational button that lives on 
 * non-menu pages to point up to the relevant menu
 *************************************************************************
 */

div.upbutton {
   float: right; 
   background: #ffffe0; 
   padding: 3px; 
   margin: 3px; 
   border-left: 1px solid #663300; 
   border-top: 1px solid #663300; 
   border-right: 2px solid #663300; 
   border-bottom: 2px solid #663300; 
   font-weight: bold;
	font-size: 0.75em;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px; 
}

@media print {
   div.upbutton {  display: none }
}

div.upbutton a:link, div.upbutton a:visited  {
   text-decoration: none;
   color: #663300;
}

div.upbutton a:hover {
   text-decoration: none;
   color: red;
}

/*
 ****************************************************************************************
 * optionbutton is a floating menu button that floats left; used for FirstLetters in results browse
 * menu, and for Years in resu/pics menu
 ****************************************************************************************
 */
 
div.optionbutton {
   float: left; 
   background: #ffffe0; 
   padding: 3px 6px;     
   margin: 3px; 
   border-left: 1px solid #663300; 
   border-top: 1px solid #663300; 
   border-right: 2px solid #663300; 
   border-bottom: 2px solid #663300; 
   font-weight: bold;
	font-size: 0.75em;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px; 
}

@media print {
   div.optionbutton {  display: none }
}

div.optionbutton a:link, div.optionbutton a:visited  {
   text-decoration: none;
   color: #663300;
}

div.optionbutton a:hover {
   text-decoration: none;
   color: red;
}

/*
 ****************************************************************************************
 * gnlbutton is a generic button 
 ****************************************************************************************
 */

div.gnlbutton {
   background: #eeeed0; 
   padding: 3px; 
   margin: 3px; 
   border-left: 1px solid #663300; 
   border-top: 1px solid #663300; 
   border-right: 2px solid #663300; 
   border-bottom: 2px solid #663300; 
   font-weight: bold;
	font-size: 0.75em;
	text-align: center;
   -moz-border-radius: 3px;
   -webkit-border-radius: 3px;
   border-radius: 3px; 
}

div.gnlbutton a:link, div.gnlbutton a:visited {
   text-decoration: none;
   color: #663300;
}

div.gnlbutton a:hover {
   text-decoration: none;
   color: red;
}
                                                 
/*
 *************************************************************************
 * this whatimabout highlight block floats at the upper right corner
 * of selected menu pages to explain the purpose of this menu (just help)
 *************************************************************************
 */

div.whatimabout {
   float: right; 
   background: #ffffe0; 
   padding: 4px; 
   margin: 3px 3px 6px 6px; 
   border: 1px solid #663300; 
   width: 20em;
   font-size: 0.90em;
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
   border-radius: 4px; 
}
@media print {
   div.whatimabout { display: none }
}



div#fancyfoot {
	margin-top: 15px;
	border-top-width: 2px;
	border-top-color: #808080;
	border-top-style: solid;
	padding-top: 5px;
	width: 100%;
	font-size: 0.75em;
}
div#fancyfoot {
	color: #808080;
	width="100%";
}
div#fancyfoot .sfl {
   text-align: left; float: left; width: 50%;
}
div#fancyfoot .sfr {
   text-align: right; float: right; width: 50%;
}

/*
 *************************************
 * general color related styles
 *************************************
 */

a:link {color: #990000;}
a:visited {color: #990099;}


td.shaded, tr.shaded {
	background: #ffffe0;
}

h1, h2, h3, h4, h5, h6 {
	color: #663300;
}

/*
 ***************************************************************************
 * major characteristics of highlightblock are defined in common_style
 ***************************************************************************
 */
 
.highlightblock {
	background: #ffffe0;
	border: 1px solid #663300;
	}
.insidetitle {
	background: #663300;
	color: white;
	border: 1px solid #663300;
	border: 1px solid #663300;
}

/*
 * special highlighting for table cells/rows for special purposes
 */
td.finalround {
	background: #eeeebb;
	font-weight: bold;
}
td.medal {
	background: #eeeebb;
	font-weight: bold;
}


/*
 *******************************************************************************
 * tables for GENERAL LIST data. 
 * headers are colored and are assumed on top of list, centered
 * all cells are no-wrap by default but any td or th can have class="wrapok" added
 * the glistb flavor of tables have borders, the glistnb have no borders
 * the _small and _med refer to text size
 ****************************************************************************** 
 */
table.glistb_small, table.glistb_med {                          
	width: auto;
	margin-left: 8px;
	margin-right: 8px;
	margin-top: 8px;
	margin-bottom: 12px;
	padding: 0px;
	border: 1px solid black;
   -moz-border-radius: 4px;
   -webkit-border-radius: 4px;
   border-radius: 4px; 
}
table.glistb_small th, table.glistb_med th {
	background: #663300;
	padding: 3px 3px 4px 3px;
	border-left: 1px solid #ffffff;
	font-weight: bold;
	text-align: center;
	white-space: nowrap;
	color: white;
	border: 2px solid #663300;                            
}
table.glistb_small td, table.glistb_med td {            
	padding: 2px 3px 3px 3px;
	border-top: 1px dotted #663300;
	border-left: 1px solid #663300;
	white-space: nowrap;
	margin: 0px;
}
table.glistb_small th.leftedge, table.glistb_med th.leftedge {
	border-left: 1px solid #663300;
}

table.glistnb_small, table.glistnb_med {
	width: auto;
	margin-left: 8px;
	margin-right: 8px;
	margin-top: 8px;
	margin-bottom: 12px;
	padding-bottom: 3px;
	border-bottom: 2px solid #663300;
}
table.glistnb_small th, table.glistnb_med th {
	background: #663300;
	padding: 3px 3px 4px 3px;             
	font-weight: bold;
	text-align: left;
	white-space: nowrap;
	color: #ffffff;
	border: 2px solid #663300;
}
table.glistnb_small td, table.glistnb_med td {
	padding: 3px 3px 3px 3px;
	white-space: nowrap;
}
table.glistnb_small td.wrapok, table.glistnb_med td.wrapok, table.glistb_small td.wrapok, table.glistb_med td.wrapok {
	white-space: normal;
}
table.glistnb_small th.wrapok, table.glistnb_med th.wrapok, table.glistb_small th.wrapok, table.glistb_med th.wrapok {
	white-space: normal;
}

table.glistnb_small td.botnote, table.glistnb_med td.botnote, table.glistb_small td.botnote, table.glistb_med td.botnote, table.skedbox td.botnote {
   white-space: normal; 
   border-top: 8px solid #663300; 
   background: #eeeebb; 
   font-size: 0.8em; 
   font-style: normal;
   padding: 4px;
}
@media screen {   
	table.glistb_small td, table.glistnb_small td { font-size: 10px; }
	table.glistb_small th, table.glistnb_small th { font-size: 12px; }
	table.glistb_med td, table.glistnb_med td { font-size: 12px; }
	table.glistb_med th, table.glistnb_med th { font-size: 14px; }
}
@media print {
	table.glistb_small td, table.glistnb_small td { font-size: 8pt; }
	table.glistb_small th, table.glistnb_small th { font-size: 9pt; }
	table.glistb_med td, table.glistnb_med td { font-size: 9pt; }
	table.glistb_med th, table.glistnb_med th { font-size: 10pt; }
}


/*
 *********************************************************
 * table for pretty display in mostly-text pages
 *   (such as "about_levels_and_testing")
 * generally looks best if table has cellspacing="0"
 *********************************************************
 */

table.disptable {
	width: auto;
	margin-left: 8px;
	margin-right: 8px;
	margin-top: 8px;
	margin-bottom: 12px;
	padding: 0px;
	border: 2px solid #663300;    
   -moz-border-radius: 6px;
   -webkit-border-radius: 6px;
   border-radius: 6px;          
}
table.disptable th {
	background: #663300;
	padding: 2px 3px 3px 3px;
	font-weight: bold;
	text-align: left;
	white-space: nowrap;
	border: 1px solid #663300; 
	color: white;                                  
}
table.disptable td {
	padding: 2px 3px 3px 3px;
	border-top: 1px solid #c0c0c0;
	border-left: 1px solid #c0c0c0;
	background: #ffffe0;
}
table.disptable td.leftedge {
	border-left: none;
}
table.disptable td.topedge {
	border-top: none;
}
table.disptable th.needbottom {
   border-bottom: 1px solid #663300;
}

table.disptable h3 {
   margin-top: 3px;
}

/*
 *********************************************************
 * Table for News listings (typically on menu pages)
 *********************************************************
 */
table.news {
	width: auto;
	margin-left: 8px;
	margin-right: 8px;
	margin-top: 8px;
	margin-bottom: 6px;
	padding-bottom: 2px;
	border-bottom: 2px solid #663300;
	padding-top: 1px;
	border-top: 2px solid #663300;
}
table.news th {
	padding: 2px;
 	font-weight: normal;
	font-style: normal;
	text-align: left;
	vertical-align: text-top;
	white-space: nowrap;
	border-right: 1px dotted #663300;
}
table.news td {
	padding: 2px;
	text-align: left;
	vertical-align: text-top;
	font-style: normal;
}
p.newsmore {
	font-style: italic;
	margin-top: 0px;
	margin-right: 8px;
	margin-bottom: 12px;
	margin-left: 18px;
	text-align: left;
}
@media screen {
	table.news th, table.news td { font-size: 10px; }
	p.newsmore { font-size: 10px; }
}
@media print {
	table.news th, table.news td { font-size: 8pt; }
	p.newsmore { font-size: 8pt; }
}


/*
 ***************************************************************************
 * table dispform for input forms and event info boxes and club info boxes
 ***************************************************************************
 */
table.dispform {
	margin-left: 12px;
	margin-right: 12px;
	margin-top: 8px;
	margin-bottom: 8px;
	border: 1px solid #663300;
	background: #ffffe0;
   -moz-border-radius: 6px;
   -webkit-border-radius: 6px;
   border-radius: 6px; 
	}
table.dispform td {
	padding: 3px 4px 3px 4px;
}
table.dispform th {
   font-weight: bold;
   text-align: left;
   background: #eeeebb;
	padding: 3px 4px 3px 4px;
 	white-space: nowrap;
}
table.dispform td.topbar {
	background: #663300;                               
	color: white;
	padding: 4px 4px 6px 4px;
	text-align: center;
	font-weight: bold;
	border-bottom: 2px solid #663300;
}


/*
 *******************************************
 * Table for Element Lists, etc
 *******************************************
 */

 table.elementbox {
 	margin-left: 12px;
 	margin-right: 12px;
 	margin-top: 8px;
 	margin-bottom: 8px;
 	padding: 2px;
 	border: 1px solid #663300;
 	background: #ffffe0;
 	}
 table.elementbox th {
	color: #663300;
	font-weight: bold;
 	white-space: nowrap;
 	text-align: left;
 	background: #eeeebb;
 	padding: 3px;
 }
 table.elementbox td {
 	padding: 3px;
 	border-bottom: 1px dotted #c0c0c0;	
 }
 
table.elementbox td li { list-style-type: disc; }
table.elementbox td ul {
	margin-top: 0px;
	margin-bottom: 0px;
	margin-left: 0.95em;
	padding-left: 0.6em;
}
@media screen {
	table.elementbox th, table.elementbox td { font-size: 12px; }
}
@media print {
	table.elementbox th, table.elementbox td { font-size: 9pt; }
}

/* 
 ************************************************************
 * *** THIS ISN'T USED TOO MUCH - STRIVE TO ELIMINATE IT ****
 ************************************************************
 * multibox is for highlight blocks that need multi columns 
 * this is typically used to display a small table of info
 * (like the tables on the regionals_cutoff_dates page)
 * (also jump_limits, isu_short_prog_deduct, general_deduct)
 *
 * the .multiheadline is used as a div inside a data block
 * to add what looks like an internal "th" divider/spacer
 * (like on the learn-to-skate chart on the basic ref menu)
 *
 * normal text blocks ==================
 *   these are of form td.mlXXX where XXXX are concatenated
 *      b,s : b=dashed border; s=solid border (if absent, no border)
 *      c : centered text (if absent, left justified)
 *      r : no wrap (if absent, wrappable)
 *
 * subhead blocks ======================
 *    td.mlhl, td.mlhr are for left-side headings if desired
 *       these have slightly darker background, no left border,
 *       and bold text; .mlhl is left justified, .mlhr is right.
 ************************************************************
 */
table.multibox {
	margin-left: 12px;
	margin-right: 12px;
	margin-top: 8px;
	margin-bottom: 8px;
	padding: 1px;
	border: 1px solid #663300;
	background: #ffffe0;
	}
table.multibox td {
	font-size: 90%;
	padding: 1px 4px 1px 4px;
}
table.multibox th {
	background: #663300;                               
	color: white;
	padding: 2px 4px 2px 4px;
}

table.multibox td.mlb {
	border-left: 1px solid #c0c0c0;
}
table.multibox td.mlbc {
	border-left: 1px solid #c0c0c0;
	text-align: center;
}
table.multibox td.mlbcr {
	border-left: 1px solid #c0c0c0;
	text-align: center;
 	white-space: nowrap;
}
table.multibox td.mlbr {
	border-left: 1px solid #c0c0c0;
 	white-space: nowrap;
}

table.multibox td.mls {
	border-left: 1px solid #c0c0c0;
}
table.multibox td.mlsc {
	border-left: 1px solid #c0c0c0;
	text-align: center;
}
table.multibox td.mlscr {
	border-left: 1px solid #663300;                
	text-align: center;
 	white-space: nowrap;
}
table.multibox td.mlsr {
	border-left: 1px solid #c0c0c0;
 	white-space: nowrap;
}

table.multibox td.mlc {
	text-align: center;
}
table.multibox td.mlcr {
	text-align: center;
 	white-space: nowrap;
}
table.multibox td.mlr {
 	white-space: nowrap;
}

table.multibox td.mlhl {
   font-weight: bold;
   text-align: left;
   background: #eeeebb;
} 
table.multibox td.mlhr {
   font-weight: bold;
   text-align: right;
   background: #eeeebb;
} 
.multiheadline {
	margin-left: 0px;
	margin-right: 0px;
	margin-top: 0px;
	margin-bottom: 1px;
	background: #663300;
	text-align: left;
	color: white;
	padding: 2px;
	width: 100%;
	font-size: 100%;
	font-weight: bold;
	font-style: italic;
}

/*
 **************************************************
 * resusumry is for very compact result summary
 * like eglr05, eglr06 summary
 * it is bordered and has tiny boxes for each
 * event;  
 * td.final makes shaded bordered box for finals
 **************************************************
 */
table.resusumry {
	margin-left: 12px;
	margin-right: 12px;
	margin-top: -6px;
	margin-bottom: 8px;
	padding: 0px;
	border: 1px solid #663300;
	background: #ffffe0;
	}
table.resusumry td {
	padding: 2px 6px 2px 6px;
}
table.resusumry th {
	border: 1px solid #663300;
	font-weight: bold;
	white-space: nowrap;
	padding: 1px 3px 1px 3px;
	background: #663300;
	color: #ffffe0;
	text-align: left;
}
table.resusumry td.final {
	border: 1px solid #663300;
	background: #eeeebb;
}
@media screen {
	table.resusumry th, table.resusumry td { font-size: 12px; }
}
@media print {
	table.resusumry th, table.resusumry td { font-size: 8pt; }
}


/* stuff to support schedule printer */

table.skedbox {
   border: 1px solid #663300;
   margin: 6px 0px 4px 4px;
   padding: 2px;
   background: #ffffe0;
}

table.skedbox th {
   background: #eeeebb;
   color: #663300;
   font-size: 14pt;
   font-weight: bold;
   padding: 4px 0px;
   border-bottom: 1px solid #663300;
}

table.skedbox td {
   padding-top: 0px;
   padding-bottom: 0px;
   font-size: 10pt;                                 
}

@media print {
   table.skedlong td { font-size: 8pt; }  
} 

span.simplenews {
   font-size: 0.66em;                                                
}
span.simplenews li { 
   margin-bottom: 0.25em; 
}

/* 
 * formbutton is a generic button for forms on boxy sk8stuff pages (d0d0d0) (ffcc99) 9999ff
 */
    
span.formbutton {          
   background: #eeeebb;                 
   padding: 1px 6px; 
   margin: 2px; 
   border-top: 1px solid #663300; 
   border-right: 2px solid #663300;
   border-bottom: 2px solid #663300;
   border-left: 1px solid #663300;
   font-weight: bold;
	font-size: 0.75em;
	text-align: center;
}                                       

span.formbutton a:link, span.formbutton a:visited {
   text-decoration: none;
   color: #663300;
}

span.formbutton a:hover {
   text-decoration: none;
   color: red;
}

/* 
 * bluebutton is a generic button for forms on boxy sk8stuff pages (d0d0d0) (ffcc99) 9999ff
 */
    
span.bluebutton {          
   background: #bbbbff;                 
   padding: 3px 6px; 
   margin: 3px; 
   border-top: 1px solid #505050; 
   border-right: 2px solid #202020;
   border-bottom: 2px solid #202020;
   border-left: 1px solid #505050;
   font-weight: bold;
	font-size: 0.75em;
	text-align: center;
}                              

span.bluebutton a:link, span.bluebutton a:visited {
   text-decoration: none;
   color: #505050;
}

span.bluebutton a:hover {
   text-decoration: none;
   color: white;
}