.datePicker
{
	cursor:pointer;
	height:70px;
	line-height:50px;
	position:relative;
	user-select:none;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	width:100%;
}

.datePicker .divInputBackground
{
	background-color:#292a2f;
	border-radius:10px;
	bottom:0px;
	height:50px;
	left:0px;
	position:absolute;
	width:100%;
}

.datePicker .divInputBackground:after
{
	background-color:#37383d;
	border:2px solid #3f4656;
	border-radius:10px;
	color:#888b90;
	content:">";
	display:block;
	height:46px;
	line-height:46px;
	position:absolute;
	right:0px;
	text-align:center;
	top:0px;
	transform:rotate(90deg);
	transition:border 0.25s, box-shadow 0.25s, color 0.25s, text-shadow 0.25s;
	width:46px;
}

.datePicker:hover .divInputBackground:after, .datePicker.focus .divInputBackground:after
{
    border:2px solid #cffdff;
    box-shadow:inset 0px 0px 5px #01eff9, 0px 0px 5px #01eff9;
	color:#ffffff;
	text-shadow:0px 0px 5px #01eff9;
}

.datePicker .divPlaceHolder
{
	color:#888b90;
	font-size:16px;
	height:50px;
	left:15px;
	line-height:50px;
	overflow:hidden;
	position:absolute;
	right:60px;
	text-overflow:ellipsis;
	top:20px;
	transition:color 0.25s, font-size 0.25s, left 0.25s, text-shadow 0.25s, top 0.25s;
	white-space:nowrap;
}

.datePicker.focus .divPlaceHolder
{
	color:#ffffff;
	font-size:14px;
	left:0px;
	text-shadow:0px 0px 5px #01eff9;
	top:-15px;
}

.datePicker.hasValue .divPlaceHolder
{
	font-size:14px;
	left:0px;
	top:-15px;
}

.datePicker .divInputValue
{
	bottom:0px;
	color:#ffffff;
	font-size:16px;
	height:50px;
	left:15px;
	line-height:50px;
	overflow:hidden;
	position:absolute;
	right:65px;
	user-select:none;
	-webkit-tap-highlight-color:rgba(0, 0, 0, 0);
	white-space:nowrap;
}

.datePicker .divDatePickerCalendar
{
	background-color:#292a2f;
	border-radius:10px;
	cursor:default;
	height:0px;
	left:0px;
	overflow:hidden;
	position:absolute;
	top:70px;
	transition:box-shadow 0.25s, height 0.25s;
	width:100%;
	z-index:1;
}

.datePicker.focus .divDatePickerCalendar
{
	box-shadow:0px 0px 10px rgba(0, 0, 0, 0.5);
	height:240px;
}

.datePicker .divCalendarLabel
{
	color:#ffffff;
	font-size:16px;
	height:50px;
	line-height:50px;
	text-align:center;
	white-space:nowrap;
}

.datePicker .btnPreviousMonth
{
	border-bottom:15px solid transparent;
	border-right:8px solid #888b90;
	border-top:15px solid transparent;
	cursor:pointer;
	height:0px;
	left:5px;
	margin:0px 10px;
	position:absolute;
	top:10px;
	transition:border 0.25s;
	width:0px;
}

.datePicker .btnPreviousMonth:focus, .datePicker .btnPreviousMonth:hover
{
	border-right:8px solid #ffffff;
}

.datePicker .btnNextMonth
{
	border-bottom:15px solid transparent;
	border-left:8px solid #888b90;
	border-top:15px solid transparent;
	cursor:pointer;
	height:0px;
	margin:0px 10px;
	position:absolute;
	right:5px;
	top:10px;
	transition:border 0.25s;
	width:0px;
}

.datePicker .btnNextMonth:focus, .datePicker .btnNextMonth:hover
{
	border-left:8px solid #ffffff;
}

.datePicker .divDatePickerItems
{
	padding:0px 5px;
	position:relative;
}

.datePicker .divDateItem
{
	color:#ffffff;
	cursor:pointer;
	float:left;
	font-size:9px;
	height:30px;
	line-height:30px;
	position:relative;
	text-align:center;
	transition:color 0.25s, text-shadow 0.25s;
	width:calc(100% / 7);
}

.datePicker .divDateItem.selected
{
	color:#fbd3ff;
	text-shadow:0px 0px 5px #e600ff;
}

.datePicker .divDateItem:focus, .datePicker .divDateItem:hover
{
	color:#01eff9;
	text-shadow:0px 0px 5px #01eff9;
}

.datePicker .divDateItem:before
{
	border-radius:50%;
	border:1px solid #888b90;
	content:"";
	height:24px;
	left:50%;
	position:absolute;
	top:50%;
	transform:translate(-50%, -50%);
	transition:border 0.25s, box-shadow 0.25s;
	width:24px;
}

.datePicker .divDateItem.selected:before
{
	border:1px solid #fbd3ff;
	box-shadow:inset 0px 0px 5px #e600ff, 0px 0px 5px #e600ff;
}

.datePicker .divDateItem:focus:before, .datePicker .divDateItem:hover:before
{
	border:1px solid #cffdff;
	box-shadow:inset 0px 0px 5px #01eff9, 0px 0px 5px #01eff9;
}