﻿.calendar {
    position: relative;
    z-index: 99999 !important;
    border-radius: .5rem;
    -webkit-box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    box-shadow: 0 6px 12px rgb(0 0 0 / 18%);
    background-color: white;
}

span.calendar {
    position: relative;
    z-index: 99999 !important;
    -webkit-box-shadow: 0 3px 9px rgba(0,0,0,.5);
    box-shadow: 0 3px 9px rgba(0,0,0,.5);
}

.calendar, .calendar table {
    font-size: 11px;
    color: #000;
    cursor: default;
}

    .calendar .button {
        text-align: center;
        background-color: rgb(20, 100, 204);
        color: #FFF;
        padding: 5px;
    }

    .calendar .nav div {
    }

    .calendar thead tr {
        background: url("images/popupcalendar/title-bg.gif") repeat-x 0 100%;
        color: #000;
    }

    .calendar thead tr:first-child td:first-child {
        border-top-left-radius: .5rem;
    }

        .calendar thead tr:first-child td:last-child {
            border-top-right-radius: .5rem;
        }

    .calendar thead .title {
        text-align: center;
        background-color: rgb(20, 100, 204);
        color: #FFF;
        padding: 2px;
    }

    .calendar thead .name {
        text-align: center;
        color: #000;
        padding: 5px;
        font-weight: 700;
        background-color: #edf2f9;
    }

    .calendar thead .hilite {
        background-color: #6699FF;
        padding: 5px;
    }

    .calendar thead .daynames {
        background: url("images/popupcalendar/dark-bg.gif");
    }

    .calendar tbody .day {
        background-color: white;
        color: #555555;
        text-align: right;
        padding: 2px 4px 2px 2px;
        cursor: pointer;
    }

        .calendar tbody .day.othermonth {
            font-size: 80%;
            color: #999;
        }

            .calendar tbody .day.othermonth.oweekend {
                color: #f99;
            }

    .calendar table .wn {
        border-right: 1px solid #797979;
        padding: 2px 3px 2px 2px;
        border-right: solid 1px #BBBBBB;
    }

    .calendar tbody .rowhilite td, .calendar tbody .rowhilite td.wn {
        background-color: rgba(217,112,93,30%);
    }

    .calendar tbody td.today {
        font-weight: 700;
    }

    .calendar tbody td.hilite {
        background-color: #d9705d;
        border-radius: .5rem;
        color: white;
    }

    .calendar tbody td.active {
        padding: 2px 2px 0;
    }

    .calendar tbody td.selected {
        color: white;
        padding: 1px 3px 1px 1px;
        background-color: #d9705d;
        border-radius: .5rem;
        width: 18px;
        height: 18px;
        text-align: center;
        padding: 0;
        margin: 0;
    }

    .calendar tbody .disabled {
        color: #999;
    }

    .calendar tbody .emptycell {
        visibility: hidden;
    }

    .calendar tbody .emptyrow {
        display: none;
    }

    .calendar tfoot .footrow {
        text-align: center;
        color: #fff;
    }

    .calendar tfoot .ttip {
        color: #555;
        font-weight: 700;
        padding: 2px;
        border-top: solid 1px #BBBBBB;
    }

    .calendar tfoot .hilite {
        background: #afa;
        border: 1px solid #084;
        color: #000;
        padding: 1px;
    }

    .calendar tfoot .active {
        background: #7c7;
        padding: 2px 0 0 2px;
    }

    .calendar .combo {
        position: absolute;
        display: none;
        top: 0;
        left: 0;
        width: 4em;
        cursor: default;
        color: #000;
        z-index: 100;
        border: 1px solid #edf2f9;
        border-radius: 0.5rem;
    }

        .calendar .combo .label, .calendar .combo .label-IEfix {
            text-align: center;
            padding: 1px;
            display: block;
            font-size: 90%;
            line-height: 1.5;
            color: #000;
            border-radius: 0 !important;
            background-color: white;
        }

        .calendar .combo .label-IEfix {
            width: 4em;
        }

        .calendar .combo .active {
            font-weight: 700;
            color: white;
            background-color: #d9705d;
        }

    .calendar td.time {
        border-top: 1px solid #797979;
        text-align: center;
        background: url("images/popupcalendar/dark-bg.gif");
        padding: 1px 0;
    }

        .calendar td.time .hour, .calendar td.time .minute, .calendar td.time .ampm {
            font-weight: 700;
            background: url("images/popupcalendar/normal-bg.gif");
            color: #000;
            padding: 0 5px 0 6px;
        }

        .calendar td.time .ampm {
            text-align: center;
        }

        .calendar td.time .colon {
            font-weight: 700;
            padding: 0 2px 0 3px;
        }

        .calendar td.time span.active {
            background: url("images/popupcalendar/active-bg.gif");
            color: #fff;
        }

.NormalCalendar {
    /*border: 1px solid red;*/
    padding-top: 0;
    display: inline-block;
    *display: inline; /* for IE7*/
    *zoom: 1; /* for IE7*/
    position: relative;
    width: 100px;
}

    .NormalCalendar > input[pswebctrltype] {
        text-align: center;
        padding-right: 22px;
    }

.calendarText {
    border: solid 1px #7B9EBD;
    width: 100%;
    padding-right: 20px !important;
    min-height: 16px;
    font-size: 11px;
    text-align: center;
    vertical-align: middle;
    margin-right: 2px;
    line-height: normal;
}

.NormalCalendar > a,
.NormalCalendar > .calendarButton {
    position: absolute;
    top: 0;
    right: 0;
}

.calendarButton {
    cursor: pointer;
    height: 20px;
    vertical-align: middle;
    padding: 3px 5px;
    display: inline;
}

.NormalCalendar > input[pswebctrltype][readonly] + a > .calendarButton {
    color: #939192 !important;
    cursor: default;
}

.calendar thead .weekend, .calendar tbody td.weekend {
    /*color: #c44;*/
}

.calendar .combo .hilite, .calendar td.time span.hilite {
    background-color: #eecec8;
}
