@import url('https://fonts.googleapis.com/css?family=Nunito+Sans:400,700');

@import 'normalize';
@import 'font-awesome';
$light-gray: #EEEEEE;
$color: #51c4c4;
$text-color: #333;

body {
  font-family: 'Nunito Sans', Arial, Helvetica, sans-serif;
  background-color: $color;

  // the container within the body
  .centered {
    max-width: 800px;
    margin: 3em auto;

    background: #FFF;
    padding: 2em;
    font-size: 1.5em;

    // the header
    h1 {
      margin-top: 0px;
      color: $text-color;
    }

    p {
      color: $text-color;
    }

    // code blocks
    code {
      background: $light-gray;
      color: #BB3333;
      padding: 0.2em;
      border-radius: 3px;
      margin-left: 0.3em;
      margin-right: 0.3em;
    }

    a {
      display: block;
      color: darken($color, 20%);
      margin-top: 0.5em;
      margin-bottom: 0.5em;
    }
  }
}

.footer {
  position: absolute;
  bottom: 0;

  background: $light-gray;
  width: 100%;
  .wrapper {
    text-align: center;
    padding: 1em;
  }
}


// The styles for the component
@import '../styles/fuzzy-picker';
