.calendar-box {
    border-color: #ff9333;
}

.calendar-box .index-calendar {
    position: relative;
    z-index: 2;
    margin-top: 5px;
}

.calendar-box .index-calendar .datepicker {
    width: 100%;
}

.calendar-box .index-calendar .datepicker table {
    width: 100%;
    margin: 0 auto;
}

.calendar-box .index-calendar .datepicker table tr td.disabled, .calendar-box .index-calendar .datepicker table tr td.disabled:hover {
    color: black;
}

.calendar-box .index-calendar .datepicker table tr td.old, .calendar-box .index-calendar .datepicker table tr td.old:hover, .calendar-box .index-calendar .datepicker table tr td.new, .calendar-box .index-calendar .datepicker table tr td.new:hover {
    color: #CCC !important;
    background: none !important;
}

.calendar-box .index-calendar .datepicker table tbody tr td.active {
    background: #3393c4;
    border: none;
    text-shadow: none;
    color: white;
}

.calendar-box .index-calendar .datepicker table tbody tr td.holiday {
    background: #ff9333;
    color: white;
}

.calendar-box .index-calendar .datepicker .datepicker-switch {
    background: #939393;
    color: white;
}

.calendar-box .index-calendar .datepicker .prev, .calendar-box .index-calendar .datepicker .next {
    color: white;
}

.calendar-box .index-calendar .datepicker .prev {
    text-align: right;
    background: #939393;
}

.calendar-box .index-calendar .datepicker .next {
    text-align: left;
    background: #939393;
}

.calendar-box .calendar-container {
    padding: 0 10px 10px 10px;
    height: 60vw;
}

.calendar-box .calendar-details, .datepicker table tr td, .datepicker table tr th {
    font-size: 3.5vw;
}

.datepicker table tr td, .datepicker table tr th {
    width: 40px;
    height: 20px;
}

@media (min-width: 425px) {
    .calendar-box .calendar-container {
        height: 45vw;
    }

    .calendar-box .calendar-details {
        font-size: 3vw;
    }

    .datepicker table tr td, .datepicker table tr th {
        width: 11vw;
        font-size: 3vw;
        height: 6vw;
    }
}

@media (min-width: 576px) {

    .calendar-box .calendar-container {
        height: 170px;
    }

    .calendar-box .calendar-details {
        font-size: 13px;
    }

    .datepicker table tr td, .datepicker table tr th {
        width: 30px;
        height: 20px;
        font-size: 12px;
    }
}

@media (min-width: 768px) {
    .calendar-box .calendar-container {
        height: 150px;
    }

    .datepicker table tr td, .datepicker table tr th {
        height: 20px;
        width: 40px;
        font-size: 12px;
    }

    .calendar-box .calendar-details {
        font-size: 13px;
    }

}

@media (min-width: 992px) {
    .calendar-box .calendar-container {
        height: 220px;
    }

    .datepicker table tr td, .datepicker table tr th {
        font-size: 13px;
    }

    .calendar-box .calendar-details {
        font-size: 14px;
    }
}

@media (min-width: 1201px) {

    .datepicker table tr td, .datepicker table tr th {
        height: 27px;
        width: 40px;
        font-size: 14px;
    }

    .calendar-box .calendar-details {
        font-size: 16px;
    }
}

@media (min-width: 1641px) {
    .calendar-box .calendar-container {
        height: 300px;
    }

    .datepicker table tr td, .datepicker table tr th {
        font-size: 16px;
    }
}

.calendar-box .calendar-details {
    width: 100%;
    height: 100%;
    background: white;
    margin: 5px auto;
    margin-top: 0;
    overflow: auto;
    padding: 0;
}


.calendar-box .calendar-details div {
    padding: 2px 4px 2px 7px;
    margin: 0 0;
}

.calendar-box .calendar-details div.holiday {
    border-left: #ff9333 8px solid;
    border-bottom: 1px solid rgba(20, 164, 177, 0.43);
}

.calendar-box .calendar-details div.event {
    border-left: #3393c4 8px solid;
    border-bottom: 1px solid rgba(20, 164, 177, 0.43);
}


/*# sourceMappingURL=calendar.css.map */
