@charset "UTF-8";
/**
 * Drupal core's .visually-hidden
 *
 * Note the lack of !important on the position rule.
 * This allows us to change the position property after
 * *unhidding* an element using the unset-visually-hidden
 * mixin below.
 */
/* multi line truncation */
/**
 * Placeholder for dropdown!
 *
 * Selected option is grayed out to give it the look of a placeholder text.
 * This is good for unselected dropdowns where the top item says something like
 * 'Select ...'.  But it is not ideal where a value has been selected already.
 */
/**
 * Style overrides for jQueryUI datepicker.
 */
/**
 * Placeholder for dropdown!
 *
 * Selected option is grayed out to give it the look of a placeholder text.
 * This is good for unselected dropdowns where the top item says something like
 * 'Select ...'.  But it is not ideal where a value has been selected already.
 */
html {
  background-color: #fff;
  -webkit-box-sizing: border-box;
  box-sizing: border-box; }

*,
*::before,
*::after {
  -webkit-box-sizing: inherit;
  box-sizing: inherit; }

body {
  margin: 0; }

/**
 * @file
 * Style rules for the site header area.
 *
 * External variables used:
 *  - $base-font-color
 *  - $darkest-gray
 *  - $horizontal-bar-mode
 *  - $large-header-background
 *  - $light-gray
 *  - $medium-light-gray
 *  - $menu-item-color-active
 *  - $white
 */
/**
 * In medium display upwards, the top 3.75rem should be dark gray.  Remaining
 * bottom part should be light gray.
 */
#header {
  background-color: #FFF;
  /**
   * On larger displays, a dark bar spans the whole viewport width and
   * occupies the top 3.75rem.
   */ }
  @media only screen and (min-width: 769px) {
    #header {
      background: #FFF; } }

/**
 * Navigation menu in the header area containing links such as News, shows, etc.
 */
.menu--navigation {
  /* Remove bottom border from the top level menu items only.
   * Submenus should retain it. */ }
  .menu--navigation .menu {
    /* This targets triangle signs shown after parent menu items. */ }
    .menu--navigation .menu > .menu-item > .menu-link {
      color: #209cc0; }
      .menu--navigation .menu > .menu-item > .menu-link.is-active {
        color: #091045; }
      .menu--navigation .menu > .menu-item > .menu-link:focus, .menu--navigation .menu > .menu-item > .menu-link:hover {
        color: #091045; }
    .menu--navigation .menu .more.menu-item > .menu-link:after {
      color: inherit; }
  @media only screen and (min-width: 769px) {
    .menu--navigation > .menu > .menu-item {
      border-bottom: none; } }
  @media only screen and (min-width: 769px) {
    .menu--navigation {
      background-color: transparent; } }

/**
 * Login/Logout menu.
 */
.menu--account {
  text-transform: uppercase;
  background-color: #333; }
  @media only screen and (min-width: 769px) {
    .menu--account {
      background-color: transparent; } }
  .menu--account .menu-link {
    font-size: 14px;
    background-color: transparent; }

/**
 * Override colouring for hamburger menu.
 */
.is-open > .navigation-menu-button:after {
  color: #333; }

.is-open > .navigation-menu-button .burger:before,
.is-open > .navigation-menu-button .burger:after {
  background-color: #333; }

/**
 * @file
 * Style rules for the event calendar.
 *
 * External variables used:
 *  - $light-gray
 *  - $green-tint
 */
/**
 * Form wrapper for exposed filters.
 */
#views-exposed-form-events-event-listing-page {
  background-color: #ebebeb; }

.form-item-event-type > .form-select,
.form-item-event-type > .form-text,
.form-item-location > .form-select,
.form-item-location > .form-text,
.form-item-from-date > .form-select,
.form-item-from-date > .form-text,
.form-item-to-date > .form-select,
.form-item-to-date > .form-text {
  font-weight: lighter; }

/**
 * Date pickers.
 */
.form-item-from-date,
.form-item-to-date {
  color: #adadad;
  /* And their calendar icons. */ }
  .form-item-from-date > .form-text,
  .form-item-to-date > .form-text {
    border: 1px solid #d8d8d8; }
  .form-item-from-date > .ui-datepicker-trigger,
  .form-item-to-date > .ui-datepicker-trigger {
    color: #5b5b5b;
    background-color: inherit;
    font-weight: normal; }

.event-pager {
  font-size: 1.1em;
  color: #fff;
  background-color: #209cc0; }

.ui-datepicker {
  background: #f4f4f4; }
  .ui-datepicker.ui-widget-content {
    border: none;
    border-radius: 0;
    padding: 0;
    font-family: "Open Sans";
    font-weight: normal; }
  .ui-datepicker .ui-datepicker-title {
    line-height: 1.2rem;
    padding: 0.5rem 0; }
  .ui-datepicker .ui-widget-header {
    border: none;
    border-radius: 0;
    color: #fff;
    background-image: none;
    background: #5b5b5b;
    font-weight: normal; }
    .ui-datepicker .ui-widget-header .ui-corner-all {
      border: none; }
  .ui-datepicker .ui-datepicker-calendar {
    background-color: #f4f4f4; }
    .ui-datepicker .ui-datepicker-calendar th {
      font-weight: normal; }
    .ui-datepicker .ui-datepicker-calendar .ui-state-default {
      font-size: 0.9em;
      text-align: center;
      padding: 0.4em;
      border: none;
      background: none; }
    .ui-datepicker .ui-datepicker-calendar .ui-state-hover {
      background-color: #d8d8d8; }
    .ui-datepicker .ui-datepicker-calendar .ui-state-highlight {
      font-weight: bold; }
    .ui-datepicker .ui-datepicker-calendar .ui-state-active {
      background-color: #FFF49B;
      font-weight: bold; }
  .ui-datepicker .ui-datepicker-month {
    display: block;
    font-weight: 700;
    font-size: 1.4rem; }
  .ui-datepicker .ui-datepicker-year {
    font-size: 75%;
    font-weight: 100; }
  .ui-datepicker .ui-datepicker-prev {
    background: none;
    position: absolute;
    top: 0;
    width: auto;
    height: auto; }
    .ui-datepicker .ui-datepicker-prev span {
      display: none; }
    .ui-datepicker .ui-datepicker-prev:after {
      font-family: fontAwesome;
      content: "";
      color: #fff;
      font-size: 2rem;
      line-height: 3.5rem;
      cursor: pointer;
      position: absolute;
      left: 1rem; }
  .ui-datepicker .ui-datepicker-next-hover {
    right: 0;
    top: 0; }
  .ui-datepicker .ui-datepicker-prev-hover {
    left: 0;
    top: 0; }
  .ui-datepicker .ui-datepicker-next {
    background: none;
    position: absolute;
    top: 0;
    width: auto;
    height: auto; }
    .ui-datepicker .ui-datepicker-next span {
      display: none; }
    .ui-datepicker .ui-datepicker-next:after {
      font-family: fontAwesome;
      content: "";
      color: #fff;
      font-size: 2rem;
      line-height: 3.5rem;
      position: absolute;
      right: 1rem; }

.ui-datepicker-calendar {
  margin-bottom: 0.5rem; }

#views-exposed-form-events-event-listing-page + h3, .event-summary + h3 {
  font-size: 1.25em;
  line-height: 1.6rem; }
  @media only screen and (min-width: 769px) {
    #views-exposed-form-events-event-listing-page + h3, .event-summary + h3 {
      font-size: 1.75em;
      line-height: 2.25rem; } }

/**
 * @file
 * Event summary box from the event calendar.
 */
.event-summary .content-wrapper {
  background: -webkit-gradient(linear, left top, left bottom, from(#209cc0), color-stop(100%), to(transparent)) top/100% 2em #f4f4f4 no-repeat;
  background: linear-gradient(to bottom, #209cc0, 100%, transparent) top/100% 2em #f4f4f4 no-repeat;
  /**
   * The whole event record should be clickable and point to the event node.
   *
   * @see csc_sitewide/event-list asset library.
   */
  cursor: pointer; }
  .event-summary .content-wrapper > .event-start-date,
  .event-summary .content-wrapper > .event-end-date {
    font-size: 0.9em; }
  .event-summary .content-wrapper > .event-title {
    font-size: 1.4em;
    line-height: 2rem; }
  .event-summary .content-wrapper > .event-type {
    font-size: 0.75em;
    font-weight: bold;
    color: #912219; }
    .event-summary .content-wrapper > .event-type a {
      color: #912219; }
  .event-summary .content-wrapper > .event-location {
    font-size: 0.9em; }

/*# sourceMappingURL=theme.css.map */