/**
* jQuery DateSelect
* @author biohzrdmx <github.com/biohzrdmx>
* @license MIT
*/
.date-select { 
	
	position: fixed !important; 
	z-index:  2147483646 !important;
	
	top: 			0px !important;
	bottom: 		0px !important;
	margin-top: 	0px !important;
	left: 			0px !important;
	margin-left: 	0px !important;
	
	float: 			none !important;
	display: 		inline-block;
	
	width: 			100vw;
	height: 		100vh;
	box-sizing: 	border-box !important;
	padding:		10vh 10% 60px 10%; 
	padding-top: 	calc(50vh - 160px);
	background-color: 	rgba(0,0,0,0.70);
	font-family: 	"DejaVu Sans Condensed", Helvetica, Arial, "sans-serif" !important; 
	text-align:		center;

}



.date-select .popup {
	
	z-index:  2147483647 !important;
	
	position: relative !important;
	display: inline-block;
	float: none;
	box-sizing: border-box !important;
	
	top: 0px !important;
	margin-top: auto !important;
	left: auto !important;
	margin-left: auto !important;
	right:auto !important;
	margin-right: auto;
	
	
	width: 100%;
	max-width: 600px !important;
	height: 320px;
	
	padding: 10px ;
	
	background: #FFF;
	
	-webkit-box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
	box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.3);
	
	border-radius:12px;
	overflow: hidden;
	
}




.date-select .tip {

	position: absolute;
	left: 12px;
	top: -12px;
	z-index: 5;
	width: 0;
	height: 0;
	border-left: 9px solid transparent;
	border-right: 9px solid transparent;
	border-bottom: 11px solid rgba(0,0,0,0.1);
	
}

.date-select .tip:before {

	content: ' ';
	position: absolute;
	left: -8px;
	top: 2px;
	z-index: 20;
	width: 0;
	height: 0;
	border-left: 8px solid transparent;
	border-right: 8px solid transparent;
	border-bottom: 10px solid #FFF;
	
}

.date-select .select {

	width: 31.33%;
	height: 200px;
	float: left;
	margin: 1%;
	
	
	
	color: #222;
	position: relative;
	cursor: default;
	display:inline-block;
	box-sizing: border-box;
	background-color: rgba(238,241,238,0.20)
	
}

.date-select .select.year {

	margin-right: 0;
	
}

.date-select .select span i.icon,
.date-select .select div.switch i.icon { display: none !important; }

.date-select .select span,
.date-select .select div.switch

{

	display: inline-block;
	position: relative;
	width: 100%;
	margin: 0 0px 0;
	box-sizing: border-box;
	text-align: center;
	float:left;
	
	font-family: inherit;
	font-weight: 200 !important
	
}

.date-select .select span.num {

	font-size: 2.5rem;
	letter-spacing: 0px;
	font-weight: 400 !important;
	color: #444;
	padding-top: 12px;
	font-family: inherit;
	
}

.date-select .select span.text {

	font-size: 		1.33rem;
	margin-top: 	0px;
	font-weight: 	200;
	color: 			#ccc;
	font-family: 	inherit;
	
}

.date-select .select:hover {

	
}

.date-select .select:hover span {

	color:rgba(0,62,136,1.00);
}

.date-select .select div.switch.btn-arrow {

		background-position: center;
		background-repeat: no-repeat;
		background-size: 50px;
		background-color: rgba(192,192,192,0.15);
		border-radius: 14px;
	
} 

.date-select .select div.switch.btn-arrow:hover {
	
	
	background-size: 40px;
	background-color: rgba(0,0,0,0.33);
	
}



.date-select .select div.switch.btn-arrow.btn-up, 
.date-select .select div.switch.btn-arrow.btn-down,
.date-select .select div.switch.btn-arrow.btn-up2, 
.date-select .select div.switch.btn-arrow.btn-down2 { 
	
	width: 100%;
	opacity:					0.9;
	height: 52px;

}

.date-select .select.year div.switch.btn-arrow.btn-up, 
.date-select .select.year div.switch.btn-arrow.btn-down,
.date-select .select.year div.switch.btn-arrow.btn-up2, 
.date-select .select.year div.switch.btn-arrow.btn-down2 { 
	
	width: 50%;
	height: 52px;

}


.date-select .select.year div.switch.btn-arrow.btn-up2, 
.date-select .select.year div.switch.btn-arrow.btn-down2 { 
	
	border-bottom-left-radius: 0px;
	border-top-left-radius:  0px;

}



.date-select .select.year div.switch.btn-arrow.btn-up, 
.date-select .select.year div.switch.btn-arrow.btn-down { 
	
	border-bottom-right-radius: 0px;
	border-top-right-radius:  	0px;

}


.date-select .select div.switch.btn-arrow.btn-up {

	background-image: url("pic/up.svg");
	
}

.date-select .select div.switch.btn-arrow.btn-down {

	position:absolute;
	left:0px;
	bottom:0px;
	background-image: url("pic/down.svg");
	
}

.date-select .select div.switch.btn-arrow.btn-up2 {

	background-image: url("pic/up_d.svg");
	
}

.date-select .select div.switch.btn-arrow.btn-down2 {

	position:absolute;
	left:50%;
	bottom:0px;
	background-image: url("pic/down_d.svg");
	
}


.date-select .buttons {

	margin: 0px auto 0;
	width: 100%;
	padding:20px;
	box-sizing: border-box;
}

.date-select .buttons div.switch {

	display: block;
	width: 44%;
	margin-left: 6.5px;
	margin-top: 20px;
	height: 58px;
	background-color: rgba(222,222,222,1.00);
	border-radius: 5px;
	float: left;
	background-size: 48px; 
	background-repeat: no-repeat; 
	background-position: center;
	-webkit-box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.2);
	box-shadow: 1px 1px 3px 0 rgba(0,0,0,0.2);
	
}

.date-select .buttons div.switch:last-child { float:right }

.date-select .buttons div.switch:hover {

	color: #FFF;
}

.date-select .buttons div.switch.btn-cancel { 

	background-image: url("pic/cancel.svg")

}
.date-select .buttons div.switch.btn-ok {

	background-color: rgba(255,0,128,1.00);
	background-image:url("pic/ok.svg")
		
}

.date-select .buttons div.switch.btn-ok:hover {

	background-color: #333;
}

.date-select .buttons div.switch.btn-cancel:hover {

	background-color: #D95005;
}


button.opencontrol 	{ display:inline-block; position:absolute; min-width:32px; box-sizing: border-box; margin-left:0px; margin-right:0px; margin-top:2px; min-height:53px; }
button.opencontrol 	{ width:64px; margin-left: -12px; border-bottom-left-radius: 6px; border-top-left-radius: 6px; } 
button.opencontrol 	{ outline:none; border:0px; background-color: rgba(192,192,192,1.00); background-image: url('pic/calendar.svg'); background-position: center 14px; background-repeat: no-repeat; background-size: 24px; cursor:pointer; } 
button.opencontrol:hover 	{ background-color: rgba(156,156,156,1.00);  } 










.date-select .select div.switch.locked { background-image:url("pic/cancel.svg") !important; }










