body {
	background-color: linen;
}

#admin {
	position: fixed;
	top: 10px;
	left: 10px;
}

#mainDiv {
	margin: auto;
	width: 90%;
	text-align: center;
}

#calendarDiv {
	margin: auto;
	width: 100%;
}

#monthYearDiv {
	margin: 20px;
	font-weight: bold;
	font-size: 24px;
	color: navy;
}

.button {
	background-color: slateblue;
	padding: 5px;
	border-radius: 5px;
	color: white;
	text-decoration: none;
	cursor: pointer;
}

.monthButton {
	background-color: slateblue;
	padding: 5px;
	border-radius: 5px;
	color: white;
	text-decoration: none;
	cursor: pointer;
}

#inputDataDiv {
	border: 1px solid black;
	border-radius: 5px;
	background-color: #559;
	color: white;
	width: 30%;
	margin: auto;
	display: none;
}

#inputDataDiv ul {
	margin: 5px;
	padding: 5px;
}

#inputDataDiv ul li {
	list-style-type: none;
}
	

/* calendar */
table.calendar {
	border-left:1px solid #999; 
	width: 100%; 
}

tr.calendar-row	{}

td.calendar-day	{
	min-height:160px; 
	font-size:11px; 
	position:relative;
	background-color: lightblue;
	-webkit-transition: background 0.5s;
	transition: background 0.5s;
} 

* html div.calendar-day {
	height:160px;
}

td.calendar-day:hover {
	background:#fff;
}

td.calendar-day-np { 
	background:#aaa; 
	min-height:160px; 
}

* html div.calendar-day-np {
	height:160px; 
}

td.calendar-day-head { 
	background:#ccc; 
	font-weight:bold; 
	text-align:center; 
	width:120px; 
	padding:5px; 
	border-bottom:1px solid #999; 
	border-top:1px solid #999; 
	border-right:1px solid #999;
}

div.day-number {
	background:#999;
	padding:5px;
	color:#fff;
	font-weight:bold;
	float:right;
	margin:-5px -5px 0 0;
	width:20px;
	text-align:center; 
}

/* shared */
td.calendar-day, td.calendar-day-np {
	width:120px;
	padding:5px;
	border-bottom:1px solid #999;
	border-right:1px solid #999; 
}