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

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