/* ##### CALENDAR WIDGET ##### */

/* Coloring and shape */
/* This is the overall widget that contains everything */
.calendar-widget {
    margin: 0 auto;
    position: relative;
    border-radius: 10px 10px 0 0;
    border-spacing: 0;
    border: 1px solid #c6c6c6;
    background-image: linear-gradient(#ffffff, #ffffff 50%);
}

/* This is the div that holds the buttons and date */
.calendar-control-bar {
    margin: 0 auto;
    position: relative;
    text-align: center;
    vertical-align: center;
    color: #666666;
}

/* Buttons for month/week/day and forward/backwards in time */
.calendar-button, .calendar-button-disabled {
    color: #ffffff;
    background-color: #0044cc;
    background-image: linear-gradient(#0088cc, #0044cc);
    border: 1px #0044cc;
    text-shadow: 0 0 0;
}

.calendar-button-disabled {
    cursor: default;
    color: #ffffff;
    opacity: 0.7;
    border: 1px #0044cc;
    text-shadow: 0 0 0;
}

.calendar-button-disabled:hover {
    cursor: default;
}

.calendar-button:hover, .calendar-button-disabled:hover {
    text-shadow: 0 0 0;
    color: #ffffff;
    background-color: #0044cc;
    background-image: linear-gradient(#0044cc, #0044cc);
}

.calendar-button:active, .calendar-button-disabled:active,
.calendar-button:focus, .calendar-button-disabled:focus  {
    color: #ffffff;
    background-color: #0044cc;
    background-image: linear-gradient(#0088cc, #0044cc);
    border: 1px #0044cc;
    text-shadow: 0 0 0;
}

/* Text for the current time period */
.calendar-date {
    font-size: 300%;
    font-weight: 700;
}

/* Middle section div for the calendar-date text */
.calendar-date-display {
    /*width: 33%;*/
    /*float: left;*/
}

/* The container that holds the acutal calendar display under the controls */
.calendar-display {

}

/* ##### MONTH ##### */

/* container for the month calendar */
.calendar-month {

    margin: 0 auto;
    position: relative;
}

/* table that holds the days of the week and individual days */
.calendar-month-layout {

}

/* table that holds just a single day */
.calendar-day-layout {

}

/* table that holds a week */
.calendar-week-layout {

}

/* table row for a week grouping of days */
.calendar-days {

}

/* header on the month view that has the days of the week */
.calendar-days-header {
    background-color: #ffffff;
    background-image: linear-gradient(#ffffff, #ffffff);
    border-top: 1px solid #c6c6c6;
    border-bottom: 1px solid #c6c6c6;
    color: #424242;
    font-size: 110%;
}

.calendar-days-header th {
    line-height: 1.5;
}

.calendar-day, .calendar-today, .calendar-day-week, .calendar-today-week,
.calendar-day-single, .calendar-today-single {
    vertical-align: top;
    z-index: -1;
    font-weight: 400;
    text-shadow: 0 0px 0 rgba(0,0,0,1.0);
    border-top: 1px solid #c6c6c6;
    border-left: 1px solid #c6c6c6;
    box-shadow: 0 1px 0 rgba(255,255,255,0.15) inset, 1px 0 0 rgba(255,255,255,0.15) inset;
    width: 14%;
}


/*.calendar-day, .calendar-day-week, .calendar-day-single {
    background-image: linear-gradient(#ffffff, #ffffff);
    color: #727272;
}*/

.calendar-today, .calendar-today-week, .calendar-today-single {
    color: #333333;
    background-color: #aafff5;
}

.calendar-month-othermonth-day {
    border-top: 1px solid #d8d8d8;
    border-left: 1px solid #d8d8d8;
    vertical-align: top;
    z-index: -1;
    background-image: linear-gradient(#ffffff, #ffffff);
    color: #cccccc;
    box-shadow: 0 1px 0 rgba(255,255,255,0.05) inset, 1px 0 0 rgba(255,255,255,0.05) inset;
}

.calendar-day:hover,
.calendar-day:focus,
.calendar-today:hover,
.calendar-today:focus,
.calendar-day-week:hover,
.calendar-day-week:focus,
.calendar-today-week:hover,
.calendar-today-week:focus,
.calendar-day-single:hover,
.calendar-day-single:focus,
.calendar-today-single:hover,
.calendar-today-single:focus {
    background-image: linear-gradient(#d9edf7, #d9edf7);
    color: #3a87ad;
}
.calendar-multiday-bar {
    border-top: 2px solid #727272;
}

.calendar-multiday-event-container {
    position: relative;
}

.calendar-day-date {
    text-align: left;
    vertical-align: top;
    font-size: 200%;
    z-index: 0;
}

.calendar-single-event-container {
    min-height: 60px;
}

.calendar-single-event, .calendar-multiday-event {
    z-index: 1;
    text-align: center;
}

.calendar-single-event {

}

.calendar-multiday-event, .calendar-multiday-event-week {
    position: absolute;
    height: 1.6em;
}

.calendar-message-box {
    margin-bottom: 2px;
    border-bottom:1px black solid;
}
.calendar-message-box, .calendar-message-box-defaultcolor {
    text-shadow: 0 0px 0 rgba(0,0,0,1.0);
}

.calendar-message-box-defaultcolor {
    color: rgb(200,200,200);
    background-color: rgb(106,154,12);
}



/*sizing*/
.calendar-multiday-event-week {
    min-height: 10px;
}

.calendar-widget {
    width: 100%;
    height: 100%;
    min-width: 500px;
}


.calendar-display {
    width: 100%;
    height: 94%;
}

.calendar-month {
    width: 100%;
    height: 100%;
}

.calendar-week {
    width: 100%;
    height: 100%;
}

.calendar-single-day {
    width: 100%;
    height: 100%;
}

.calendar-month-days {
    width: 100%;
}

.calendar-month-othermonth-day {
    height: 60px;
}

.calendar-month-layout {
    width: 100%;
    height: 100%;
}

.calendar-week-layout {
    width: 100%;
    height: 100%;
}

.calendar-day-layout {
    width: 100%;
    height: 100%;
}

.calendar-days-header {
    font-size: 110%;
}

.calendar-days-header th {
    width: 14.28%
}

.calendar-multiday-event {
    height: 1.7em;
    overflow-y: hidden;
}

.calendar-date {
    font-size: 300%;
    font-weight: 700;
}

/* Button groups, one for scope and one for range */
.calendar-button-group {
    /*    width: 33%;*/
    padding-top: 2%;
    /*float: left;*/
}
/*
.calendar-day-week, .calendar-today-week {
    height: 400px;
}

.calendar-day-single, .calendar-today-single {
    height: 400px;
}*/
.calendar-day-single,.calendar-day-week {
    height: 100%;
}