/* Main Container */
.main-container { padding: 6.125rem 1.625rem 4rem 1.625rem; width: 100%; background-color: #F3F3F3; }
.main-container.sidebar-active { width: calc(100% - 25.9375rem); margin-left: 25.9375rem !important; }

/* admin Catalogue */
.admin-catalogue { padding-top: 1.5rem; padding-bottom: 2rem; }
.admin-catalogue__row { padding: 0.5rem; margin-bottom: 1.75rem; display: flex; align-items: center; border-radius: 0.875rem; background: #ffffff; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.25); }
.admin-catalogue__row .form-group { padding: 1rem; margin: auto; width: 100%; }
.admin-catalogue__row .form-btn { margin: 0 1rem; flex-direction: column; display: flex; }
.admin-catalogue__row .form-btn .btn { padding: 0.75rem 1.5rem; font-family: 'Avenir Next Bold'; }
.admin-catalogue__row .custom-file-input { max-width: 12rem; height: 9rem; border-radius: 0.875rem;}
.admin-catalogue__row .custom-file-input img{height: 100%;}
.admin-catalogue .add-btn { display: block; border-radius: 0.875rem; border: medium none; font-size: 5rem; width: 15rem; height: 7rem; color: #ffffff; background: #323232; }

.time-clock { max-width: 80%; margin: auto; border-radius: 0.5rem; background: #ffffff; }
.time-clock__header { padding: 1rem; display: flex; align-items: center; justify-content: center; border-radius: 0.5rem; position: relative; min-height: 6.5rem; background: #FBE858; }
.time-clock__close { position: absolute; right: 1rem; top: 1rem; display: block; height: 3rem; width: 3rem; text-align: center; line-height: 3.4rem; text-decoration: none; font-size: 1.25rem; border-radius: 50%; color: #fff; background: #000000; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.35); }
.time-clock__body { padding: 2rem; }
.time-clock__item__wrapper { padding: 0 0 2rem 0; }
.time-clock__list { padding: 1rem; height: 100%; overflow: auto; }
.time-clock__item { display: flex; width: 33.33%; text-align: center; position: relative; flex-direction: column; justify-content: center; align-items: center; }
.time-clock__item:first-child::after { margin-top: -2.15625rem; content: ":"; position: absolute; right: -0.75rem; top: 50%; font-size: 4.3125rem; line-height: 4.3125rem; font-family: 'Avenir Next Bold'; }
.time-clock__item__wrapper { display: flex; align-items: center; justify-content: space-between; }
.time-clock__title { font-family: 'Avenir Next Bold'; font-size: 1.5rem; }
.time-clock__item__title { font-size: 4.3125rem; line-height: 4.3125rem; font-family: 'Avenir Next Bold'; }
.time-clock__btn { margin: 2rem 0; display: block; transform: rotate(-90deg); background: transparent; border: medium none; height: 3rem; width: 3rem; font-size: 1.5rem; line-height: 3rem; text-align: center; border-radius: 50%; display: inline-block; border: 2px solid #242424; background: #fff; }
.time-clock__btn:hover, .time-clock__btn:focus { background: #242424; color: #fff; outline: none; }

/* Select 2 */
.custom-dropdown { width: 22.5rem; }
.custom-dropdown .select2-container--default .select2-selection--single { height: 5rem; border: none; background: #D9D9D9; border-radius: 0.625rem; }
.custom-dropdown .select2-container { width: 100% !important; }
.custom-dropdown .select2-container--default .select2-selection--single .select2-selection__rendered { padding: 1.5rem; color: #242424; font-size: 1.75rem; line-height: 2rem; outline: none; }
.custom-dropdown .select2-container--default .select2-selection--single .select2-selection__arrow b { border-width: 0.75rem 0.625rem 0 0.625rem; }
.custom-dropdown .select2-container--default .select2-selection--single .select2-selection__arrow { height: 1.625rem; position: absolute; top: 25%; right: 1.25rem; width: auto; display: block; }
.custom-dropdown .select2-container--default.select2-container--open.select2-container--below .select2-selection--single, 
.custom-dropdown .select2-container--default.select2-container--open.select2-container--below .select2-selection--multiple { outline: none; }
.select2-dropdown { background: #6C6C6C; border-color: #6c6c6c; }
.select2-search { display: none; }
.select2-container--default .select2-results__option--highlighted.select2-results__option--selectable { background-color: #FBE858; color: #242424; }
.select2-container--default .select2-results__option--selected {  }
.select2-results__option { padding: 1.5rem 1rem; font-size: 1.5rem; color: #ffffff; }
.select2-container--default .select2-results>.select2-results__options { max-height: 80vh;}


/* Slot Wrapper */
.slots-wrapper { display: flex; align-items: center; flex-wrap: wrap; }
.slot-item { margin: 0 4rem 4rem 0; width: 23rem; height: 20rem; display: flex; border-radius: 0.3125rem; align-items: center; justify-content: center; background: #ffffff; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.25); }
.slot-item.empty { border: 1px dashed #000000; }
.slot-item__title { font-size: 1.25rem; font-family: 'Avenir Next Bold'; text-transform: uppercase; }
.slot-item__inner { width: 100%; height: 100%; border-bottom: 0.5rem solid #FBE858; border-radius: 0 0 0.3125rem 0.3125rem; }
.slot-item__header { padding: 2rem 1.5rem; font-size: 1.25rem; font-family: 'Avenir Next Bold'; text-transform: uppercase; background: #FBE858; border-radius: 0.3125rem 0.3125rem 0 0; }
.slot-item__body { padding: 1.5rem; }
.slot-item__row { margin-bottom: 2rem; display: flex; align-items: center; justify-content: space-between; }
.slot-item__row .btn { padding: 1rem 0.5rem; width: 100%; color: #ffffff; border-radius: 0.3125rem; font-size: 1.125rem; font-family: 'Avenir Next Regular'; }
.slot-item__row .btn.has-icon { padding-right: 4.68rem; position: relative; }
.slot-item__row .btn.has-icon > span { position: absolute; right: 0; top: 0; height: 100%; width: 4.18rem; display: flex; align-items: center; justify-content: center; font-size: 170%; color: #242424; background: #FBE858; border: 4px solid #000; }
.slot-item__row .custom-toggle { margin-left: 1rem; }

.slot-item.disabled { background: #D2D2D2; pointer-events: none; }
.slot-item.disabled .slot-item__inner { border-color: #c2c2c2; }
.slot-item.disabled .slot-item__header { background-color: #c2c2c2; color: #8C8C8C; }

.dashboard-item__wrapper { margin: 0 -2rem 2rem; display: flex; align-items: center; flex-wrap: wrap; }
.dashboard-item { padding: 1.25rem 2rem; margin: 0 2rem 2rem 2rem; width: 27.5rem; font-family: 'Avenir Next Bold'; border-radius: 0.3125rem; border-bottom: 0.5rem solid #FBE858; background: #ffffff; box-shadow: 0px 4px 24px rgba(0, 0, 0, 0.25); }
.dashboard-item__title { font-size: 1.25rem; }
.dashboard-item__number { font-size: 3.25rem; }
.dashboard-item.dashboard-item--download { margin: 0 0rem 2rem 2rem; width: 21rem; }

/* Tablet */
@media only screen and (min-width: 767px) {}

/* Desktop */
@media only screen and (min-width: 991px) {}

