/** @import url(http://code.jquery.com/ui/1.10.4/themes/smoothness/jquery-ui.css); default **/
.ui-datepicker-trigger {
	float : left;
	margin: 3px 0 0 5px;
	width: auto !important;
}

.ui-datepicker-trigger:hover {
	cursor: pointer;
}

/**	=======================================================
				 CMS4U CALENDAR (HTML MODE)
=======================================================	**/
.cms4u_calendar {
	width : 100%;
	border-radius : 4px;
	border : 1px solid #CDCDCD;
	background-color : #FDFDFD;
	float : left;
	margin : 10px 25px 5px 0;
}

.cms4u_calendar .grids {
	display: flex;
	gap: 2px;
}

.cms4u_calendar.wide {
	width : calc(100% - 2px);
}

.cms4u_calendar .col33 {
	width : 33%;
	width : calc(33.33% - 2px);
}
.cms4u_calendar .colspacer {
	width : 3px;
	height : 100%;
}

.cms4u_calendar .legend {
	padding: 0 0 5px 0;
}
.cms4u_calendar .legend hr {
	border : 0;
	border-top : 1px solid #CDCDCD;
	margin : 5px 0;

}

.cms4u_calendar button {
	display  : inline;
	margin : 0;
}
.cms4u_calendar .header {
	font-size : 16px;
	text-align : center;
	background-color : #EDEDED;
	border-bottom : 1px solid #CDCDCD;
	padding-top : 3px;
	padding-bottom : 5px;
}
.cms4u_calendar .header .month {
	display : inline;
}
.cms4u_calendar .header select, .cms4u_calendar .header label {
	height : 25px;
	padding : 0;
	display : inline-block;
	margin : 10px 0;
	text-align : center;
	width : 70%;
	float : none;
}
.cms4u_calendar .header select {
	background : #FCFCFC;
}
.cms4u_calendar .header button {
	color : #020202!important;
	padding : 1px 3px;
	margin : 0;
	background-color : #CDCDCD;
	border : 1px solid #CDCDCD;
	display : inline;
}
.cms4u_calendar .header button#btn_calendar_prev:hover {
	border-top : 1px solid #D2D2D2;
	border-left : 1px solid #D2D2D2;
}
.cms4u_calendar .header button#btn_calendar_next:hover {
	border-top : 1px solid #D2D2D2;
	border-right : 1px solid #D2D2D2;
}
.cms4u_calendar .grid {
	background-color : #FCFCFC;
}
.cms4u_calendar .grid button, .cms4u_calendar .grid a, .ui-datepicker td span, .ui-datepicker td a {
	background-color : #F0F0F0;
	color : #4a4949!important;
	border : 1px solid #F0F0F0;
	border-radius : 2px;
}

.cms4u_calendar .grid button:hover, .cms4u_calendar .grid a:hover, .ui-datepicker td span, .ui-datepicker td a:hover {
	border : 1px solid #D0D0D0;
}
.cms4u_calendar .header .days {
	cursor : default;
	zoom : 1;
}
.cms4u_calendar .header .days:before, .cms4u_calendar .header .days:after {
	content : ' ';
	display : table;
}
.cms4u_calendar .header .days:after {
	clear : both;
}
.cms4u_calendar .header .days span, .cms4u_calendar .grid button, .cms4u_calendar .grid span, .cms4u_calendar .grid a, .cms4u_calendar .grid .cell {
	display : block;
	float : left;
	width : 13%;
	width : calc(14% - 8px);
	margin: 3px 1px 3px 7px;
	padding : 3px 0;
	box-sizing: border-box;
}

.cms4u_calendar .grid .cell {
	position:relative;
	height: 100%;
	padding: 4px 0;
	border-radius: 2px;
}

.cms4u_calendar .grid .cell a, .cms4u_calendar .grid .cell button {
	width: calc(50% - 2px);
	background: none!important;
	display: block;
	float: left;
	margin: 0;
	padding: 0;
	text-indent: -9999px;
	border: 0;
}

.cms4u_calendar .grid .cell span {
	color: #F2F2F2;
	padding: 0;
	margin: 0;
	float: none;
	display: block;
	position: absolute;
	top: 2px;
	left: 0;
	text-align: center;
	width: 100%;
}

.cms4u_calendar .header .days, .ui-datepicker table thead, .ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next, .ui-datepicker-title, .cms4u_calendar .grid .cell span {
	-webkit-touch-callout: none;
	-webkit-user-select: none;
	-khtml-user-select: none;
	-moz-user-select: none;
	-ms-user-select: none;
	user-select: none;
	cursor : default;
}

.cms4u_calendar .grid button.task{
	background-color : #AAFFAA;
	border-color : #AAFFAA;
}
.cms4u_calendar .grid button.task:hover {
	border-color : #22DD33;
}
 .custom_legend button.task  {
	background-color : #6FC155;
	border-color : #6FC155;
}

.cms4u_calendar .grid button.pending_task, .overview ol li div.pending_task, .custom_legend button.reservation_no_attendant ,.overview ol li div.reservation_no_attendant {
	background-color : #FFAA44;
	border-color : #FFAA44;
}
.overview ol li div.reservation_no_advance, .custom_legend button.reservation_no_advance {
	background-color : #FF372C;
	border-color : #FF372C;
}
.overview ol li div.reservation_canceled, .custom_legend button.reservation_canceled {
	background-color : #C2C2C2;
	border-color : #C2C2C2;
}
.cms4u_calendar .grid button.pending_task:hover {
	border-color : #22DD33;
}
.cms4u_calendar .grid button.vacation, .cms4u_calendar .grid button.expensive, .ui-datepicker-calendar td.expensive span, .ui-datepicker-calendar td.expensive a {
	background-color : #FFAAAA;
	border-color : #FFAAAA;
}
.cms4u_calendar .grid button.vacation:hover {
	border-color : #DD2233;
}

.cms4u_calendar .legend div {
	width : 100%;
	line-height : 30px;
	margin: 0 0 0 10px;
}

.cms4u_calendar .legend div button.available {
	border: 1px solid #D0D0D0
}


.cms4u_calendar .legend div button {
	margin: 0;
	width: 25px;
	margin: 2px 5px 0 0;
	cursor: default;
}

.cms4u_calendar .legend div:before, .cms4u_calendar .legend div:after {
	content : ' ';
	display : table;
}
.cms4u_calendar .legend div:after {
	clear : both;
}

.cms4u_calendar .grid button.selected, .ui-datepicker-calendar td.selected a {
	/**font-weight: bold;**/
	color : #F2F2F2!important;
	background: #489e1a;
}

.cms4u_calendar .grid button[disabled], .cms4u_calendar .grid a[data-disabled] {
	background : #FCFCFC;
	color : #CFCFCF!important;
	cursor: default;
}

/** ---------------------------- UI colors with states ---------------------------- **/

/**	===========================================
			SELECTED
===========================================	**/
/** full **/
.cms4u_calendar .grid button[disabled].selected, .cms4u_calendar .grid button.selected, .cms4u_calendar .grid a[data-disabled].selected, .cms4u_calendar .grid a.selected, .ui-datepicker-calendar td.selected span {
	background: #489E1A;
}

/** triangles **/
.cms4u_calendar .grid button.selected.start {
	background: linear-gradient(135deg, #F0F0F0 50%, #489E1A 50%);
}

.cms4u_calendar .grid button.selected.end {
	background: linear-gradient(135deg, #489E1A 50%, #F0F0F0 50%);
}

/** selected -> selected **/
.cms4u_calendar .grid button.selected-selected, .cms4u_calendar .grid button[disabled].selected-selected, .cms4u_calendar .grid a.selected-selected, .cms4u_calendar .grid .cell.selected-selected span, .ui-datepicker-calendar td.selected-selected span {
	background: linear-gradient(135deg, #489E1A 50%, #489E1A 50%);
}
/** selected -> rented **/
.cms4u_calendar .grid button.selected-rented, .cms4u_calendar .grid button[disabled].selected-rented, .cms4u_calendar .grid a.selected-rented, .cms4u_calendar .grid .cell.selected-rented span, .ui-datepicker-calendar td.selected-rented span {
	background: linear-gradient(135deg, #489E1A 50%, #E09845 50%);
}
/** selected -> option **/
.cms4u_calendar .grid button.selected-option, .cms4u_calendar .grid button[disabled].selected-option, .cms4u_calendar .grid a.selected-option, .cms4u_calendar .grid .cell.selected-option span, .ui-datepicker-calendar td.selected-option span {
	background: linear-gradient(135deg, #489E1A 50%, #28A1ED 50%);
}
/** selected -> closed **/
.cms4u_calendar .grid button.selected-closed, .cms4u_calendar .grid button[disabled].selected-closed, .cms4u_calendar .grid a.selected-closed, .cms4u_calendar .grid .cell.selected-closed span, .ui-datepicker-calendar td.selected-closed span {
	background: linear-gradient(135deg, #489E1A 50%, #BA4444 50%);
}
/** selected -> booking **/
.cms4u_calendar .grid button.selected-booking, .cms4u_calendar .grid button[disabled].selected-booking, .cms4u_calendar .grid a.selected-booking, .cms4u_calendar .grid .cell.selected-booking span, .ui-datepicker-calendar td.selected-booking span {
	background: linear-gradient(135deg, #489E1A 50%, #FCFCFC 50%);
}

/**	===========================================
			RENTED
===========================================	**/
/** full **/
.cms4u_calendar .grid button[disabled].rented, .cms4u_calendar .grid button.rented, .cms4u_calendar .grid a[data-disabled].rented, .cms4u_calendar .grid a.rented, .ui-datepicker-calendar td.rented span {
	background: #E09845;
}

/** triangles **/
.cms4u_calendar .grid button.rented.start {
	background: linear-gradient(135deg, #F0F0F0 50%, #E09845 50%);
}

.cms4u_calendar .grid button.rented.end {
	background: linear-gradient(135deg, #E09845 50%, #F0F0F0 50%);
}

/** rented -> selected **/
.cms4u_calendar .grid button.rented-selected, .cms4u_calendar .grid button[disabled].rented-selected, .cms4u_calendar .grid a.rented-selected, .cms4u_calendar .grid .cell.rented-selected span, .ui-datepicker-calendar td.rented-selected span {
	background: linear-gradient(135deg, #E09845 50%, #489E1A 50%);
}
/** rented -> rented **/
.cms4u_calendar .grid button.rented-rented, .cms4u_calendar .grid button[disabled].rented-rented, .cms4u_calendar .grid a.rented-rented, .cms4u_calendar .grid .cell.rented-rented span, .ui-datepicker-calendar td.rented-rented span {
	background: linear-gradient(135deg, #E09845 50%, #E09845 50%);
}
/** rented -> option **/
.cms4u_calendar .grid button.rented-option, .cms4u_calendar .grid button[disabled].rented-option, .cms4u_calendar .grid a.rented-option, .cms4u_calendar .grid .cell.rented-option span, .ui-datepicker-calendar td.rented-option span {
	background: linear-gradient(135deg, #E09845 50%, #28A1ED 50%);
}
/** rented -> closed **/
.cms4u_calendar .grid button.rented-closed, .cms4u_calendar .grid button[disabled].rented-closed, .cms4u_calendar .grid a.rented-closed, .cms4u_calendar .grid .cell.rented-closed span, .ui-datepicker-calendar td.rented-closed span {
	background: linear-gradient(135deg, #E09845 50%, #BA4444 50%);
}
/** rented -> booking **/
.cms4u_calendar .grid button.rented-booking, .cms4u_calendar .grid button[disabled].rented-booking, .cms4u_calendar .grid a.rented-booking, .cms4u_calendar .grid .cell.rented-booking span, .ui-datepicker-calendar td.rented-booking span {
	background: linear-gradient(135deg, #E09845 50%, #FCFCFC 50%);
}

/**	===========================================
			OPTION
===========================================	**/
/** full **/
.cms4u_calendar .grid button[disabled].option, .cms4u_calendar .grid button.option, .cms4u_calendar .grid a[data-disabled].option, .cms4u_calendar .grid a.option, .ui-datepicker-calendar td.option span {
	background: #28A1ED;
}

/** triangles **/
.cms4u_calendar .grid button.option.start {
	background: linear-gradient(135deg, #F0F0F0 50%, #28A1ED 50%);
}

.cms4u_calendar .grid button.option.end {
	background: linear-gradient(135deg, #28A1ED 50%, #F0F0F0 50%);
}

/** option -> selected **/
.cms4u_calendar .grid button.option-selected, .cms4u_calendar .grid button[disabled].option-selected, .cms4u_calendar .grid a.option-selected, .cms4u_calendar .grid .cell.option-selected span, .ui-datepicker-calendar td.option-selected span {
	background: linear-gradient(135deg, #28A1ED 50%, #489E1A 50%);
}
/** option -> rented **/
.cms4u_calendar .grid button.option-rented, .cms4u_calendar .grid button[disabled].option-rented, .cms4u_calendar .grid a.option-rented, .cms4u_calendar .grid .cell.option-rented span, .ui-datepicker-calendar td.option-rented span {
	background: linear-gradient(135deg, #28A1ED 50%, #E09845 50%);
}
/** option -> option **/
.cms4u_calendar .grid button.option-option, .cms4u_calendar .grid button[disabled].option-option, .cms4u_calendar .grid a.option-option, .cms4u_calendar .grid .cell.option-option span, .ui-datepicker-calendar td.option-option span {
	background: linear-gradient(135deg, #28A1ED 50%, #28A1ED 50%);
}
/** option -> closed **/
.cms4u_calendar .grid button.option-closed, .cms4u_calendar .grid button[disabled].option-closed, .cms4u_calendar .grid a.option-closed, .cms4u_calendar .grid .cell.option-closed span, .ui-datepicker-calendar td.option-closed span {
	background: linear-gradient(135deg, #28A1ED 50%, #BA4444 50%);
}
/** option -> booking **/
.cms4u_calendar .grid button.option-booking, .cms4u_calendar .grid button[disabled].option-booking, .cms4u_calendar .grid a.option-booking, .cms4u_calendar .grid .cell.option-booking span, .ui-datepicker-calendar td.option-booking span {
	background: linear-gradient(135deg, #28A1ED 50%, #FCFCFC 50%);
}

/**	===========================================
			CLOSED
===========================================	**/
/** full **/
.cms4u_calendar .grid button[disabled].closed, .cms4u_calendar .grid button.closed, .cms4u_calendar .grid a[data-disabled].closed, .cms4u_calendar .grid a.closed, .ui-datepicker-calendar td.closed span {
	background: #BA4444;
}

/** triangles **/
.cms4u_calendar .grid button.closed.start {
	background: linear-gradient(135deg, #F0F0F0 50%, #BA4444 50%);
}

.cms4u_calendar .grid button.closed.end {
	background: linear-gradient(135deg, #BA4444 50%, #F0F0F0 50%);
}

/** closed -> selected **/
.cms4u_calendar .grid button.closed-selected, .cms4u_calendar .grid button[disabled].closed-selected, .cms4u_calendar .grid a.closed-selected, .cms4u_calendar .grid .cell.closed-selected span, .ui-datepicker-calendar td.closed-selected span {
	background: linear-gradient(135deg, #BA4444 50%, #489E1A 50%);
}
/** closed -> rented **/
.cms4u_calendar .grid button.closed-rented, .cms4u_calendar .grid button[disabled].closed-rented, .cms4u_calendar .grid a.closed-rented, .cms4u_calendar .grid .cell.closed-rented span, .ui-datepicker-calendar td.closed-rented span {
	background: linear-gradient(135deg, #BA4444 50%, #E09845 50%);
}
/** closed -> option **/
.cms4u_calendar .grid button.closed-option, .cms4u_calendar .grid button[disabled].closed-option, .cms4u_calendar .grid a.closed-option, .cms4u_calendar .grid .cell.closed-option span, .ui-datepicker-calendar td.closed-option span {
	background: linear-gradient(135deg, #BA4444 50%, #28A1ED 50%);
}
/** closed -> closed **/
.cms4u_calendar .grid button.closed-closed, .cms4u_calendar .grid button[disabled].closed-closed, .cms4u_calendar .grid a.closed-closed, .cms4u_calendar .grid .cell.closed-closed span, .ui-datepicker-calendar td.closed-closed span {
	background: linear-gradient(135deg, #BA4444 50%, #BA4444 50%);
}
/** closed -> booking **/
.cms4u_calendar .grid button.closed-booking, .cms4u_calendar .grid button[disabled].closed-booking, .cms4u_calendar .grid a.closed-booking, .cms4u_calendar .grid .cell.closed-booking span, .ui-datepicker-calendar td.closed-booking span {
	background: linear-gradient(135deg, #BA4444 50%, #FCFCFC 50%);
}

/**	===========================================
			BOOKING
===========================================	**/
/** full **/
.cms4u_calendar .grid button[disabled].booking, .cms4u_calendar .grid button.booking, .cms4u_calendar .grid a[data-disabled].booking, .cms4u_calendar .grid a.booking, .ui-datepicker-calendar td.booking span {
	background: #FCFCFC;
}

/** triangles **/
.cms4u_calendar .grid button.booking.start {
	background: linear-gradient(135deg, #F0F0F0 50%, #FCFCFC 50%);
}

.cms4u_calendar .grid button.booking.end {
	background: linear-gradient(135deg, #FCFCFC 50%, #F0F0F0 50%);
}

/** booking -> selected **/
.cms4u_calendar .grid button.booking-selected, .cms4u_calendar .grid button[disabled].booking-selected, .cms4u_calendar .grid a.booking-selected, .cms4u_calendar .grid .cell.booking-selected span, .ui-datepicker-calendar td.booking-selected span {
	background: linear-gradient(135deg, #FCFCFC 50%, #489E1A 50%);
}
/** booking -> rented **/
.cms4u_calendar .grid button.booking-rented, .cms4u_calendar .grid button[disabled].booking-rented, .cms4u_calendar .grid a.booking-rented, .cms4u_calendar .grid .cell.booking-rented span, .ui-datepicker-calendar td.booking-rented span {
	background: linear-gradient(135deg, #FCFCFC 50%, #E09845 50%);
}
/** booking -> option **/
.cms4u_calendar .grid button.booking-option, .cms4u_calendar .grid button[disabled].booking-option, .cms4u_calendar .grid a.booking-option, .cms4u_calendar .grid .cell.booking-option span, .ui-datepicker-calendar td.booking-option span {
	background: linear-gradient(135deg, #FCFCFC 50%, #28A1ED 50%);
}
/** booking -> closed **/
.cms4u_calendar .grid button.booking-closed, .cms4u_calendar .grid button[disabled].booking-closed, .cms4u_calendar .grid a.booking-closed, .cms4u_calendar .grid .cell.booking-closed span, .ui-datepicker-calendar td.booking-closed span {
	background: linear-gradient(135deg, #FCFCFC 50%, #BA4444 50%);
}
/** booking -> booking **/
.cms4u_calendar .grid button.booking-booking, .cms4u_calendar .grid button[disabled].booking-booking, .cms4u_calendar .grid a.booking-booking, .cms4u_calendar .grid .cell.booking-booking span, .ui-datepicker-calendar td.booking-booking span {
	background: linear-gradient(135deg, #FCFCFC 50%, #FCFCFC 50%);
}



/** /---------------------------- UI colors with states ---------------------------- **/

/**	=======================================================
		   CMS4U CALENDAR INLINE (JQUERY MODE)
=======================================================	**/
.cms4u_calendar_jquery {
	background: #FEFEFE;
	border: 1px solid #A2A2A2;
	display: flex;
	flex-wrap: wrap;
	justify-content: center;
}

.cms4u_calendar_jquery .label {
	border-top: 1px solid #A2A2A2;
	background: #F0F0F0;
	color: #020202;
	padding: 0 10px;
	box-sizing: border-box;
	flex: 0 0 100%;
	user-select: none;
}

.cms4u_calendar_jquery .label span {
	background: #F0F0F0;
	display: inline-block;
	margin: 0 0 0 10px;
	padding: 5px 10px;
	box-sizing: border-box;
	min-width: 160px;
	text-align: center;
	font-weight: 400;
}

.cms4u_calendar_jquery > div {

}

.cms4u_calendar_jquery .datepicker-container {
	flex: 2;
	border-right: 1px solid #A2A2A2;
}

.cms4u_calendar_jquery .timepicker-container {
	flex: 1;
	display: flex;
	border-left: 1px solid #A2A2A2;
	border-radius: 3px;
	background: #F5F5F5;
}

.cms4u_calendar_jquery .datepicker-container + .timepicker-container {
	margin: 0 0 0 5px;
}

.cms4u_calendar_jquery .datepicker-container, .cms4u_calendar_jquery .timepicker-container {
	padding: 0 0 5px;
}

.cms4u_calendar_jquery .datepicker-container .ui-datepicker {
	border: 0;
	border-radius: 0;
}

.cms4u_calendar_jquery .datepicker-container .ui-datepicker td a:hover {
	background: #b91b21;
	color: #FEFEFE!important;
}

.cms4u_calendar_jquery .timepicker-container .timepicker {
	border: 0;
}

.cms4u_calendar_jquery .timepicker-container .timepicker .title {
	padding: 26px 0;
}

.cms4u_calendar_jquery .timepicker-container .timepicker .slots {
	max-height: 162px;
}

/**	=======================================================
				 JQUERY DATEPICKER TWEAKS
=======================================================	**/
.ui-datepicker td a.ui-state-active {
	background: #b91b21;
	color: #FEFEFE!important;
}

	.ui-datepicker td.ui-state-disabled span {
		border : 1px solid #F5F5F5;
		background-color : #F5F5F5;
		color : #D2D2D2!important;
		cursor: default;
	}


/** =========== JQUERY UI DATAPICKER =============== **/
input[type="text"].datepicker  {
	width : 90%;
	width : calc(100% - 50px);
	float : left;
}
img.ui-datepicker-trigger {
	width : 23px;
	height : 28px;
	float : left;
	margin : 5px 0 0 5px;
}

.ui-datepicker {
	background : #FFFFFF;
	border : 1px solid #A2A2A2;
	border-radius : 3px;
}

.ui-datepicker-calendar td span, .ui-datepicker-calendar td a {
	text-align : center;
}
/* workarounds */
/* reset extra padding in Firefox, see h5bp.com/l */
input.ui-button::-moz-focus-inner,
button.ui-button::-moz-focus-inner {
	border: 0;
	padding: 0;
}
.ui-datepicker {
	width: 17em;
	display: none;
}

.ui-datepicker.ui-datepicker-inline {
  width: 100%;
  min-width: 300px;
}

.ui-datepicker .ui-datepicker-header {
	position: relative;
	padding: .2em 0;
	background : #ededed;
}

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
	border: 1px solid #cdcdcd;
	color: #020202;
	text-align: center;
	text-decoration : none;
	border-radius : 5px;
	position: absolute;
	top: 6px;
	height : 34px;
	width : 34px;
	background-color: #cdcdcd;
	cursor : pointer;
	text-align : center;
	line-height : 34px;
}
.ui-datepicker .ui-datepicker-prev {
	left : 2px;
}
.ui-datepicker .ui-datepicker-next {
	right : 2px;
}
.ui-datepicker .ui-datepicker-title {
	margin: 0 52px;
	line-height: 1.8em;
	text-align: center;
	overflow:hidden;
	display: flex;
	justify-content: space-evenly;
	align-items: center;
}
.ui-datepicker .ui-datepicker-title select {
	font-size: 1em;
	margin: 1px 0;
}
.ui-datepicker select.ui-datepicker-month,
.ui-datepicker select.ui-datepicker-year {
	width:	75px;
	float : left;
}
.ui-datepicker table thead {
	background:  #ededed;
	border-bottom: 1px solid #cdcdcd;
}
.ui-datepicker table {
	width: 100%;
	font-size: .9em;
	border-collapse: collapse;
	margin: 0 0 .4em;
}
.ui-datepicker th {
	padding: .7em .3em;
	text-align: center;
	font-weight: bold;
	border: 0;
}
.ui-datepicker td {
	border: 0;
	padding: 1px;
}
.ui-datepicker td span,
.ui-datepicker td a {
	display: block;
	padding: .2em;
	text-decoration: none;
}
.ui-datepicker .ui-datepicker-buttonpane {
	background-image: none;
	margin: .7em 0 0 0;
	padding: 0 .2em;
	border-left: 0;
	border-right: 0;
	border-bottom: 0;
}
.ui-datepicker .ui-datepicker-buttonpane button {
	float: right;
	margin: .5em .2em .4em;
	cursor: pointer;
	padding: .2em .6em .3em .6em;
	width: auto;
	overflow: visible;
}
.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current {
	float: left;
}

/* with multiple calendars */
.ui-datepicker.ui-datepicker-multi {
	width: auto;
}
.ui-datepicker-multi .ui-datepicker-group {
	float: left;
}
.ui-datepicker-multi .ui-datepicker-group table {
	width: 95%;
	margin: 0 auto .4em;
}
.ui-datepicker-multi-2 .ui-datepicker-group {
	width: 50%;
}
.ui-datepicker-multi-3 .ui-datepicker-group {
	width: 33.3%;
}
.ui-datepicker-multi-4 .ui-datepicker-group {
	width: 25%;
}
.ui-datepicker-multi .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-multi .ui-datepicker-group-middle .ui-datepicker-header {
	border-left-width: 0;
}
.ui-datepicker-multi .ui-datepicker-buttonpane {
	clear: left;
}
.ui-datepicker-row-break {
	clear: both;
	width: 100%;
	font-size: 0;
}

/* RTL support */
.ui-datepicker-rtl {
	direction: rtl;
}
.ui-datepicker-rtl .ui-datepicker-prev {
	right: 2px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next {
	left: 2px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-prev:hover {
	right: 1px;
	left: auto;
}
.ui-datepicker-rtl .ui-datepicker-next:hover {
	left: 1px;
	right: auto;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane {
	clear: right;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button {
	float: left;
}
.ui-datepicker-rtl .ui-datepicker-buttonpane button.ui-datepicker-current,
.ui-datepicker-rtl .ui-datepicker-group {
	float: right;
}
.ui-datepicker-rtl .ui-datepicker-group-last .ui-datepicker-header,
.ui-datepicker-rtl .ui-datepicker-group-middle .ui-datepicker-header {
	border-right-width: 0;
	border-left-width: 1px;
}


.cms4u_calendar .grid a {
	font-size: 12px;
	text-align: center;
	margin: 3px 1px 3px 6px;
}

.cms4u_calendar .grid span input[type="text"] {
	max-width: calc(96% - 10px);
	margin: 0 auto;
	text-align: right;
	padding-right: 10px;
}

.cms4u_calendar .grid span input[type="text"]::placeholder {
	text-align: center;
}

.cms4u_calendar .grid span input[type="text"]:disabled {
	cursor: not-allowed;
	opacity: 0.2;
}

/**	=======================================================
					  TIMEPICKER
=======================================================	**/
.timepicker {
	background: #F5F5F5;
	border: 1px solid #A2A2A2;
	/**width: 150px;**/
	box-sizing: border-box;
	align-self: stretch;
	width: 100%;
}

.timepicker .title {
	padding: 9px 0;
	background: #ededed;
	border-bottom: 1px solid #cdcdcd;
}

.timepicker .title span {
	display: block;
	text-align: center;
	user-select: none;
}

.timepicker .slots {
	padding: 4px;
	box-sizing: border-box;
	max-height: 195px;
	overflow-y: scroll;
	scrollbar-width: thin;
	scrollbar-color: #b91b21 #cdcdcd;
	background: #FEFEFE;
	display: flex;
	flex-wrap: wrap;
	gap: 2px;
}

.timepicker .slots.empty {
	padding: 0;
}

.timepicker .slots button {
	flex: 0 0 100%;
	margin: 0;
}


.timepicker.inactive, .timepicker.inactive .slots button {
	cursor: not-allowed;
}

.timepicker.inactive .slots {
	opacity: 0.5;
}

@media only screen and (max-width: 479px) {
	.cms4u_calendar_jquery .datepicker-container {
		border: 0;
	}

	.cms4u_calendar_jquery .timepicker-container {
		border: 0;
		border-top: 1px solid #A2A2A2;
	}

	.cms4u_calendar_jquery .datepicker-container + .timepicker-container {
		margin: 0;
	}

	.cms4u_calendar_jquery .label {
		padding: 5px 0 0;
		text-align: center;
	}

	.cms4u_calendar_jquery .label span {
		display: block;
		margin: 0;
		padding: 10px 0;
		margin: 5px 0 0;
	}
}

@media only screen and (max-width: 1279px) {
	.cms4u_calendar .col33 {
		width : 100%;
	}
	.cms4u_calendar .colspacer {
		display : none;
	}

	.cms4u_calendar .header .days span, .cms4u_calendar .grid button, .cms4u_calendar .grid span {}
}