/* Calendar Styles ------------------------------------------------------------------------------------------------------------------------------------------ */

.calendar{
	position: absolute;
	vertical-align: top;
	box-shadow: 0px 1px 3px -1px rgba(0, 0, 0, 0.4);
	margin: 0px;
	top: -1px;
	left: -1px;
	right: -1px;
	min-width: 260px;
	background-color: #ffffff;
	cursor: default;
	z-index: 10;
	border: 1px solid #CCCCCC;
	-webkit-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	-o-user-select: none;
	user-select: none;
	border-radius: 3px;	
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
}

/* End Calendar Styles -------------------------------------------------------------------------------------------------------------------------------------- */


/* Calendar Days Styles ------------------------------------------------------------------------------------------------------------------------------------- */

.calendar-days{
	font-family: "Muli", sans-serif;
	font-size: 12px;
	width: 100%;
	padding: 0px 4px 4px 4px;
}

.calendar-days tr th{
	text-align: center;
	font-weight: normal;
	font-size: 12px;
	color: #333333;
	line-height: 22px;
	height: 22px;
	vertical-align: top;
}

.calendar-days tr th.month{
	text-decoration: none;
	color: #333333;
	font-size: 14px;
	vertical-align: middle;
	line-height: 22px;
	cursor: pointer;
}

.calendar-days tr th.previous{
	text-decoration: none;
	color: #333333;
	font-size: 16px;
	vertical-align: middle;
	text-align: left;
	padding-left: 4px;
	cursor: pointer;
}

.calendar-days tr th.next{
	text-decoration: none;
	color: #333333;
	font-size: 16px;
	vertical-align: middle;
	text-align: right;
	padding-right: 4px;
	cursor: pointer;
}

.calendar-days tr th.no-previous{
	text-decoration: none;
	color: #cccccc!important;
	font-size: 16px;
	vertical-align: middle;	
	text-align: left;
	padding-left: 4px;
}

.calendar-days tr th.no-next{
	text-decoration: none;
	color: #cccccc!important;
	font-size: 16px;
	vertical-align: middle;	
	text-align: right;
	padding-right: 4px;
}

.calendar-days tr td{
	text-align: center;
	font-weight: normal;
	font-size: 12px;
	font-weight: normal;
	color: #cccccc!important;
	width: 14.285%;
	line-height: 22px;
}

.calendar-days tr td.no-arrival{
	border: 1px solid #f1f1f1;
}

.calendar-days tr td.arrival{
	border: 1px solid #9F5071;
	cursor: pointer;
	color: #9F5071!important;
}

.calendar-days tr td.arrival:hover{
	background-color: #9F5071;
	color: #fff!important;
}

.calendar-days tr td.current{
	background-color: #9F5071;
	cursor: pointer;
	color: #fff!important;
}

#calendar-icon{
	position: absolute; 
	right: 8px; 
	top: 4px;
	z-index: 9;
	color: #bbbbbb;
	cursor: pointer;
	font-size: 18px;
}

#calendar-month{
	padding-left: 5px; 
	padding-right: 40px;
}

/* End Calendar Days Styles --------------------------------------------------------------------------------------------------------------------------------- */


#calendar-month-view{
	position: relative;
}

#calendar-year-view{
	position: absolute;
	top: 0px;
	bottom: 0px;
	left: 0px;
	right: 0px;
	background-color: #fff;
	z-index: 2;
}

.calendar-years-month-available{
	width: 33.3333%;
	height: 25%;
	cursor: pointer;
	color: #333333;
	font-weight: 400;
	font-size: 18px;
}

.calendar-years-month-available:hover{
	background-color: #9F5071;
	color: #fff!important;
}

.calendar-years-month-unavailable{
	width: 33.3333%;
	height: 25%;
	color: #c0c0c0!important;
	font-weight: 400;
	font-size: 18px;
}