/* Page revisions: September 17, 2006: Original file date
                      October 4, 2006: Reformatted to my style
     Additional page revisions listed in each line changed
*/

body
{
  background-color: #ffffff;
  font-family: arial;
  margin-left: 20px;
  margin-right: 20px;
  background-image: url(graphics/fam3.jpg);
}

body.event_details_body
{
  background-color: #ffffff;
  font-family: arial;
}

img                                 /* prevents borders around images that are links (whose dumb idea was that anyway?) */
{
  border-width: 0px;
}

a:link
{
  color: #0000ff;
  text-decoration: none;
}

a:visited
{
  color: #551a8b;
  text-decoration: none;
}

a:hover
{
  color: #0000aa;
  text-decoration: none;
}

/* form stuff*/

form
{
  display: inline;
  margin-bottom: 0;
  margin-top: 0;
}

input
{
  margin: 2px;
  padding: 2px;
}

textarea
{
  margin: 2px;
  padding: 2px;
}

select
{
  margin: 2px;
}

optgroup
{
  color: #888888;
  font-weight: normal;
  font-style: normal;
  font-size: x-small;
}

option
{
  color: #000000;
  font-weight: normal;
  font-size: small;
}

#update_cal_form input
{
  margin: 5px;
  margin-top: 0px;
}

#update_cal_form textarea
{
  margin: 5px;
  margin-top: 0px;
}

#update_cal_form select
{
  margin: 5px;
  margin-top: 0px;
}

#update_cal_form .leftcol
{
  clear: left;
  float: left;
  width: 35%;
  text-align: right;
  margin-bottom: 5px;
}

#update_cal_form .rightcol
{
  float: left;
  width: 60%;
  text-align: left;
  margin-bottom: 5px;
}

#add_event_form .leftcol
{
  clear: left;
  float: left;
  width: 35%;
  text-align: right;
  margin-bottom: 5px;
}

#add_event_form .rightcol
{
  float: left;
  width: 60%;
  text-align: left;
  margin-bottom: 5px;
}

#controls_submit_button
{
  border: outset 2px #000000;
}

#controls_submit_button.blink
{
  border: outset 2px #ff0000;
  background-color: #ff0000;
}

/* The dropdownmenu styles are not currently used. They're reserved for javascript dropdown menus,
   if those ever become a reality!
*/

div.dropdownmenu
{
  position: absolute;
  width: 165px;
  border-width: 1px;
  border-style: solid;
  border-color: #b2b2b2 #4a494a #4a494a #b2b2b2;
  background-color: #ffffff;
  font-family: arial;
  line-height: 20px;
  cursor: default;
  font-size: 14px;
  visibility: hidden;
}

div.dropdown_menuitem
{
  padding-left: 5px;
  color: #000000;
  font-size: 14px;
}

div.dropdown_menuitem_highlight
{
  padding-left: 5px;
  color: #ffffff;
  background-color: #08246b;
}

/* The contextmenu styles *are* used. They're for the right-click menus */

div.contextmenu
{
  position: absolute;
  width: 165px;
  border-width: 1px;
  border-style: solid;
  border-color: #b2b2b2 #4a494a #4a494a #b2b2b2;
  background-color: #d6d3ce;
  font-family: arial;
  line-height: 20px;
  cursor: default;
  font-size: 14px;
  visibility: hidden;
  text-align: left;
}

div.context_menuitem
{
  padding-left: 10px;
  font-size: 14px;
}

div.context_menuitem_highlight
{
  padding-left: 10px;
  color: #ffffff;
  background-color: #08246b;
}

/* styles for the main tabs */

.active_tab
{
  background-color: #ffffff;
  border: outset 1px #ddc9b1;
  padding: 5px;
  background-image: url(graphics/fam3.jpg);
}

.active_tab a
{
  color: #408080;
  font-weight: bolder;
  font-size: medium;
}

.inactive_tab
{
  background-color: transparent;
  border: inset 1px #ddc9b1;
  padding: 5px;
  background-image: url(graphics/grebkgd.jpg);
}

.inactive_tab a
{
  color: #408080;
  font-weight: bolder;
  font-size: medium;
}

/* Info_box is sort of a generic class used in lots of places, usually applied to <div>s */

a.info_box_tab
{
  color: #0000ff;
  border: solid 1px #632400;
  background-color: #eeeeee;
  border-bottom-width: 0px;
  padding: 2px 1em 2px 1em;
  position: relative;
  margin-left: 2px;
  margin-right: 2px;
  /*top:-1px; */             /* This may be needed to make the info box tabs look perfectly; depends on the browser */
  z-index: 100;
  text-decoration: none;
  background-image: url(graphics/grebkgd.jpg);
}

a.info_box_tab.active
{
  color: #0000ff;
  padding-top: 5px;
  background-color: #ffffff;
  position: relative;
  z-index: 102;
  background-image: url(graphics/grebkgd.jpg);
}

.info_box
{
  background-color: #ffffff;
  padding: 5px;
  margin: 0px;
  border: solid 1px #632400;
  color: #000000;
  background-image: url(graphics/grebkgd.jpg);
}

.info_box a                  /* A color that will be visible against the info_box background */
{
  color:#0000ff;
}

.info_box a:hover
{
  color: #551a8b;
}

.info_box a:visited
{
  color: #0000aa;
}

.calendar_controls
{
  background-color: transparent;   
  padding: 5px;
  margin: 0px;
  border: outset 1px #d67500;
  color: #000000;
  width: 90%;
  margin: auto;
  margin-top: 5px;
  margin-bottom: 5px;
  white-space: nowrap;
}

/* event_box surrounds each event*/

.event_box
{ 
  border-style: solid !important;
  border-width: 1px !important;
  border-color: #660000 !important;
  padding: 3px;
  margin: 2px;
  text-align: left;
  color: #ff0000 !important;
  font-weight: normal !important;
  font-size: x-small !important;
}

.event_box:hover
{
  color: #0000aa;
}

.event_box.background
{
  border-color: #000000;
}

.list_month_box
{
  background-color: #ffffff;
  padding: 0px;
  margin: 0px;
  margin-bottom: 1em;
  border-style: solid;
  border-width: 1px;
  border-color: #000000;
  color: #0049ff;
  font-weight: normal;
  font-size: medium;
  text-align: center;
}

.list_cal_box
{
  background-color: #ffffff;
  padding: 5px;
  margin: 5px;
  border-style: solid;
  border-width: 1px;
  border-color: #000000;
  color: #000000;
}

.list_cal_box.background          /* Used for lots of things */
{
  border-color: #aaaaaa;
}

.help_box
{
  background-color: #ffffff;
  padding: 5px;
  margin: 5px;
  border-style: solid;
  border-width: 1px;
  border-color: #000000;
  color: #000000;
  font-size: small;
}

.help_title
{
  color: #000000;
  font-weight: bold;
  font-size: small;
}

.error                            /* Used for displaying errors */
{
  color: #ff0000;
  font-size: small;
}

.warning                          /* Used for displaying warnings */
{
  color: #af0000;
  font-size: small;
}

.highlight                        /* Used for highlighting text */
{
  color: #000000;
  background-color: #fffbba;
}

.required_field                   /* Used for required input fields */
{
  color: #af0000;
  font-weight: bold;
  font-size: small;
}

.optional_field                   /* Used for optional input fields */
{
  color: #000000;
  font-weight: bold;
  font-size: small;
}

.fit_event
{
  color: #000000;                 /* Maroonish red! */
  font-weight: normal;
  font-size: x-small;
}

.small_note
{
  color: #000000;
  font-weight: normal;
  font-size: x-small;
}

.small_note a
{
  font-weight: normal;
  font-size: x-small;
}

.cal_title                        /* Used for calendar title */
{
  color: #408080;
  font-weight: bold;
  font-size: x-large;
}

.cal_month_title                  /* Used for calendar month title */
{
  color: #408080;
  font-weight: bold;
  font-size: medium;
}

.date                             /* Dates */
{
  font-weight: normal;
  font-style: normal;
  border: inset 1px #d67500;
  background-color: #f4e5d9;
  display: inline;
  margin: 2px;
  padding: 2px;
  padding-left: 3px;
  padding-right: 3px;
  line-height: 18px;
  vertical-align: top;
  float: left;
}

.date.today                       /* This can be used to put some image on today's date (like a circle around the date) */
{
  font-weight: normal;
  font-style: normal;
  border: inset 2px #d67500;
  background-color: #ffffff;
  /*background-image: url(graphics/date_circle.gif);
  background-position: top;*/
  display:inline;
  margin:2px;
  padding:2px;
  padding-left:3px;
  padding-right:3px;
  line-height:18px;
  vertical-align:top;
}

/* styles for the event details pop-up */

.event_details
{
  background-color: #ffffff;
  padding: 5px;
  margin: 0px;
  border: solid 1px #000000;
  color: #000000;
  line-height: 1em;                                             /* This fixes the IE-only "peekaboo" bug */
  -moz-border-radius: .75em .75em .75em .75em;
}

.event_details .date
{
  font-weight: bold;
  font-style: italic;
}

.event_details .title
{
  font-weight: bold;
}

.icon_preview_box                 /* Used for day zoom details box (below title) */
{
  background-color: #ffffff;
  padding: 3px;
  margin: 3px;
  border: solid 1px #000000;
}

td.day_names                      /* Used for Sunday, Monday, etc.*/
{
  color: #4f1a02;
  font-weight: bold;
  font-size: small;
  font-style: italic;
  text-align: center;
  background-color: transparent;
  border-style: solid;
  border-width: 0px;
  border-color: #000000;
  margin: 0px;
  width: 100px;                   /* This line makes each calendar cell at least a certain width */
}

.day                              /* Used for calendar cells*/
{
  background-color: transparent;
  border: inset 3px #e1d4c4;
  padding: 0;
  padding-left: 2px;
  padding-right: 2px;
  margin: 0px;
  padding-top: 2px;
  width: 11%;
  font-size: small;
  font-weight: normal;
  vertical-align: top;
}

.day.other_month                  /* Used for calendar days in months before & after the current month */
{
  color: #333333;
  font-size: small;
  background-color: transparent;
  background-image: url(graphics/grebkgd_other.jpg);
}

.day.cell_bottom                  /* Used for calendar cell bottoms */
{
  height: 3px !important;
  padding: 0 !important;
  margin: 0 !important;
}

td.today                          /* Used for today's date */
{
  background-color: transparent;
  background-image: url(graphics/grebkgd_today.jpg);
}

table.calendar                    /* Used for invisible tables & divs */
{
  background-color: transparent;
  padding: 0px;
  margin: 0px;
  border: solid 1px #632400;
  border-collapse: collapse;
  background-image: url(graphics/grebkgd.jpg);
}

td.event_slot                     /* This surrounds each event box on the calendar */
{
  border-style: solid;
  background-color: #ffffff;
  border-width: 0px;
  border-color: #000000;
  padding: 2px;
  margin: 0px;
}

.layout                           /* Used for invisible tables & divs */
{
  background-color: transparent;
  padding: 0px;
  margin: 0px;
  border-style: solid;
  border-width: 0px;
  border-color: transparent;
}

/**************** print styles ************************/

@media print
{                            /* For printing, things should be black & white (backgrounds light, text & borders dark.)*/

  font                       /* Set all fonts to black */
  color: #000 !important;
}

                             /* set all links to black */
a:link
{
  color: #000000 !important;
  text-decoration: underline;
}

a:visited
{
  color: #000000 !important;
  text-decoration: underline;
}

body
{
  background-color: #ffffff;
  background-image: none;
}

#plans_links
{
  display: none;
}

#tab_menu
{
  display: none;
}

.calendar_controls
{
  display: none;
}
