//Import font for logo
@import url(http://fonts.googleapis.com/css?family=Copse|Josefin+Sans:700)

// This import applies a global reset to any page that imports this stylesheet.
@import blueprint/reset

// Import all the default blueprint modules so that we can access their mixins.
$alt-text-color: #cccccc 
$blueprint-background-color: #f9f9f9 
$blueprint-border-color: #ddd 

//Set some custom colors
$myred: #ae1f24

$link-color: lighten($myred, 12%) 
$link-hover-color: darken($myred, 12%)

@import blueprint
@import blueprint/buttons

$blueprint-font-family: DejaVu Sans, Helvetica, Arial, sans-serif
$blueprint-fixed-font-family: Inconsolata, DejaVu Sans Mono, "andale mono", monospace
$blueprint-font-size: 13px

@import compass/css3
@import plugins/my_mixins

//Uncomment the following for a liquid layout
//$blueprint-liquid-container-width: 86%
//@import blueprint/liquid

body.bp
  +blueprint(true)

//Start Styling
$logo_font: "Josefin Sans"
$header-font: "Copse", $blueprint-font-family
html
  background: $blueprint-background-color
  +background-image(linear-gradient(#fafafa, #e8e8e8, $blueprint-background-color))

h1, h2, h3, h4, h5, h6
  font-family: $header-font

a, body.bp a
  text-decoration: none
a:hover, body.bp a:hover
  text-decoration: underline
a.banner:hover, body.bp a.banner:hover
  text-decoration: none

#container
  +container

#header, #footer
  width: 100%

#header
  h1
    font-size: 4em
    color: $myred
    font-family: $logo_font, $header-font
    margin-bottom: 1em
    text-align: center
    line-height: 2em
    span.tag
      font-size: 1.4em
  ul.relevant-links
    +container
    padding: 0
    li
      text-align: center
      +float-right
      margin: 0
      &.last
        +last
      a
        +anchor-button
        +box-shadow(inset 0px 1px 0px 0px #ffffff)
        +border-radius(6px)
        +background-image(linear-gradient(center top, #f0f0f0 5%, #e3e3e3 100%))
        background-color: #ededed
        border: 1px solid #dcdcdc
        $button_text_color: desaturate($myred, 23%)
        color: $button_text_color
        +inset-shadow
        &:hover
          +background-image(linear-gradient(center top, #e3e3e3 5%, #f0f0f0 100%))
          background-color: #dfdfdf
          color: $button_text_color

#content
  +column(18)
  +push(3)
  +append(3)
  .section
    $spacing: .5em
    +inset-shadow
    margin-bottom: 40px    
    h2
      margin-bottom: 0
    h4
      margin-top: 10px
    .content
      background: #e6e6e6
      border: 1px solid #f0f0f0
      margin: 0 0 $spacing
      padding: 20px
      +box-shadow(darken(#e6e6e6, 30%) 0 0 $spacing * .7 inset)
      +border-radius($spacing)
      p
        margin-bottom: 20px
      p:last-child
        margin-bottom: 0
      blockquote
        color: #544
        font-style: normal
        em
          color: $myred

  .section.schedule
    ul
      list-style-type: none

      ul > li
        margin-left: 44px
    em
      color: $myred
      margin-left: 10px

  .section.faq
    ul
      list-style-type: none

      & > li      
        margin-top: 0
        margin-bottom: 20px

        &:last-child
          margin-bottom: 0

      ul > li
        margin-left: 20px


#footer
  font-family: $header-font
  +inset-shadow
  text-align: center

#irc
  width: 100%
  min-height: 500px
  margin-bottom: 30px