@import "nib"

// Vendor Includes - include first so we can override
// Import only styles that do not have urls to images! Include them directly in the page!
@import "../bower_components/angular-loading-bar/build/loading-bar.css"
@import "./shared.styl"
@import "./footer"

body
  margin-top: 60px

#aboutPage
  iframe
    margin-bottom: 20px

.muted i, i.muted
  opacity:0.5

#header-play-button
  margin-right: 15px

#tagline
  margin:10px 0 20px 0
  font-size:40px

.marketing
  text-align: center

.static-old-news
  h2
    font-weight: 700
    font-size: 16px
    margin-top: 30px
    text-transform: uppercase
  h3
    font-weight: 700
    font-size: 14px
    margin-top: 20px
  .pull-right
    margin-left: 5px

#frontpage-play-button
  //box-shadow: 0 0 40px #494141;
  display: inline
  font-size: 20px
  min-width: 100px
  height: 50px

#about-page
  img
    box-shadow 0px 0px 10px 5px #888
    margin 10px
    max-width 500px

// Accordion tweaks for FAQ

a.h2.accordion
  display: block
  text-decoration: none

a.h2.accordion:before
  font-family: 'Glyphicons Halflings'
  color: grey
  content: "\e114"
  margin-right: 0.5em

a.h2.accordion.collapsed:before
  font-family: 'Glyphicons Halflings'
  color: grey
  content: "\e080"
  margin-right: 0.5em

// Merch Page

.merch-block
  border: 1px dotted #553889
  border-radius: 6px
  padding: 15px
  margin-bottom: 20px
  &:hover
    background: #f5f5f5
  div
    width 100%
    text-align center
    padding: 30px 0
    a img
      display inline
      max-width: 350px
  img
    display: block
    max-width: 200px
  .btn
    width 100%
    background-color: #553889
    margin-top: 20px
    color: #ffffff
    &:hover
      color: #ffffff
      background-color: #452d6e
      border-color: #342253