/*
** Styles common across all calendar pages.
*/

#col-left { float: left; width: 170px; }
#col-main { float: right; width: 760px; }

/* header */
#calendar-header { height: 35px; position: relative; }
.calendar-action-buttons { position: absolute; top: 0; left: 0; }
.calendar-view-menu { float: left; margin-left: 180px; width: 300px; }
.create-widget { float: right; margin: 5px 5px 0 0; font-size: 0.8em; }
.create-widget a { text-decoration: underline; }

/* left column */
.filter-section { margin-bottom: 20px; }
.filter-section h4 { font-weight: bold; font-size: 0.9em; margin-bottom: 4px; }
.filter-section ul { list-style: none; margin: 0; padding: 0; font-size: 0.85em; }
.filter-section li { list-style: none; margin: 0 0 3px 0; padding: 0; }


/*
** Page event_list
*/

/* styling for the rows in the list of events */
table.events-list { border-collapse: collapse; clear: both; margin: 0 0 10px 10px; padding: 0; }
table.events-list th { font-size: 1px; line-height: 1px; padding: 0; margin: 0; height: 10px; background: url('/images/misc/table-rows/even.gif') repeat-x;}
table.events-list th.info { width: 200px; }
table.events-list th.description { width: 540px; }
table.events-list td { vertical-align: top; padding: 5px 10px 15px; }
table.events-list td.even { background: #FFFFFF url('/images/misc/table-rows/even.gif') repeat-x left bottom; }
table.events-list td.odd { background: #F6F6F6 url('/images/misc/table-rows/odd.gif') repeat-x left bottom !important; }
table.events-list td.last { background-image: url('/images/misc/table-rows/last.gif'); }

/* styling the calendar page which shows the date */
table.events-list .cal-page { float: left; }
.cal-page { width: 50px; text-align: center; }
.cal-page span { display: block; background: #8C0000; color: #FFFFFF; line-height: 15px; font-size: 0.7em; font-weight: bold; }
.cal-page div { border: 3px solid #8C0000; border-top: none; border-bottom: none; font-size: 1.5em; line-height: 30px; }
.cal-page strong { padding: 3px 0; font-size: 0.9em; font-weight: bold; }
.cal-page-time { float: left; line-height: 60px; font-size: 2em; color: #999999; padding: 0 0 0 10px; }

/* information about an event */
table.events-list .event-details { clear: left; padding: 10px 0 0 0; }
table.events-list .event-details div { font-size: 0.8em; font-weight: bold; }
table.events-list .event-details span { font-size: 0.8em; display: block; font-style: italic; color: #666666; }
table.events-list h2 { display:block; font-weight: bold; font-size: 1em; margin: 0; padding: 0; }
table.events-list p { font-size: 0.75em; line-height: 20px; }
table.events-list .description span { font-size: 0.8em; display: block; font-style: italic; color: #666666; }


/*
** Page event_view
*/

/* the event info */
#cal-event { width: 500px; padding: 0 0 20px 0; }
#cal-event dl { font-size: 0.9em; line-height: 20px; margin: 0; padding: 0; }
#cal-event p { font-size: 0.75em; line-height: 20px; }
#cal-event span { font-size: 0.75em; color: #999999; font-style: italic; }
#cal-event dt { clear: left; float: left; font-weight: bold; padding: 15px 0 0 0; width: 100px; }
#cal-event dd { float: left; padding: 15px 0 0 0; width: 350px; }

/* the right floating options to view in Outlook and iCal */
#cal-event-tools { float: right; width: 200px; }
#cal-event-tools strong { display: block; font-size: 0.9em; margin: 10px 0 0 0; }
#cal-event-tools a { display: block; }


/*
** Page widget_create
*/

.tab-system-container { margin: 20px 10px 10px; }
.tabset-container { margin-bottom: 20px; }
.tabset-container ul.tabset { margin-right: 330px; }
#tab-panes em { font-size: 0.9em; color: #666666; }
.tab-item { display: none; }
.tab-item.selected { display: block; }
.widget-action-buttons { margin-top: 10px; }

body.widget-create .box { position: relative; }
.widget-dev-shoutout { position: absolute; top: 20px; right: 30px; width: 270px; background: #EEEEEE; }
/* .widget-dev-shoutout { float: right; margin-right: 40px; margin-top: 10px; width: 250px; background: #EEEEEE; } */
.widget-dev-shoutout .inner { padding: 10px; }

.preview-container { clear: both; margin-top: 20px; padding: 20px 0; border-top: 1px solid #DDDDDD; text-align: center; }
.preview-container-inner { text-align: left; margin: 0 auto; }