#calendar {
    width: 579px;
    margin:0 auto 0 auto;
}

/* top area w/ month title and buttons */

h2.full-calendar-title {
    text-align: center;
    padding:10px 0 0 0;
    _padding:0px;
    color:#000000 !important;
    font-size:16px !important;
    margin:0;
}

.full-calendar-buttons {
    margin: 0 auto;
    position:absolute;
    z-index:0;
}
button.prev-month{
    position:absolute;
    left:150px;
    top:10px;
}
button.next-month{
    position:absolute;
    left:375px;
    top:10px;
}
.full-calendar-buttons button {
    vertical-align: middle;
    margin: 0 0 0 5px;
    font-size: 1em;
}

.full-calendar-buttons button span {
    padding: 0 10px;
}



.full-calendar-buttons button.today {
    display:none;
}





/* table layout & outer border */

.full-calendar-month-wrap {
    clear: both;
    border: 1px solid #ccc; /* outer border color & style */
}

.full-calendar-month {
    width: 100%;
    overflow: hidden;
    background:transparent url('/images/calendar_inner_bkg.jpg') repeat-x bottom left;
}

.full-calendar-month table {
    border-collapse: collapse;
    border-spacing: 0;

}




/* cell styling */

.full-calendar-month th,
.full-calendar-month td.day {
    padding: 0;
    vertical-align: top;
    border-style: solid;    /* inner border style */
    border-color: #ccc;     /* inner border color */
    border-width: 1px 0 0 1px;
}

.full-calendar-month th {
    border-top: 0;
    text-align: center;
    height:24px;
    background:transparent url('/images/daysofweek_bkg.jpg') repeat-x 0 0;
    line-height:24px;
    font-size:11px;
}

.full-calendar-month th.first,
.full-calendar-month td.first {
    border-left: 0;
}

.full-calendar-month td.today {

}

.full-calendar-month .day-number {
    text-align: right;
    padding: 0 2px;
    font-size:10px;
}
.full-calendar-month .other-month{
    background-color:#b6d4d5;
}
.full-calendar-month .other-month .day-number {
    color: #ffffff;
    font-size:10px;
}

.full-calendar-month .day-content {
    padding: 2px 2px 0; /* distance between events and day edges */
}

/* FullCalendar automatically chooses a cell's height,
* but this can be overridden:
*
* .full-calendar-month td.day {
*    height: 100px !important;
*    }
*/




/* event styling */

.full-calendar-month .event {
    margin-bottom: 2px;
    font-size: 11px;
    cursor: pointer;
    text-align: left;
    line-height:21px;
    color:#d83c0c;
}

.full-calendar-month .ui-draggable-dragging td {
    cursor: move;
}

.full-calendar-month .event td {
    background-color:#cccccc;
    padding: 0 0 0 2px;
    line-height:14px;

}



.full-calendar-month .nobg td {

}

.full-calendar-month .event td.c {

}

.full-calendar-month .event-time {
    font-weight: bold;

}

/* To change the color of events on a per-class basis (such as with the
* "className" attribute of a CalEvent), do something like this:
*
* .full-calendar-month .myclass td {
*    background: green;
*    }
*/




/* the rectangle that covers a day when dragging an event */

.full-calendar-month .over-day {

    opacity: .2;
    filter: alpha(opacity=20); /* for IE */
}




/* right-to-left support */

.r2l .full-calendar-title {
    text-align: right;
}

.r2l .full-calendar-buttons {
    float: left;
}

.r2l .full-calendar-buttons button {
    margin: 0 5px 0 0;
}

.r2l .full-calendar-month .day-number {
    text-align: left;
}

.r2l .full-calendar-month .event {
    text-align: right;

}