calraijintaiko/caltaiko

// Place all the styles related to the upcoming_performances controller here.
// They will automatically be included in application.css.
// You can use Sass (SCSS) here: http://sass-lang.com/

.performance-page {
  .performance-title {
    margin-bottom: 0;
    text-transform: uppercase;
  }

  .performance-details {
    h3 {
      text-transform: uppercase;
    }
  }

  .performance-map {
    height: 0;
    margin-bottom: 50px;
    overflow: hidden;
    padding-bottom: 75%;
    position: relative;

    iframe {
      height: 100%;
      left: 0;
      position: absolute;
      top: 0;
      width: 100%;
    }
  }
}

.performance {
  @include box-style;
  margin-bottom: 50px;

  .performance-deets {
    p {
      color: $main-color;
      font-family: 'Oswald';
      margin-bottom: 1%;
      word-spacing: 2px;
    }

    time {
      float: left;
    }

    .where, .what {
      float: left;
      // Make them uppercase here instead of in the template so that
      // look nicer in Google rich snippets
      text-transform: uppercase;
    }

    .what {
      color: $main-color;
      margin-bottom: 0;
      margin-top: 0;
      text-shadow: 2px 2px 0 $sub-color-2;
    }

    .divider {
      float: left;
      font-size: 115%;
      margin-left: 25px;
      margin-right: 25px;
      position: relative;
      top: -3px;
    }
  }
}

.thumbnail-feed {
  .thumb-performance {
    @include box-style($width: 3px);
    display: inline-block;

    .details {
      padding: 3px 8px;

      .date-and-icons {
        position: relative;
      }
    }

    p {
      font-family: 'Oswald';
      margin-bottom: 0;
      overflow: hidden;
      $white-space: nowrap;
    }

    .perf-date {
      font-size: 13px;
    }
  }
}