﻿.calShell { margin-bottom: 20px; }
.calShell table { margin: 0; }
.calShell img { border: 0; }
.calGrid { border-collapse: collapse; width: 100%;  }

/* BUTTONS */
.calViewsShell a,
.calDateControlPrevious,
.calDateControlNext,
.calListDayEventSlideshowControls a,
.calFormatsList li a { text-indent: -9999px; width: 17px; height: 17px; display: block; font-size: 10px; padding: 0; /*set small font size so icon hyperlinks don't have their text cause scrollbars*/ }
.calViewsShell a:hover,
.calDateControlPrevious:hover,
.calDateControlNext:hover,
.calListDayEventSlideshowControls a:hover,
.calFormatsList li a:hover { opacity: .75; }
.calClearSearch {padding-left: 5px; font-size: 12px;}

/* BUTTON SHELLS */
.calViewsShell .calFilterField,
.calDateControlsShell .calFilterField,
.calListDayEventSlideshowControls a,
.calFormatsList li { float: left; }

.calSearchShell { margin: 0 0 10px 0; }

/* FORMATS */
.calFormatsShell { margin: 0 0 10px 0; }
.calFormatsListShell { overflow: auto; line-height: normal;  }
.calFormatsList { margin: 0 !important; padding: 0 !important; float: right; }
.calFormatsList li { display: inline; list-style-type: none; margin: 0; padding: 0; background: none;  }
.calFormatsICal { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconICal.png') no-repeat; margin: 0; }
.calFormatsRSS { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconRSS.png') no-repeat; margin: 0 0 0 5px; }
.calFormatsPrint { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconPrint.png') no-repeat; margin: 0 0 0 5px; }

/* CONTROLS */
.calFiltersShell { overflow: auto; line-height: normal; margin-bottom: 10px; }
.calFiltersShell select { margin: 0; }
.calCategoriesShell { float: left; margin: 0 10px 0 0; }
.calViewsShell { float: left; }
.calViewGrid { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconGrid.png') no-repeat; margin: 2px 10px 0 0;}
.calViewList { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconList.png') no-repeat; margin: 2px 0 0 0; }
.calDateControlsShell { float: right; }
.calDateControlPrevious { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconPrev.png') no-repeat; width: 8px; margin: 0 5px 0 0; }
.calDateControlDropdown { float: left; }
.calDateControlNext { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconNext.png') no-repeat; width: 8px; margin: 0 0 0 5px; }
.calFilterShell {  }
.calFilterLabel { margin-bottom: 2px; }
.calFilterFieldGroup { overflow: auto; }
.calFilterField { }
.calFriendlyNameShell { float: left;  margin: 0 10px 0 0; }

.calPageNumberControls {padding:0; margin:0;}
.calPageNumberControls li{display: inline; list-style-type: none; padding-right: 10px; margin:0;}
.calPageNumberSelected {font-weight: bold; color: Gray;}

.calPagingBottom {padding-Top: 30px;}

/* BREADCRUMBS */
.calBreadcrumbsShell { padding: 10px 0 10px 0; border-top: 1px solid #000000; }
.calBreadcrumList { list-style-type: none; margin: 0 !important; padding: 0 !important; }
.calBreadcrumList li { margin: 0; padding: 0; display: inline; background: none; }
.calBreadcrumList li a { display: inline; background: none; padding: 0; margin: 0; }
.calBreadcrumList li span.calBreadcrumbDivider {  }

/* CALENDAR TABLE */
.calGrid  { }
.calGrid table.calGridMonthTitle { width: 100%; font-size: 2em; }
.calGrid th { font-weight: bold; text-transform: uppercase; padding: 3px 0 3px 0; text-align: center; }
.calGrid td.calGridDayCell { border-top: 1px solid #000000; }
.calGrid td.calGridDayOutOfRange {  }
.calGrid td.calGridDayInvisibleTrailing { border: none; }
.calGrid td.calGridDayCell div.calGridDayNumber { padding: 1px 5px 1px 5px; }
.calGrid td.calGridDayCell div.calGridDayNumber a { color: inherit; text-decoration: none; }
.calGrid td.calGridDayOutOfRange div.calGridDayNumber { padding: 1px 5px 1px 5px; }
.calGrid td.calGridDayOutOfRange div.calGridDayNumber a { color: #888888; text-decoration: none; }
.calGrid td.calGridDayCell div.calGridDayNumber a:hover,
.calGrid td.calGridDayOutOfRange div.calGridDayNumber a:hover { text-decoration: underline; }
.calGrid td.calGridDayCell div.calGridDayEvents { min-height: 50px; padding: 3px; }
.calGrid td.calGridDayCell div.calGridDayEvents div.calGridDayEvent { margin: 0 0 10px 0; }
.calGrid td.calGridDayCell div.calGridDayEvents a.calGridDayEventLink {  text-decoration: none; display: block;  }
.calGrid td.calGridDayCell div.calGridDayEvents a.calGridDayEventLink .calGridDayEventThumbnail { width: 100%; }
.calGrid td.calGridDayCell div.calGridDayEvents a.calGridDayEventLink h4.calGridDayEventTitle { margin: 0; text-decoration: underline;  }
.calGrid td.calGridDayCell div.calGridDayEvents a.calGridDayEventLink div.calGridDayEventCategory { font-style: italic;  }
.calGrid td.calGridDayCell div.calGridDayEvents a.calGridDayEventLink div.calGridDayEventDescription {  }

.calGrid td.calGridCurrentDay {  }
.calGrid td.calGridCurrentDay div.calGridDayNumber { font-weight: bold; }

/* GRID EMBEDED */
.calEmbeded .calGrid .calGridDayNumber { text-align: center; }
.calEmbeded .calGrid .calGridDayHasEvents .calGridDayNumber { background-color: #FCFF65; }
.calEmbeded .calGrid table.calGridMonthTitle { font-size: 1.5em; }

/* CALENDAR LIST */
.calListDayEvent { overflow: auto; }
.calListDayEventLink { display: block; }
.calListDayEventThumbnail { float: right; margin: 0 0 10px 10px; width: 20%; }
.calListDayEventCategory { font-style: italic; margin-bottom: 5px;  }
.calListDayEventBookingLink { display: block; margin-top: 10px; }
.calListDayEventAddToCalendarLink { display: block; margin-top: 30px; clear: both; }
.calListDayEventShare { margin-top: 20px; clear: both; overflow: auto; }
.calListDayEventShareTwitter,
.calListDayEventShareGooglePlus,
.calListDayEventShareFacebook { float: left; margin-right: 5px; }

/* LIST EMBEDDED */
.calEmbeded .calListDayEventThumbnail { width: 30%; }

/* EVENT SLIDESHOW */
.calListDayEventSlideshow { padding: 5px; float: right;  margin: 0 0 10px 10px; border: 1px solid #AAAAAA; background: #FFFFFF; line-height: 17px; /*same as height of icons*/ }
.calListDayEventSlideshow ul { list-style-type: none; margin: 0 0 5px 0 !important; padding: 0 !important; }
.calListDayEventSlideshow ul,
.calListDayEventSlideshow ul li { width: 250px; height: 187px; background: none;  }
.calListDayEventSlideshow ul li { margin: 0 !important; padding: 0 !important; }
.calListDayEventSlideshow ul li img { padding: 0; margin: 0; }
.calListDayEventSlideshow ul li img.calListDayEventSlideshowTallImage { height: 100%; width: auto; }
.calListDayEventSlideshow ul li img.calListDayEventSlideshowWideImage { width: 100%; height: auto; }
.calListDayEventSlideshowControls { overflow: auto; float: left; margin-left: 37%; }
.calListDayEventSlideshowControls .calListDayEventSlideshowPrev { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconPrev.png') no-repeat; width: 8px; margin: 0 5px 0 0; }
.calListDayEventSlideshowControls .calListDayEventSlideshowCount { display: block; float: left; }
.calListDayEventSlideshowControls .calListDayEventSlideshowNext { background: url('https://app.hospitalitysem.com/cms/calendar/img-iconNext.png') no-repeat; width: 8px; margin: 0 0 0 5px; }

/* EMBED OTHER STYLES */
.calMoreEvents { margin-top: 15px; }

/* ADD YOUR EVENT */
.calAddYourEventLink { float: right; padding: 10px 0 10px 0; }
.calAddYourEventFormShell fieldset { border: 0; padding: 0; margin: 0; }
.calAddYourEventFormShell legend { padding: 0; font-weight: bold; margin: 0 0 10px 0; }
.calAddYourEventFormShell label { display: block; }
.calAddYourEventFormShell input, .calAddYourEventFormShell select,  .calAddYourEventFormShell textarea { margin: 0 0 10px 0; }
.calAddYourEventFormShell .calAddYourEventButton { display: block; margin-top: 10px; }
.calRequiredFieldIndicator { vertical-align: top; }

/* ARIA */

.customDropdownShell [role="listbox"] {
	/*min-height: 18em;*/
	padding: 0px;
	background: white;
	border: 1px solid #aaa;
}

.customDropdownShell [role="option"] {
	display: block;
	padding: 0 20px 0 5px; /*big right padding to accommodate for firefox not handling width auto and white-space nowrap on the options, it was causing a horizontal scrollbar*/
	position: relative;
  white-space: nowrap;
  cursor: default;
}

.customDropdownShell [role="option"].focused {
	background: #1E90FF;
}

.customDropdownShell [role="option"]:hover {
	background: #c6e3ff;
}

/*.customDropdownShell [role="option"][aria-selected="true"]::before {
	content: '✓';
	position: absolute;
	left: 0.5em;
}*/

.customDropdownShell button[aria-disabled="true"] {
	opacity: 0.5;
}

.customDropdownShell {
  float: left;
}

.customDropdownShell .customDropdownButton {  
  text-align: left;
  padding: 1px 5px 1px 5px;
	width: 150px;
  white-space: nowrap;
  overflow: hidden;
  text-overflow: ellipsis;
	position: relative;
  background: #FFF;
  border: 1px solid;
}

.customDropdownShell .customDropdownButton::after {
	width: 0;
  height: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
  border-top: 6px solid #000000;
  content: " ";
  position: absolute;
  right: 5px;
  top: 35%;
}

.customDropdownShell .customDropdownButton[aria-expanded="true"]::after {
	width: 0;
  height: 0;
  border-left: 3px solid transparent;
  border-right: 3px solid transparent;
	border-top: 0;
  border-bottom: 6px solid #000000;
  content: " ";
  position: absolute;
  right: 5px;
  top: 35%;
}

.customDropdownShell .customDropdownList {
	border-top: 0;
	max-height: 18em;
	overflow-y: auto;
  overflow-x: hidden;
	position: absolute;
	margin: 0;
  z-index: 9999;
}

.customDropdownShell .hidden {
	display: none;
}


.calGridDayEventIndicator {
  background: #d7d7d7;
  border-radius: 99px;
  width: 20px;
  height: 20px;
  font-weight: normal;
  margin: 0 5px 5px 5px;
  cursor: pointer;
  text-align: center;
  line-height: normal;
}

/* hide the events list in the grid view if on mobile because javascript will provide event count indicators to show the list below the grid */
@media (max-width:991px) {
  .calGridDayCell .calGridDayEvents { display: none; }
}