.inputFullWidth input { width: 100%; }
.redItalic { color: red; font-style: italic; }
.size120b { font-size: 120%; font-weight: bold; }

/* marks a day in the colum-header as today */
.calToday{background: #ffffcc;}

/* marks a day in the colum-header as holiday */
.calHoliday{background: #dac0c0;}

/* marks a day in the column-header additionaly as birthday of some contact, it should work together with the backgrounds of calToday, calHoliday, th, row_on and row_off */
.calBirthday,.calBirthday a{color: black; font-weight: bold; font-style: italic;}

/* timeGridWidget, contains timeRow's and dayCol's */
.calTimeGrid{
	position: relative;
	top: 0px;
	left: 0px;
	border:1px solid white;
	width: 100%;
	border-radius:10px;
}

/* single row in the time-line, always used in conjunction with row_{on|off}, you dont need to set a bgcolor, but you can */
.calTimeRow,.calTimeRowOff{position: absolute; width: 100%;}
.calTimeRow{}

/* time in a timeRow */
.calTimeRowTime{
	padding-left: 5px;
	height: 100%;
	line-height: 15px;
	font-size:15px;
	text-align: left;
}

/* contains (multiple) dayCol's */
.calDayCols,.calDayCols12h,.calDayColsNoGrid{
	position: absolute;
	top: 0px;
/*	bottom: 0px; does NOT work in IE, IE needs height: 100%! */
	height: 100%;
	left: 45px;
	right: 0px;
}
/* 12h timeformat with am/pm */
.calDayCols12h{left: 65px;}

/* no time grid --> no time column */
.calDayColsNoTime{left: 0px;}

/* contains (multiple) eventCol's */
.calDayCol{position: absolute; top: 0px; height: 100%; border-left: 1px solid white;}

/* header for the dayCol */
.calDayColHeader,.calGridHeader{
	position: absolute;
	top: 0px;
	left: 0px;
	width: 100%;
	right: 0px;	/* does not work in IE, but looks better in other browsers then width:100% */
	text-align: center;
	font-size: 100%;
	white-space: nowrap;
	border-bottom: 1px solid white;
	border-right: 1px solid white;
	height: 16px;
	line-height: 14px;
}
.calDayColHeader img {vertical-align: middle;}

.calViewUserNameBox {
	position: absolute;
	top: -1px;
	width: 95%;
	text-align: left;
	font-size: 120%;
	white-space: nowrap;
	border: 1px solid gray;
	height: 17px;
	left: -1px;
	padding-top: 0px;
	padding-left: 10px;
	background: #dac0c0;
}
.calViewUserName {font-weight: normal;}
.calViewUserName:first-letter {text-transform:uppercase;}
.calViewUserNameFirst {}
.calViewUserNameFirst:after {content: ", ";}

/* header of the time-grid, eg. for the weeks in the month-view (leftmost of the day-col-headers) */
.calGridHeader{text-align: left;	padding-left: 3px;}

/* contains (multiple) events's */
.calEventCol{
	position: absolute;
	top: 0px;
/*	bottom: 0px; does NOT work in IE, IE needs height: 100%! */
	height: 100%;
}

/* contains one event: header-row & -body */
.calEvent,.calEventPrivate{
	position: absolute;
	left: 0px;
	right: 0px;
	overflow: hidden;
	z-index: 20;
	border-width: 1px;
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
.calEvent:hover{cursor: pointer;}

/* All participants accepted the invitation */
.calEventAllAccepted {border-style: solid;	border-width: 1px;}

/* All participants answered the invitation, but not all accepted */
.calEventAllAnswered {border-style: dotted;	border-width: 2px;}

/* Some participants did NOT answer the invitation */
.calEventSomeUnknown {border-style: dashed;	border-width: 1px;}

.calEventTooltip{
	border-radius: 6px;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
	max-height: 400px;
	overflow: auto;
}

.calCursus{position: absolute; width: 100%;background-color: #35C2EC;cursor: pointer;}
.calCurEvent{position: absolute; width: 100%;background-color: #35C2EC; text-align:center;}
.calAddEvent{position: absolute; width: 100%;}
.calAddEvent:hover{background-color: #ffaa71;	cursor: pointer;}

/* header-row of the event */
.calEventHeader,.calEventHeaderSmall{
	position: relative;	/* as the calEventIcons use postion: absolute! */
	font-weight: bold;
	font-size: 9pt;
	text-align: left;
	left: 0px;
	right: 0px;
	padding-left: 2px;
	border-radius: 6px 6px 0 0;
	-moz-border-radius: 6px 6px 0 0;
	-webkit-border-radius: 6px 6px 0 0;
}
.calEventHeaderSmall{font-size: 8pt;line-height: 10pt;}
.calEventIcons{position: absolute; right: 0px; top: 0px;}
.calEventHeaderSmall .calEventIcons img{height: 13px;}

/* body of the event */
.calEventBody,.calEventBodySmall{padding: 0px 3px 0px; left: 2px; right: 2px; height: 99%;}

.calEventBodySmall{font-size: 95%;}
.calEventLabel{font-weight: bold;	font-size: 90%;}
.calEventTitle{font-weight: bold;	font-size: 110%;}

/* table of the dayView containing 2 cols: 1) day-view, 2) todos */
.calDayView{width: 100%;}

/* calDayTods is the day-view's todo column, containing the calDayTodoHeader and the calDayTodoTable */
.calDayTodos .calDayTodosHeader {margin: 0px; padding: 2px; font-weight: bold;}
.calDayTodos .calDayTodosTable {overflow: auto;	max-height: 400px;}
.calDayTodos {width: 250px; margin-left: 10px; border: 1px solid white;}
.calDayTodosHeader {text-align: center;}

/* plannerWidget represents the whole planner, consiting of the plannerHeader and multiple plannerRowWidgets */
.plannerWidget {
	position: relative;
	top: 0px;
	left: 0px;
	width: 99.5%;
	border: 1px solid gray;
	padding-right: 3px;
}

/* plannerHeader contains a plannerHeaderTitle and multiple plannerHeaderRows */
.plannerHeader {position: relative; top: 0px; left: 0px; width: 100%;}

/* plannerRowWidget contains a plannerRowHeader and multiple eventRowWidgets in an eventRows */
.plannerRowWidget {position: relative; top: 0px; left: 0px; width: 100%;}

/* plannerScale represents a scale-row of the plannerHeader, containing multiple planner{Day|Week|Month}Scales */
.plannerScale,.plannerScaleDay{
	position: relative;
	top: 0px;
	left: 0%;
	width: 100%;
	height: 20px;
	line-height: 20px;
}
.plannerScaleDay {height: 28px;	line-height: 14px;}
.plannerDayScale,.plannerMonthScale,.plannerWeekScale,.plannerHourScale {
	position: absolute;
	top: 0px;
	text-align: center;
	height: 100%;
	border: 1px solid white;

}
.plannerHourScale {font-size: 90%;}
.plannerDayScale {font-size: 90%;}
.plannerWeekScale {line-height: 20px;}
.plannerMonthScale {font-weight: bold;}
.plannerDayScale img,.plannerWeekScale img,.plannerMonthScale img {vertical-align: middle;}

/* plannerRowHeader contains the user or category name of the plannerRowWidget */
.plannerRowHeader, .plannerHeaderTitle {
	position: absolute;
	top: 0px;
	left: 0%;
	width: 15%;		/* need to be identical for plannerRowHeader and plannerHeaderTitle and match left of eventRows/plannerHeaderRows */
	height: 100%;
	line-height: 20px;
	border: 1px solid white;
}

/* eventRows contain multiple eventRowWidgets */
.eventRows, .plannerHeaderRows {
	position: relative;
	top: 0px;
	left: 15%;	/* need to be identical for eventRows and plannerHeaderRows and match width of plannerRowHeader/plannerHeaderTitle */
	width: 85%;
}

/* eventRowWidget contains non-overlapping events */
.eventRowWidget {
	position: relative;
	top: 0px;
	left: 0px;
	width: 100%;
	height: 20px;
	border: 1px solid white;
}

.plannerEvent,.plannerEventPrivate{
	position: absolute;
	top: 0px;
	height: 100%;
	overflow: hidden;
	z-index: 20;
	border: 1px solid black;
}
.plannerEvent img,.plannerEventPrivate img {padding-top: 2px;}
.plannerEvent:hover {cursor: pointer;}

/* Special colors for the year view */
.cal_year_legend_weekend {background-color: #CCCCCC;}
.cal_year_legend {background-color: #EFEFEF;}
.cal_year_free {background-color: #FFFFCC; z-index: 0;}
.cal_year_weekend {background-color: #F9F9CC; z-index: 0;}
.cal_year_today {border-color: #EE0000; border-width: 2px;}

/* edit series or exception popup used in eventWidget */
#edit_series {
	position: fixed;
	top: 200px;
	left: 500px;
	background-color: #e8e8e8;
	z-index: 100;
	display: none;
	padding: 10px;
	border: 4px solid #404080;
	border-top: 20px solid #404080;
	-moz-border-radius: 6px;
	-webkit-border-radius: 6px;
}
#edit_series input {margin: 8px;}
#edit_series legend {font-weight: bold;}