/* ==========================================================================
   $BASE-PICKER
   ========================================================================== */
/**
 * Note: the root picker element should *NOT* be styled more than what’s here.
 */
.picker {position:absolute;z-index:-1;font-size:12px;color:#000000;line-height:1.2;-webkit-user-select:none;-moz-user-select:none;-ms-user-select:none;user-select:none;text-align:left;}
.picker--opened{z-index:10000;}
/**
 * The picker input element.
 */
.picker__input {cursor:default;}
/**
 * When the picker is opened, the input element is “activated”.
 */
.picker__input.picker__input--active {border-color:#0089ec;}
/**
 * The holder is the only “scrollable” top-level container element.
 */
.picker__holder {overflow-y:auto;width:100%;-webkit-overflow-scrolling:touch;}

/*!
 * Default mobile-first, responsive styling for pickadate.js
 * Demo: http://amsul.github.io/pickadate.js
 */
/**
 * Note: the root picker element should *NOT* be styled more than what’s here.
 */
/**
 * Make the holder and frame fullscreen.
 */
.picker__holder,
.picker__frame {top:0;right:0;bottom:0;left:0;-webkit-transform:translateY(100%);-ms-transform:translateY(100%);transform:translateY(100%);}
html.ie8 .picker__holder,
html.ie8 .picker__frame {margin-top:-999em}

/**
 * The holder should overlay the entire screen.
 */
.picker__holder {position:fixed;transition:background 0.15s ease-out, -webkit-transform 0s 0.15s;transition:background 0.15s ease-out, transform 0s 0.15s;-webkit-backface-visibility:hidden;}
/**
 * The frame that bounds the box contents of the picker.
 */
.picker__frame {position:absolute;width:100%;min-width:256px;max-width:666px;margin:0 auto;opacity:0;transition:all 0.15s ease-out;-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";filter:alpha(opacity=0);-moz-opacity:0;}
@media (min-height: 33.875em) {.picker__frame {overflow:visible;top:auto;bottom:-100%;max-height:80%;}}
@media (min-height: 40.125em) {.picker__frame {margin-bottom:7.5%;}}
/**
 * The wrapper sets the stage to vertically align the box contents.
 */
.picker__wrap {display:table;width:100%;height:100%;}
@media (min-height: 33.875em) {.picker__wrap {display:block;}}
/**
 * The box contains all the picker contents.
 */
.picker__box {display:table-cell;background:#ffffff;vertical-align:middle;}
@media (min-height: 26.5em) {
	.picker__table tbody td {font-size:12px !important;}
	.picker__box {font-size:1.25em;}
}
@media (min-height: 33.875em) {.picker__box {display:block;border:1px solid #777777;border-top-color:#898989;border-bottom-width:0;border-radius:5px 5px 0 0;box-shadow:0 12px 36px 16px rgba(0, 0, 0, 0.24);font-size:1.33em;}}
@media (min-height: 40.125em) {.picker__box {border-bottom-width:1px;border-radius:5px;font-size:1.5em;}}
/**
 * When the picker opens...
 */
.picker--opened .picker__holder {background:transparent;background:rgba(0, 0, 0, 0.32);zoom:1;transition:background 0.15s ease-out;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-ms-filter:"progid:DXImageTransform.Microsoft.gradient(startColorstr=#1E000000,endColorstr=#1E000000)";}
.picker--opened .picker__frame {opacity:1;-webkit-transform:translateY(0);-ms-transform:translateY(0);transform:translateY(0);-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";filter:alpha(opacity=100);-moz-opacity:1;}

html.ie8 .picker--opened .picker__holder,
html.ie8 .picker--opened .picker__frame{margin-top:0}

@media (min-height: 33.875em) {.picker--opened .picker__frame {top:auto;bottom:0;}}