/* top area w/ month title and buttons */ .full-calendar-title { text-align: left; } .full-calendar-buttons { float: right; margin: 0 0 1em; } .full-calendar-buttons input { vertical-align: middle; margin: 0 0 0 5px; font-size: 1em; } .full-calendar-prev, .full-calendar-next { width: 40px; } /* 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; } .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; } .full-calendar-month th.first, .full-calendar-month td.first { border-left: 0; } .full-calendar-month td.today { background: #FFFFCC; } .full-calendar-month .day-number { text-align: right; padding: 0 2px; } .full-calendar-month .other-month .day-number { color: #bbb; } .full-calendar-month .day-content { padding: 2px 2px 0; /* distance between events and day edges */ } .full-calendar-month td.day { /* FullCalendar automatically chooses a height, but this can be overridden: */ /* height: 100px !important; */ } /* event styling */ .full-calendar-month .event { margin-bottom: 2px; font-size: .85em; cursor: pointer; text-align: left; } .full-calendar-month .ui-draggable-dragging td { cursor: move; } .full-calendar-month .event td { background: #C1D9EC; padding: 0; } .full-calendar-month .event td.ne, .full-calendar-month .event td.nw, .full-calendar-month .event td.se, .full-calendar-month .event td.sw { background: none; width: 1px; /* <-- remove if you dont want "rounded" corners */ height: 1px; /* <-- */ } .full-calendar-month .nobg td { background: none; } .full-calendar-month .event td.c { padding: 0 2px; } .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 { background: #ADDBFF; opacity: .2; filter: alpha(opacity=20); } /* right-to-left support */ .r2l .full-calendar-title { text-align: right; } .r2l .full-calendar-buttons { float: left; } .r2l .full-calendar-buttons input { margin: 0 5px 0 0; } .r2l .full-calendar-month .day-number { text-align: left; } .r2l .full-calendar-month .event { text-align: right; }