@import "will_paginate";

@mixin gradients {
  background-image: -webkit-gradient(
    linear,
    left bottom,
    left top,
    color-stop(0.50, rgb(88,142,222)),
    color-stop(1, rgb(150,206,255))
  );
  background-image: -moz-linear-gradient(
    center bottom,
    rgb(88,142,222) 50%,
    rgb(150,206,255) 100%
  );
}

.grid_1, .grid_2, .grid_3, .grid_4, .grid_5, .grid_6, .grid_7, .grid_8, .grid_9, .grid_10, .grid_11, .grid_12 {
  background-color:#eee;
}

.grid_12 {
  border-left:solid #222 1px;
  border-right:solid #222 1px;
}

body {
  background-color:#AAA;
}

header {
  @include gradients;
  border-bottom:solid 1px #222;
  padding-bottom:10px;
  color:#eee;
}

h1#site-title {
  font-size:2.5em;
  padding:10px 20px 5px;
}

h1#site-tagline {
  font-size:1.5em;
  padding:10px 20px 10px;
}

#main {
  padding-top:20px
}

.entry {
  padding:20px 0;
  border-bottom:solid 1px #333;

  .title {
    font-size:1.5em;
  }

  .date {
    font-size:.9em;
    padding:5px 0;
  }

  .meta {
    color:#eee;
    background-color:#AAA;
    font-size:.9em;
    margin-top:10px;
    padding:10px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    border-radius: 5px;
    a {
      color:#eee;
    }
  }
}

.last {
  border-bottom:none;
}

#site-title a, #site-title a:visited {
  color:#eee;
  text-decoration:none;
}

#comments {
  padding-top:20px;

  .author {
    font-weight:bold;
    padding:10px 0 5px 10px;

    .when {
      padding-left:10px;
      font-size:.8em;
    }
  }

  .body {
    padding:5px 20px;
    border-bottom:solid 1px #333;
  }

  #new_comment {
    padding-top:20px;

  }
}


.button {
  @include gradients;
  color:#eee;
  height:30px;
  -webkit-border-radius: 5px;
  -moz-border-radius: 5px;
  border-radius: 5px;
  border:solid 1px #333;
  padding: 0 10px !important;
  overflow: visible;
}

pre {
  color:#eee;
  background-color:#222;
  margin:10px auto;
  padding:5px auto;
  border-top:solid #777 2px;
  border-bottom:solid #777 2px;
  overflow-x:auto;
}

label abbr {
  color:red;
  padding:0 3px;
}

.inline-errors {
  color:red;
}

#comment_nickname_input {
  display:none;
}

.nav {
  height:2.5em;
  line-height:2.5em;
  border-bottom:solid 1px #222;
  background-image: -webkit-gradient(
      linear,
      left bottom,
      left top,
      color-stop(0.26, rgb(159,161,158)),
      color-stop(0.63, rgb(210,214,214))
  );
  background-image: -moz-linear-gradient(
      center bottom,
      rgb(159,161,158) 26%,
      rgb(210,214,214) 63%
  );

  li {
    display:inline;
    padding:0 0 0 10px;

    a, a:visited, a:active {
      color:#222;
    }
  }
}

.admin {
  text-align:right;

  li {
    padding:0 10px 0 0;
  }
}

h2 {
  font-size:1.25em;
}

table.entries {
  width:100%;

  td {
    font-size:1.1em;
    height:32px;
    line-height:32px;
    padding:0 10px;
  }

  td.icons {
    width:64px;
    white-space:nowrap;
  }

  td.when {
    text-align:right;
  }
}

footer {
  height:64px;
  line-height:64px;
  text-align:center;
}

form {
  label {
    padding-top:10px;
    display:block;
  }

  select {
    padding:5px !important;
    font-size:1.5em !important;
  }

  input[type=submit] {
    margin:10px 10px 10px auto !important;
  }

  input[type=text], input[type=url], input[type=email], input[type=password] {
    width:50%;
    padding:5px !important;
    font-size:1.5em !important;
  }

  textarea {
    width:100%;
    height:200px;
    padding:5px !important;
    font-size:1.5em !important;
  }

  li {
    list-style-type: none;
    list-style-image: none;
    list-style-position: outside;
  }
}