/**
 * DatePickerX
 *
 * Cool light visual date picker on pure JavaScript
 * Browsers support: Chrome 45+, FireFox 40+, Safari 8+, IE10+, iOS Safari 8+, Android Browser 4.4+
 *
 * @author    Alexander Krupko <alex@avrora.team>
 * @copyright 2016 Avrora Team www.avrora.team
 * @license   MIT
 * @tutorial  http://datepickerx.avrora.team
 * @version   1.0.4
 */

.date-picker-x-container{position:relative}.date-picker-x{background:#444;box-sizing:content-box;color:#fff;display:none;font:18px/1 Arial;padding:10px;position:absolute;top:100%;-webkit-transform:translateY(15px);transform:translateY(15px);-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;width:308px;z-index:1}.date-picker-x::before{border-color:#444 transparent;border-style:solid;border-width:0 10px 10px;bottom:100%;content:"";left:20px;position:absolute}.date-picker-x.to-top{bottom:100%;top:auto;-webkit-transform:translateY(-15px);transform:translateY(-15px)}.date-picker-x.to-top::before{border-width:10px 10px 0;bottom:auto;top:100%}.date-picker-x.active{display:block}.date-picker-x *{box-sizing:border-box}.date-picker-x .dpx-title-box{-webkit-box-align:center;-ms-flex-align:center;align-items:center;border-bottom:1px solid #ccc;display:-webkit-box;display:-ms-flexbox;display:flex;height:45px;-webkit-box-pack:justify;-ms-flex-pack:justify;justify-content:space-between;padding-bottom:10px}.date-picker-x .dpx-next,.date-picker-x .dpx-prev{color:rgba(255,255,255,.6);cursor:pointer;display:block;font-size:22px;line-height:50px;text-align:center;transition:.2s;width:50px}.date-picker-x .dpx-next:hover,.date-picker-x .dpx-prev:hover{color:#fff}.date-picker-x .dpx-title{display:block;font-size:18px;line-height:40px;padding:0 10px}.date-picker-x .dpx-btns,.date-picker-x .dpx-content-box{display:-webkit-box;display:-ms-flexbox;padding-top:10px}.date-picker-x .dpx-item:not(.dpx-weekday),.date-picker-x:not([data-dpx-type=year]) .dpx-title{cursor:pointer}.date-picker-x .dpx-content-box{box-sizing:content-box;display:flex;-ms-flex-wrap:wrap;flex-wrap:wrap;height:288px;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.date-picker-x .dpx-btns{border-top:1px solid #ccc;display:flex}.date-picker-x .dpx-btns .dpx-item{-webkit-box-flex:1;-ms-flex:1 1 0;flex:1 1 0;height:30px!important}.date-picker-x .dpx-item{-webkit-box-align:center;-ms-flex-align:center;align-items:center;display:-webkit-box;display:-ms-flexbox;display:flex;-webkit-box-flex:1;-ms-flex:1 0 25%;flex:1 0 25%;-webkit-box-pack:center;-ms-flex-pack:center;justify-content:center}.date-picker-x .dpx-item:not(.dpx-weekday):hover{box-shadow:inset 0 0 0 2px #3385ff,inset 0 0 0 4px #444}.date-picker-x .dpx-weekday{font-size:15px;height:24px!important}.date-picker-x[data-dpx-type=day] .dpx-item{-ms-flex-preferred-size:44px;flex-basis:44px;height:44px}.date-picker-x .dpx-current{box-shadow:inset 0 0 0 2px #66a3ff}.date-picker-x .dpx-selected{background:#06f}.date-picker-x .dpx-weekend{color:#f99}.date-picker-x .dpx-out{color:#bbb}.date-picker-x .dpx-disabled{color:#666!important;cursor:default!important;box-shadow:none!important}.date-picker-x .dpx-disabled.dpx-current{box-shadow:inset 0 0 0 2px #66a3ff!important}