.clndr { width: 100%; position: relative; overflow: hidden; }
.clndr .controls { position: relative; background-color: #eee; }
.clndr .clndr-previous-button,
.clndr .clndr-next-button { position: absolute; top: 0; bottom: 0; cursor: pointer; }
.clndr .clndr-previous-button { left: 0; }
.clndr .clndr-next-button { right: 0; }
.clndr .controls > div { padding: 10px; text-align: center; }
.clndr .days-container { position: relative; left: 0; -webkit-transition: left 500ms; transition: left 500ms; }
.clndr .days-container.show-events { left: -100%; }
.clndr .days-container.show-single { left: -200%; }
.clndr .days { position: relative; }
.clndr .headers { background-color: #F7F7F7; }
.clndr .day-header,
.clndr .day { width: 14.28571429%; float: left; text-align: center; padding: 10px; }
.clndr .day.adjacent-month { color: #ccc; }
.clndr .day.today { background-color: #eee; }
.clndr .day.event { background-color: #FCFCFC; cursor: pointer; }
.clndr .day.active { background-color: #dedede; }
.clndr .day.adjacent-month.event { cursor: auto; }
.clndr .events { position: absolute; width: 100%; height: 100%; left: 100%; top: 0; }
.clndr .events .headers { position: relative; }
.clndr .events .headers > div { padding: 10px; }
.clndr .events .headers .x-button { position: absolute; right: 0; top: 0; bottom: 0; cursor: pointer; }
.clndr .events .headers .event-header { text-align: center; }
.clndr .events .event-list { position: absolute; left: 0; bottom: 0; right: 0; top: 40px; overflow: auto; }
.clndr .event-list .event:nth-child(2n+2) { background-color: #FCFCFC; }
.clndr .event-list .event a { display: block; padding: 5px 10px 5px 25px; text-decoration: none; color: #555; }
.clndr .event-list .event a:hover,
.clndr .event-list .event a:focus,
.clndr .event-list .event a:active { color: #999; }
.clndr .event-list .event a .event-bullet { display: block; float: left; width: 8px; height: 8px; border-radius: 4px; margin-left: -12px; margin-top: 6px; background-color: #555; }
.clndr .event-list .event a:hover .event-bullet,
.clndr .event-list .event a:focus .event-bullet,
.clndr .event-list .event a:active .event-bullet { background-color: #999; }
.clndr .event-list .event a .event-time { margin-right: 0.5em; font-size: 0.6em; }
.clndr .event-list .event a .event-time:empty { display: none; }
.clndr .current-event { position: absolute; width: 100%; height: 100%; left: 100%; top: 0; }
.clndr .current-event:nth-child(3) { left: 200%; }
.clndr .current-event .headers { position: relative; }
.clndr .current-event .headers > div { padding: 10px; }
.clndr .current-event .headers .x-button { position: absolute; right: 0; top: 0; bottom: 0; cursor: pointer; }
.clndr .current-event .headers .back-button { position: absolute; left: 0; top: 0; bottom: 0; cursor: pointer; }
.clndr .current-event .headers .event-header { text-align: center; }
.clndr .current-event .event { position: absolute; left: 0; bottom: 0; right: 0; top: 40px; overflow: auto; }
.clndr .current-event .event .event-scroll-container { padding: 10px; }
.clndr .current-event .event-has-capacity { border-top: 1px solid #ccc; padding: 10px 0; }
.clndr .current-event .event-capacity { padding-bottom: 10px; }

/* Events listed in calendar */
.clndr .event-container { display: none; height: 0; overflow: hidden; transition-duration: 500ms; transition-property: none; width: 100%; background-color: #555; color: #fff; }
.clndr .event-container.event-show { display: block; height: auto; }
.clndr .event-container .days-indicators { margin-bottom: -1px; }
.clndr .event-container .days-indicator { float: left; width: 14.28571429%; position: relative; height: 1px; }
.clndr .event-container .days-indicator.active::before { content: ''; position: absolute; border-top: 8px solid #dedede; border-left: 10px solid transparent; border-right: 10px solid transparent; top: 0; left: 50%; margin-left: -10px; }
.clndr .event-container .event-date { padding: 10px; text-align: center; }
.clndr .event-container .event a { color: #fff; display: block; padding: 10px; text-decoration: none; padding-left: 25px; }
.clndr .event-container .event a:nth-child(2n+1) { background-color: #666; }
.clndr .event-container .event a:hover,
.clndr .event-container .event a:focus,
.clndr .event-container .event a:active { color: #dedede; }
.clndr .event-container .event a .event-bullet { background-color: #fff; }
.clndr .event-container .event a:hover .event-bullet,
.clndr .event-container .event a:focus .event-bullet,
.clndr .event-container .event a:active .event-bullet { background-color: #dedede; }

/* Static view */
.clndr .clndr-static .days-container { left: 0; }
.clndr .clndr-static .events { position: relative; left: auto; }
.clndr .clndr-static .events .event-list { position: relative; left: auto; right: auto; bottom: auto; top: auto; overflow: visible; }
.clndr .clndr-static .col-events .days-container .current-event { display: none; position: relative; left: auto; width: auto; height: auto; }
.clndr .clndr-static .col-events .days-container .current-event .event { position: relative; left: auto; right: auto; top: auto; bottom: auto; overflow: visible; }
.clndr .clndr-static .col-events .days-container.show-single .events { display: none; }
.clndr .clndr-static .col-events .days-container.show-single .current-event { display: block; }
.clndr .event-resize-container { transition-duration: 500ms; transition-property: none; padding: 10px; }
.clndr .event-general-container { padding: 10px; }

/* Time picker */
.clndr .times-container .headers { padding: 10px; }
.clndr .times { height: 280px; overflow: auto; }
.clndr .times .time::before,
.clndr .times .time::after { content: ''; display: table; }
.clndr .times .time::after { clear: both; }
.clndr .times .time:nth-child(2n+2) { background-color: #FCFCFC; }
.clndr .times .time .time-label { display: block; float: left; width: 25%; padding: 10px; }
.clndr .times .time .time-availability { display: block; float: left; width: 75%; padding: 10px; background-color: #FCFCFC; }
.clndr .times .time:nth-child(2n+2) .time-availability { background-color: #F9F9F9; }
.clndr .times .time .time-unavailable { background-color: #FCEEEE; }
.clndr .times .time:nth-child(2n+2) .time-unavailable { background-color: #F9DEDE; }
.clndr .clndr-picker .day{ cursor: pointer; }
.clndr .times .time .time-selected { background-color: #EEFCEE; }
.clndr .times .time:nth-child(2n+2) .time-selected { background-color: #DEF9DE; }
.clndr .times .time .time-highlighted { background-color: #DEEEFC; }
.clndr .times .time:nth-child(2n+2) .time-highlighted { background-color: #CCDEF9; }
.clndr .day.unavailable { color: #888; background-color: #FCFCFC; }
.clndr .day.unavailable.active { background-color: #F9F9F9; }
.clndr .day.occupied { color: #833; background-color: #FCEEEE; }
.clndr .day.occupied.active { background-color: #F9DEDEDE; }