.calDay, .calDayDisabled, .calDayToday, .calWeekHeader {
    display: inline-block;
    border: 1px solid #ced4da;
    -webkit-appearance: none;
    -moz-appearance: none;
    appearance: none;
    border-radius: 0.4rem;
    transition: border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
    padding: 0;
    margin: 1px;
    color: #667080;
    background-color: #fff;
    padding: 8px 10px;
    vertical-align: top;
    font-family: Tahoma;
    max-height:contain;
}
.calDay {
    text-align: left;
}
.calDayDisabled {
    color: #ccc;
    background-color: #f9f9f9;
    text-align:left;
}
.calDayToday {
    text-align: left;
    border: 2px solid #ffd800;
    background-color: #fffffa;
}

.calDayDate {
    
}

.calWeekHeader {
    background-color: #ffd800;
}
.calWeek {
    display: block;
}

.calMonth {
}

.calHeader {
    display: inline-block;
    text-align: left;
    min-width: 1400px;
}

.calContainer {
    padding: 8px;
    text-align: center;
}

.calShiftLine {
    margin-top: 6px;
    font-family: Arial Narrow;
    background-color: #fff;
    line-height:normal;
}

.calShiftLink {
    color: #666;
    text-decoration:none;
    font-style:italic;
}

.calLink {
    float: right;
    font-size: 18px;
    margin-top: -2px;
    color: #06d;
    text-decoration: none;
    font-family: 'Courier New';
    font-weight: bold;
}
.tblWeekDays {
    width:170px;
}

.tdWorkDay, .tdDayOff {
    max-width: 22px;
    max-height: 24px;
    padding: 2px;
    font-size: 12px;
    text-align: center;
    vertical-align: central;
}
.tdWorkDay {
    color: #04d;
   /* background-color: #269;*/
}
.tdDayOff {
    color: #ddd;
   /* background-color: #fff;*/
}

/*****************************************************************************************************************************************************************************/
@media (min-width: 300px) { /*  300 * 300 * 300 * 300 * 300 * 300 ************************************************************************************************************/
    .calDay, .calDayDisabled, .calDayToday {
        min-width: 280px;
        min-height: contain;
        font-size: 16px;
    }

    .calDayDisabled, .calWeekHeader {
        display: none;
    }

    .calShiftLine {
        padding-top: 4px;
        font-size: 16px;
    }
}
@media (min-width: 400px) {    /*  400 * 400 * 400 * 400 * 400 * 400 **********************************************************************************************************/
    .calDay, .calDayDisabled, .calDayToday {
        min-width: 320px;
        min-height: contain;
        font-size: 16px;
    }

    .calDayDisabled, .calWeekHeader {
        display: none;
    }

    .calShiftLine {
        padding-top: 4px;
        font-size: 16px;
    }
}
@media (min-width: 580px) {    /*  580 * 580 * 580 * 580 * 580 ***************************************************************************************************************/
    .calDay, .calDayDisabled, .calDayToday {
        width: 12vw;
        height: 12vw;
        min-width: 220px;
        min-height: 220px;
    }
    .calDayDisabled, .calWeekHeader {
        display: none;
    }
    .calShiftLine {
        padding-top: 2px;
        font-size: 12px;
    }
}
@media (min-width: 820px) {    /*  820 * 820 * 820 * 820 * 820 **************************************************************************************************************/
    .calDay, .calDayDisabled, .calDayToday {
        width: 12vw;
        height: 12vw;
        min-width: 220px;
        min-height: 220px;
    }

    .calDayDisabled, .calWeekHeader {
        display: none;
    }

    .calShiftLine {
        padding-top: 3px;
        font-size: 12px;
    }
}
@media (min-width: 1000px) {  /*  1000 * 1000 * 1000 * 1000 * 1000 **************************************************************************************************************/
    .calDay, .calDayDisabled, .calDayToday {
        display: inline-block;
        width: 12vw;
        height: 12vw;
        min-width: 130px;
        min-height: 130px;
        font-size: 11px;
    }

    .calWeekHeader {
        display: inline-block;
        width: 12vw;
        min-width: 130px;
        height: 32px;
        font-size: 14px;
        padding: 6px;
    }

    .calShiftLine {
        padding-top: 3px;
        font-size: 12px;
    }
}
@media (min-width: 1300px) {    /*  1300 * 1300 * 1300 * 1300 * 1300 * **************************************************************************************************************/
    .calDay, .calDayDisabled, .calDayToday {
        width: 12vw;
        height: 12vw;
        min-width: 180px;
        min-height: 180px;
        font-size: 14px;
    }

    .calWeekHeader {
        width: 12vw;
        min-width: 180px;
        height: 34px;
        font-size: 15px;
        padding: 7px;
    }
    .calShiftLine {
        padding-top: 3px;
        font-size: 12px;
    }
}
@media (min-width: 1600px) {    /*  1600 * 1600 * 1600 * 1600 * 1600 * **************************************************************************************************************/
    .calDay, .calDayDisabled, .calDayToday {
        width: 12vw;
        height: 12vw;
        min-width: 220px;
        min-height: 220px;
        font-size: 16px;
    }
    .calWeekHeader {
        width: 12vw;
        min-width: 220px;
        height: 38px;
        font-size: 16px;
        padding: 8px;
    }
    .calShiftLine {
        padding-top: 4px;
        font-size:16px;
    }
}
/************************************************************************************************************************************************************************************/
