/* 
	I provide styles for the calendar portlets (compact calendar and detailed calendar)
	All css selectors should be prefixed with .calendar to namespace them.
	
	Any styles that are specific to the detailed or calendar portlets, should be placed in detail-calendar.css or compact-calendar.css respectively.
	
	Styles for the region dropdown widget are inherited from css/widgets/menu.css and over-written where necessary
*/

.calendar {
	position: relative;
}

.calendar .calendar-placeholder{}


/* table header styles */


.calendar .fc-header
,.calendar .fc-button {
	background: url("../../images/calendar-header.png") repeat-x scroll 0 0;
}
.calendar .fc-header {
	background-color:#F4F3EB;
}

.calendar .fc-header td {
	white-space:pre;
}

.calendar .fc-button {
	background-color:transparent;
	margin: 0 -1px 10px 1px;
	padding: 4px 0 1px 0;
	border:0;
	background-position: center top;
	-moz-border-radius: 3px;
	-webkit-border-radius: 3px;
	border-radius: 3px;
	border: 1px solid #938074;
	-moz-box-shadow: 1px 1px 11px #322923;
	-webkit-box-shadow: 1px 1px 11px #322923;
	box-shadow: 1px 1px 11px #322923;
	height: 20px;
	padding: 0px 15px;
	font-size: 11px;
	font-weight: bold;
	color: #B0A7A1;
	margin-top: 4px;
	vertical-align: middle;
	line-height: 18px;
	margin-right: 2px;
}
	.calendar .fc-button:hover {
		color: #EBE9E7;
	}
	
.calendar .fc-button.fc-state-active {
	background-image: url("../../images/button-background-selected.png");
	color: white;
}

.fc-text-arrow {
	color: #ccc;
}
	.calendar .fc-button:hover {
		color: white;
	}

.calendar span.fc-header-title h2 {
	font-size: 11px;
	font-weight: bold;
	color:#EFECE7;
	padding: 8px 0 0 0;
}

.calendar span.fc-header-region {
	display: block;
	font-size: 11px;
	font-weight: bold;
	color:#EFECE7;
	padding: 8px 0 0 0;
}

.calendar .fc-button-today.fc-state-disabled { /* hide the 'today' button when it's disabled (i.e. content includes today's data) */
	display:none;
}
.calendar .fc-button-today .fc-button-inner {
	margin-left: 12px;
}

.calendar .fc-header-left {
	padding-left:10px;
}
.calendar .fc-header-right {
	padding-right:10px;
}


/* table content styles */
.calendar .fc-content{
	padding:0 5px 20px 5px;
	background-color:#F4F3EB;
}

.calendar .fc-content th {
	border-color:#CCC;
	border-width: 0 0 1px 0;
	color:#6A5120;
	font-size: 10px;
	font-weight: bold;
	text-align:left;
}

.calendar .fc-content td {
	background-color:white;
}
.calendar .fc-content td.fc-today {
	background-color: #FDEAD6;
	border-color: #F0A46B;
	border-width: 1px;
}

.calendar .fc-day-number {
	float:left;
	
	font-size: 11px;
	font-weight: bold;
	text-align:left;
}

.calendar .fc-other-month .fc-day-number {
	color:silver;
}

/* N.B. there's probably a lot of duplication now between month and week view styles now. It may make sense to combine them when design is stable */

/* month view event styles */
.calendar .fc-view-month .fc-event {
	background-color:transparent;
	border-width:0;
	margin: 2px 0;
}

.calendar .fc-view-month .fc-event-inner {
	background-color:transparent;
	border-width:0;
}

.calendar .fc-view-month .fc-event-head {
	color: #716F63;
	font-size: 11px;
}

.calendar .fc-view-month .fc-event-timezone {}

.calendar .fc-view-month .fc-event-title {
	color: #54301A;
	font-size: 11px;
	font-weight: bold;
}

.calendar  .fc-grid .fc-event-time {
	font-weight: normal;
}

.calendar  .fc-grid .fc-event-time-wrap
,.calendar-event-overlay .title-header .event-time-wrap {
	white-space: nowrap;
	display: inline-block;
	*display: inline;
	*zoom: 1;
}

.calendar .fc-view-month .fc-event-location {
	color: #E8810D;
	font-size: 11px;
	margin-bottom: 10px;
}

.calendar .fc-view-month .view-more-wrapper a {
	color: #D97A31;
	font-size: 10px;
}


/* week view styles */
.calendar .fc-view-basicWeek{}

.calendar .fc-view-basicWeek .fc-event {
	background-color:transparent;
	border-width:0;
	margin: 2px 0;
}

.calendar .fc-view-basicWeek .fc-event-inner {
	background-color:transparent;
	border-width:0;
}

.calendar .fc-view-basicWeek .fc-event-head {
	color: #716F63;
	font-size: 11px;
	font-weight: bold;
}

.calendar .fc-view-basicWeek .fc-event-timezone {
}

.calendar .fc-view-basicWeek .fc-event-title {
	color: #54301A;
	font-size: 11px;
	font-weight: bold;
	word-wrap: break-word
}

.calendar .fc-view-basicWeek .fc-event-location {
	color: #E8810D;
	font-size: 11px;
}


/* day view styles */
.calendar .fc-view-agendaDay{}

.calendar .fc-view-agendaDay .fc-day-content {
	background-color: #F4F3EB;
}

.calendar .fc-view-agendaDay .fc-event {
	background-color:transparent;
	border-width:0;
	min-height:15px;
}

.calendar .fc-view-agendaDay .fc-event-inner {
	background-color: #fff;
	border-width:0;
	min-height:15px;
	
	display: inline-block;
	*display: inline; /* ie hack */
	width: auto;
}

.calendar .fc-view-agendaDay .fc-event-inner:hover
,.calendar .fc-view-basicWeek .fc-event-inner:hover 
,.calendar .fc-view-month .fc-event-inner:hover {
	background-color:#E6D5C1;
}

.calendar .fc-view-agendaDay .fc-event-head {
	display: inline;
}

.calendar .fc-view-agendaDay .fc-event-time {
	color: #716F63;
	font-size: 11px;
	display: inline;
}

.calendar .fc-view-agendaDay .fc-event-allday .fc-event-time {
	display: none;
}

.calendar .fc-view-agendaDay .fc-event-timezone {
	display: none;
}

.calendar .fc-view-agendaDay .fc-event-title {
	color: #54301A;
	font-size: 11px;
	font-weight: bold;
	display: inline;
}

.calendar .fc-view-agendaDay .fc-event-location {
	display: none;
}

.calendar .fc-view-agendaDay .timeline {
    position: absolute;
    left: 59px;
    border: none;
    border-top: 1px solid red;
    width: 100%;
    margin: 0;
    padding: 0;
    z-index: 999;
}

/* view more overlays */
/* N.B. These can't be namespaced with .calendar, as qtip places them at bottom of page */
.ui-tooltip-view-more {/* we placve this class onto the outer generated div in qtip config object */
	*max-width:200px; /* IE 6/7 hack */
}
.view-more-overlay {}

.view-more-overlay h5{
	color:#555;
	font-size:11px;
	font-weight:bold;
}

.view-more-overlay .fc-event-inner{
	padding:2px;
}
.view-more-overlay .fc-event-inner:hover {
	background-color:#F9C7AF;
}


/* calendar event overlays */
/* N.B. These can't be namespaced with .calendar, as qtip places them at bottom of page */
.ui-tooltip-calendar-event {/* we placve this class onto the outer generated div in qtip config object */
	*min-width:200px;
}
.calendar-event-overlay {
	font-size: 12px;
	line-height: 1.2;
}

.calendar-event-overlay .title-header {
	margin-top: 5px;
}

.calendar-event-overlay .title-header .event-time
,.calendar-event-overlay .title-header .event-timezone {
	color: #A0763A;
	font-weight: bold;
	margin-bottom: 5px;
}

.calendar-event-overlay .title-header .event-timezone
{
	margin-left: 5px;
	text-transform: uppercase;
	font-size: 11px;
	font-weight: normal;
}

.calendar-event-overlay .title-header .event-date {
	color:#silver;
	font-size: 11px;
	font-weight: bold;
	text-transform: uppercase;
	margin-top: 1px;
	display: block;
}

.calendar-event-overlay .title-header .event-title {
	color: #54301A;
	font-weight: bold;
	font-size: 16px;
	margin: 5px 0 2px;
	display: block;
}

.calendar-event-overlay .related-docs-wrapper {
	margin-top: 10px;
	font-size: 11px;
	background: #fcfcfc;
	padding: 5px;
}

.calendar-event-overlay .related-docs-title { 
	background: #eee;
	padding: 5px;
	margin: -5px -5px 0;
	border-bottom: 1px solid #ddd;
}

.calendar-event-overlay ul.related-documents > li {
	border-top: 1px solid #ddd;
}

.calendar-event-overlay ul.related-documents > li:first-child {
	border-top: 0;
}


/* filter form styles */
/* N.B. these styles over-ride the default menu widget styles in css/widgets/menu.css */
.calendar .widget.menu {
	position: absolute;
	width: 350px;
	top: 5px;
	right: 0;
	z-index:10;
}
.calendar .widget.menu .menu-items{
	left:auto;
	width:370px;
}
.calendar .widget.menu .menu-items ul{
	border-top:1px dotted #AE9E94;
	padding:5px 0;
}
.calendar .widget.menu .menu-items li{
	display:inline-block;
	*display: inline; /* ie6 hack */
	*zoom: 1; /* ie6 hack */
	
	width:120px;
	border-width:0;
	vertical-align:middle;
	
	_vertical-align:top; /* ie6 hack */
}

.calendar .widget.menu .menu-items li:hover {
	background-color:#FFFCEF;
	color: #A29B7F;
}

.calendar .fc-event-group-title
,.calendar-event-overlay .title-header .event-country {
	display: block;
	font-weight: bold;
	color: white;
	margin-bottom: 3px;
	font-size: 11px;
	background: rgb(148, 115, 94);
	padding: 1px 3px;
	border-radius: 3px;
}

.calendar-event-overlay .grid-item-title:first-child {
	border-top: none !important;
}

.calendar-event-overlay .title-header .event-country {
	font-size: 12px;
	padding: 3px;
}

.calendar .fc-event-bg {
	display: none;
}

.view-more-overlay .fc-event-title {
	font-weight: bold;
}

.view-more-overlay  .fc-event-group-title {
	font-size: 10px;
	font-weight: bold;
	color: #666;
	border-bottom: 1px solid #666;
	margin-bottom: 2px;
	margin-top: 5px;
}