.calendar table {
    width: 100%;
    line-height: 1.25em; /*15*/
    border-collapse: collapse;
    border-spacing: 0;
}

.calendar th {
    text-align: left;
}

    .calendar th span {
        display: none;
    }

.calendar tr {
    display: block;
}

.calendar td,
.calendar th {
    display: none;
}

.calendar .day {
    margin: 1em 0 .5em 0;
    font-weight: bold;
}

.calendar .events {
    display: block;
}

.calendar tr td:nth-of-type(1n) .day:before {
    content: 'Sunday';
}

.calendar tr td:nth-of-type(2n) .day:before {
    content: 'Monday';
}

.calendar tr td:nth-of-type(3n) .day:before {
    content: 'Tueday';
}

.calendar tr td:nth-of-type(4n) .day:before {
    content: 'Wednesday';
}

.calendar tr td:nth-of-type(5n) .day:before {
    content: 'Thursday';
}

.calendar tr td:nth-of-type(6n) .day:before {
    content: 'Friday';
}

.calendar tr td:nth-of-type(7n) .day:before {
    content: 'Saturday';
}

.calendar .prev-month,
.calendar .next-month {
    display: none;
}

.calendar img {
    max-width: 100px;
    max-height: 100px;
    display: block;
}

.GlobalCalendarMonthViewDayNames {
    font-size: 14px;
}

.GlobalCalendarDay {
}

.MonthName {
    font-size: 18px;
    font-weight: bold;
}

.calendarTitle {
    text-align: center;
    margin-bottom: 20px;
}

@media only screen and (max-width: 48em) {
    .calendar td {
        border-bottom: 1px solid whitesmoke;
        padding-bottom: 10px;
        min-height: 50px;
    }
}

@media only screen and (min-width: 48em) { /*480*/


    .calendar tr {
        display: table-row;
    }


    .calendar th, .calendar td {
        display: table-cell !important;
        margin: 0;
        width: 14.2857%;
        padding: 0.4166em; /*10*/
        border: 1px solid whitesmoke;
        vertical-align: top;
    }

    .calendar td {
        height: 100px;
    }

    .calendar .prev-month .day,
    .calendar .next-month .day {
        color: #bbb;
    }

    .calendar td .day {
        display: block;
        float: right;
        margin: 0;
        font-weight: normal;
    }

        .calendar td .day:before {
            display: none;
        }

    .calendar td .suffix {
        display: none;
    }
}

@media only screen and (min-width: 49em) { /*640*/

    /* show full days (e.g. "Mon" to "Monday") */
    .calendar th span {
        display: inline;
    }
}