= time-preview-panel($bg: rgba(200,200,200,0.8))
  background-color: $bg
  padding: 7px
  border: 1px solid #777
  border-left-size: 0
  border-bottom-right-radius: 8px
  border-top-right-radius: 8px
.menu-time-preview-container
  position: fixed
  top: 30%
  left: 0
  z-index: 103
  .button
    margin: 0
  .open-time-preview-handle
    +time-preview-panel()
    span
      @extend .fa, .fa-2x, .fa-calendar
  .close-time-preview-handle
    float: right
    color: $warning-color
    span
      @extend .fa, .fa-lg, .fa-times
  .menu-time-preview-selection-container
    min-width: 200px
    +time-preview-panel()
    .activate-time-preview-button
      +button()
      margin: 0
    .deactivate-time-preview-button
      +button()
      margin: 0

  .menu-time-preview-active-panel
    +time-preview-panel($bg: rgba(199, 255, 176, 0.8))