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

.calendar {
  position: relative;
  display: none;
  border: 1px solid #94BDC3;
  border-left: 2px solid #94BDC3;
  font-size: 11px;
  cursor: default;
  background-color: #DCF4F8;
  color: #666666;
  font-family: Verdana;
  z-index: 6;
}

.calendar table {
  border: 0;
  border-collapse: collapse;
}

.calendar tbody {
	background-color: #FFFFFF;
	border-right: 1px solid #788D90;
	border-left: 1px solid #788D90;
}
/* Header part -- contains navigation buttons and day names. */

.calendar .button { /* "<<", "<", ">", ">>" buttons have this class */
  text-align: center;
  border: 1px solid #788D90;
  background-color: #EDEDEC;
}

.calendar thead .title { /* This holds the current "month, year" */
  font-weight: bold;
  border: 1px solid #788D90;
  background-color: #EB290D;
  color: #FFFFFF;
  text-align: center;
}

.calendar thead .headrow { /* Row <TR> containing navigation buttons */
}

.calendar thead .daynames { /* Row <TR> containing the day names */
  border-left: 1px solid #788D90;
  border-right: 1px solid #788D90;
}

.calendar thead .name { /* Cells <TD> containing the day names */
  border-bottom: 1px solid #788D90;
  padding: 2px;
  text-align: center;
  background-color: #EDEDEC;
  color: #666666;
}

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

.calendar thead .hilite { /* How do the buttons in header appear when hover */
  background-color: #F8F8F8;
}

.calendar thead .active { /* Active (pressed) buttons in header */
	font-weight: bold;
}

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

.calendar tbody .day { /* Cells <TD> containing month days dates */
  width: 2em;
  text-align: right;
  padding: 2px 4px 2px 2px;
}

.calendar table .wn {
  padding: 2px 3px 2px 2px;
  border-right: 1px solid #788D90;
  background-color: #EDEDEC;
  color: #666666;
}

.calendar tbody .rowhilite td {
  background: #eee;
  color: #000;
}

.calendar tbody td {
	color: #000000;
}

.calendar tbody td.hilite { /* Hovered cells <TD> */
  padding: 1px 3px 1px 1px;
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
}

.calendar tbody td.active { /* Active (pressed) cells <TD> */
  padding: 2px 2px 0px 2px;
  border: 1px solid;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
}

.calendar tbody td.selected { /* Cell showing selected date */
  font-weight: bold;
  border: 1px solid;
  border-color: ButtonShadow ButtonHighlight ButtonHighlight ButtonShadow;
  padding: 2px 2px 0px 2px;
}

.calendar tbody td.weekend { /* Cells showing weekend days */
  color: #f00;
}

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

.calendar tbody td.disabled { color: GrayText; }

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

.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 { /* The <TR> in footer (only one right now) */
}

.calendar tfoot .ttip { /* Tooltip (status bar) cell <TD> */
  padding: 1px;
  border: 1px solid #788D90;
  background-color: #EDEDEC;
  color: #666666;
  text-align: center;
}

.calendar tfoot .hilite { /* Hover style for buttons in footer */
  border-top: 1px solid #fff;
  border-right: 1px solid #000;
  border-bottom: 1px solid #000;
  border-left: 1px solid #fff;
  padding: 1px;
  background: #e4e0d8;
}

.calendar tfoot .active { /* Active (pressed) style for buttons in footer */
  padding: 2px 0px 0px 2px;
  border-top: 1px solid #000;
  border-right: 1px solid #fff;
  border-bottom: 1px solid #fff;
  border-left: 1px solid #000;
}

/* 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 {
  text-align: center;
  padding: 1px;
}

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

.combo .hilite {
  background: Highlight;
  color: HighlightText;
}
/* Reservation */
#tr-reservation-calendar {
	border-top: 2px solid #788D90;
	padding-top: 26px;
}
#tr-reservation-calendar .reservation_calender{
	width: 200px;
	overflow: hidden;
	border: 0;
	margin-right: 1px; 
	float: left;
	background-image: url(/templates/pics/res_calendar_bg.gif);
	background-repeat: no-repeat;
	background-position: left top;
}
#tr-reservation-calendar .calendar {
	border: 0;
	border: 0;
	height: 170px;
	overflow: hidden;
	background-color: transparent;
}
#tr-reservation-calendar .calendar table {
   border-collapse: collapse;
   background-color: transparent;
}
#tr-reservation-calendar .calendar table thead, #tr-reservation-calendar .calendar table tbody {
	background-color: transparent;
}
/*#tr-reservation-calendar-form { padding: 17px 13px; background-color: #EAF4F6; border-bottom: 1px solid #FFFFFF; height: 20px; overflow: hidden; }*/
#tr-reservation-calendar-form { padding: 17px 13px; background-color: #EAF4F6; border-bottom: 2px solid #788D90; height: 20px; overflow: visible; }
#tr-reservation-calendar-form-error { padding: 17px 13px; background-color: #F9DFE0; border: 3px solid #D1060F; height: 20px; overflow: visible; }
html>body #tr-reservation-calendar-form, html>body #tr-reservation-calendar-form-error { height: auto; min-height: 20px;  }
#tr-reservation-calendar-form form#Hotelsuche div, #tr-reservation-calendar-form-error form#Hotelsuche div { width: 110px; }
#tr-reservation-calendar-form label, #tr-reservation-calendar-form-error label { display: block; width: 100px; line-height: 17px; height: 17px; }
#tr-res-errorMsg { display: none; }
#tr-reservation-calendar .calendar td { margin: 0; padding: 0 3px; }
#tr-reservation-calendar .calendar thead { border: 0;}
#tr-reservation-calendar .calendar thead td { height: 17px; vertical-align: middle; border: 0; color: #FFFFFF; background-color: transparent; }
#tr-reservation-calendar .calendar thead td.title { height: 20px; padding: 0; text-align: right; padding-right: 26px; }
#tr-reservation-calendar .calendar thead .daynames { border: 0; }
#tr-reservation-calendar .calendar thead .daynames .name { color: #666666; font-weight: bold; height: 23px; vertical-align:middle; }
#tr-reservation-calendar .calendar thead td.button, #tr-reservation-calendar .calendar thead td.wn { border-left: 0; border-right: 0;}
#tr-reservation-calendar .calendar tbody { border: 0; }
#tr-reservation-calendar .calendar tbody td { vertical-align: middle; font-size: 11px; background-color: transparent; color: #FFFFFF; padding-top: 5px; }
#tr-reservation-calendar .calendar tbody td.special { text-align:center; border: 0; }
#tr-reservation-calendar .calendar tbody td.special div { background-color: #B1DDB9; border: 1px solid #57C431; color:#FFFFFF; } 
#tr-reservation-calendar .calendar tbody td.emptycell { color:#FFFFFF; text-align:center; border: 0; }
#tr-reservation-calendar .calendar tbody td.disabled { text-align:center; border:0; }
#tr-reservation-calendar .calendar tbody td.disabled div { background-color: #CFB1B6; border: 1px solid #D9060F; color:#FFFFFF; }
#tr-reservation-calendar .calendar tbody td.today { font-weight: normal; color: #666666; }
#tr-reservation-calendar .calendar tbody td.today div { background-color: #FFCC00; }
#tr-reservation-calendar .calendar tbody td div.day-in-past { background-color:#C8D5D7; border: 1px solid #788D90; }
#tr-reservation-calendar .calendar thead td.button div { display: none;}
#tr-reservation-calendar .calendar tfoot td.ttip { border:0; }
#tr-reservation-calendar .calendar tbody td.weekend { font-weight:bold; }
#tr-reservation-calendar .calendar tfoot td { height: 17px; vertical-align: middle; }
#tr-reservation-calendar .calendar tfoot { display: none;}
/* Reservation Pager */
#tr-reservation-calendar-pager { height: 24px; border-bottom: 2px solid #788D90; border-top: 1px solid #FFFFFF; padding-bottom: 1px; position: relative; }
.calendar-pager-left, .calendar-pager-right { height: 24px; line-height: 24px; color: #788D90; font-size: 12px; }
.calendar-pager-left { position:absolute; left: 0; top: -196px; z-index: 10; }
.calendar-pager-left a:link, .calendar-pager-left a:visited, .calendar-pager-left a:active, .calendar-pager-left a:hover { background-image: url(/templates/pics/calendar-pager-prev.gif); background-repeat: no-repeat; padding-left: 30px; display: block; height: 24px;}
.calendar-pager-right { text-align: right; }
.calendar-pager-right a:link, .calendar-pager-right a:visited, .calendar-pager-right a:active, .calendar-pager-right a:hover { background-image: url(/templates/pics/calendar-pager-next.gif); background-repeat: no-repeat; background-position: right; padding-right: 30px; display: block; height: 24px;}

div.reservation-cell{
	height: 13px; 
	width: 18px;
}
div.calender-legende-free { 
	background-color: #B1DDB9; 
	border: 1px solid #57C431; 
	color:#FFFFFF; 


} 
div.calender-legende-booking { 
	background-color: #CFB1B6; 
	border: 1px solid #D9060F; 
	color:#FFFFFF;
} 

div.calender-legende-past { 
	background-color:#C8D5D7; 
	border: 1px solid #788D90;

} 
div.calendar-cell{
	cursor: pointer;
}