/* The main calendar widget.  DIV containing a table. */





.calendar {cursor:default;margin:0 1em 0 0;}

.calendar table {cursor: default; background: #fff;border:1px solid #7A7A7A;width:200px;font-size:95%;}

/* Header part -- contains navigation buttons and day names. */

.calendar .button { /* "<<", "<", ">", ">>" buttons have this class */
text-align: center;background:#C0B1A3;cursor:pointer;}

.calendar .nav {background:#BEBEC6;}

.calendar thead .title { /* This holds the current "month, year" */
  color:#424141;text-align: center;font-weight: bold;background:#C0B1A3;padding:0.25em 0;font-size:120%;}

.calendar thead .headrow .button { background:#E5DFDB;border-top:1px solid #7A7A7A;padding:0.15em 0;
}

.calendar thead .daynames { /* Row <TR> containing the day names */
background:#BEBEC6; padding:0.5em;}

.calendar thead .name { /* Cells <TD> containing the day names */
text-align: center;background:#C0B1A2; padding:0.2em;border-top:1px solid #7A7A7A;border-bottom:1px solid #7A7A7A;}

.calendar thead .weekend { /* How a weekend day name shows in header */
background:#C0B1A2;
}

.calendar thead .hilite { /* How do the buttons in header appear when hover */
}

.calendar thead .active { /* Active (pressed) buttons in header */
}

/* The body part -- contains all the days in month. */



.calendar tbody .day { /* Cells <TD> containing month days dates */
text-align: right;padding: 0.2em;font-weight: bold;}

.special { background-color: #CC1526; color: #fff; }

.calendar table td.wn {padding:0.2em;background: #C0B1A2;border-right:1px solid #7A7A7A;}

.calendar tbody .rowhilite td {background:#f7f3f4;}/*url(../imagenes/fondo-over-days.gif) repeat-x*/

.calendar tbody .rowhilite td.special  {background: #CC1526; color: #fff; z-index:1;}

.calendar tbody td.hilite { /* Hovered cells <TD> */
 background: #CD1427;
  color:#fff;font-weight:bold;
}

.calendar tbody td.active { /* Active (pressed) cells <TD> */

  
}

.calendar tbody td.selected { /* Cell showing selected date */
  font-weight: bold;}

.calendar tbody td.weekend { /* Cells showing weekend days */
  color: #3F3D3E;font-weight:bold;}

.calendar tbody td.today { /* Cell showing today date */
  font-weight: bold;color: #fff;background:#424141;}

.calendar tbody td.disabled { color:#999;}

.calendar tbody .emptycell { /* Empty cells (the best is to hide them) */
  visibility: visible ;
}

.calendar tbody .emptyrow { /* Empty row (some months need less than 6 rows) */
  display: none;
}

/* The footer part -- status bar and "Close" button */

.calendar tfoot .footrow { font-size:85%;/* The <TR> in footer (only one right now) */
}

.calendar tfoot .ttip { /* Tooltip (status bar) cell <TD> */
  background:#C0B1A2;text-align: center;border-top:1px solid #7A7A7A;}

.calendar tfoot .hilite { /* Hover style for buttons in footer */
  padding: 1px;
}

.calendar tfoot .active { /* Active (pressed) style for buttons in footer */
 
}

/* Combo boxes (menus that display months/years for direct selection) */

.combo {
  position: absolute;
  display: none;
  width: 4em;
  top: 0px;
  left: 0px;
  cursor: default;
  border: 1px solid;
  border-color: ButtonHighlight ButtonShadow ButtonShadow ButtonHighlight;
  background: Menu;
  color: MenuText;
  font-size: smaller;
  padding: 1px;
}

.combo .label,
.combo .label-IEfix {
  text-align: center;
  padding: 1px;
}

.combo .label-IEfix {
  width: 4em;
}

.combo .active {
  padding: 0px;
  border: 1px solid #000;
}

.combo .hilite {
  background: Highlight;
  color: HighlightText;
}

.calendar td.time {
  border-top: 1px solid ButtonShadow;
  padding: 1px 0px;
  text-align: center;
  background-color: ButtonFace;
}

.calendar td.time .hour,
.calendar td.time .minute,
.calendar td.time .ampm {
  padding: 0px 3px 0px 4px;
  border: 1px solid;
  border-color: ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight;
  font-weight: bold;
  background-color: Menu;
}

.calendar td.time .ampm {
  text-align: center;
}

.calendar td.time .colon {
  padding: 0px 2px 0px 3px;
  font-weight: bold;
}

.calendar td.time span.hilite {
  border: 1px solid;
  border-color: ThreeDHighlight ThreeDShadow ThreeDShadow ThreeDHighlight;
  background-color: InactiveCaption;
  color: Window;
}

.calendar td.time span.active {
  border-color: ThreeDShadow ThreeDHighlight ThreeDHighlight ThreeDShadow;
  background-color: WindowText;
  color: Window;
}