/*
 *= require_self
 *= require "smoothness/jquery-ui-1.8.5.custom.css"
 *= require_tree .
*/

$link_color: #006FFA;
$link_hover_color: #9093FF;
$h1_size: 2em;
$h2_size: 1.5em;
$h3_size: 1.16667em;
$h1_padding: 1.25em 0;
$h2_padding: 1.45833em 0;
$h3_padding: 1.51785em 0;

html, body, div, span, applet, object, iframe,
h1, h2, h3, h4, h5, h6, p, blockquote, pre,
a, abbr, acronym, address, big, cite, code,
del, dfn, em, img, ins, kbd, q, s, samp,
small, strike, strong, sub, sup, tt, var,
b, u, i, center,
dl, dt, dd, ol, ul, li,
fieldset, form, label, legend,
table, caption, tbody, tfoot, thead, tr, th, td,
article, aside, canvas, details, embed, 
figure, figcaption, footer, header, hgroup, 
menu, nav, output, ruby, section, summary,
time, mark, audio, video {
  margin: 0;
  padding: 0;
  border: 0;
  font-size: 100%;
  font: inherit;
  vertical-align: baseline;
}
/* HTML5 display-role reset for older browsers */
article, aside, details, figcaption, figure, 
footer, header, hgroup, menu, nav, section {
  display: block;
}
ol, ul {
  list-style: none;
}
blockquote, q {
  quotes: none;
}
blockquote:before, blockquote:after,
q:before, q:after {
  content: '';
  content: none;
}
table {
  border-collapse: collapse;
  border-spacing: 0;
}


/*** BEGIN CUSTOM STYLES ***/
body {
  font-family: Verdana, Helvetica, sans-serif;
  padding: 0;
  margin: 0;
  line-height: 1.25em;
}

article, section {
  display: block;
}

a:link {
  color: $link_color;
  text-decoration: none;
}

a:visited {
  color: $link_color;
  text-decoration: none;
}

a:hover {
  color: $link_hover_color;
  text-decoration: none;
}

a:active {
  color: $link_color;
  text-decoration: none;
}

abbr[title=required] {
  display: none;
}

blockquote {
  margin: 0 0 1em 0;
  padding: 1em;
  border: 1px solid #666;
  background: #EEE;
}

code {
  font-family: monospace;
  font-size: 1.2em;
}

dd {
  margin-bottom: 1em;
}

dt {
  font-weight: bold;
}

em {
  font-style: italic;
}

h1, h2, h3 {
  font-family: Tahoma;
  font-weight: bold;
  line-height: 1.25em;
}

h1 {
  font-size: $h1_size; 
}

h2 { 
  font-size: $h2_size; 
}

h3 { 
  font-size: $h3_size; 
}

div.prose {
  h1, h2, h3 {
    line-height: 1em;
  }
  
  h1 {
    padding: $h1_padding; 
  }

  h2 { 
    padding: $h2_padding; 
  }

  h3 { 
    padding: $h3_padding; 
  }
}

header {
  margin: 0 0 1em 0;
  padding: 0;
  display: block;
}

img {
  border: none;
  vertical-align: middle;
}

input[type=text], input[type=password], input[type=url], textarea, button {
/*  border: 1px solid #AAA;*/
  font-size: 1em;
/*  -moz-border-radius: 4px;*/
/*  -webkit-border-radius: 4px;*/
}

input[type=submit] {
  padding: 1px 4px;
/*  border: 1px solid #AAA;*/
/*  background-color: #EEE;*/
/*  -moz-border-radius: 4px;*/
/*  -webkit-border-radius: 4px;*/
  font-size: 1em;
  cursor: pointer;
}

input:focus, textarea:focus {
/*  background-color: #FFD;*/
}

input[type=submit]:hover {
/*  background-color: #F6F6F6;*/
}

menu {
  margin: 0;
  padding: 0;
  
  ul {
    margin: 0;
    padding: 0;
  }
  
  li {
    margin: 0;
    padding: 0 0.25em;
    list-style-type: none;
    display: inline;    
  }
}

header#top {
  h1 {
    margin: 5px 30px 0 30px;
  }
  
  menu {
    background: #F7F7FF;
    padding: 5px 20px;
    
    li {
      padding: 5px 10px;
    }
  }
  
  menu.main {
    background: white;
    
    li.current {
      background: #F7F7FF;
      font-weight: bold;
    }
  }
}

p {
  margin-bottom: 1em;
}

section {
  display: block;
}

span.error {
  display: block;
  font-weight: bold;
  color: red;
}

span.link {
  color: $link_color;
  cursor: pointer;
}

span.wait {
  color: #CCC;
}

span.ui-icon {
  float: left;
  margin-top: 0.2em;
  margin-right: 0.25em;
}

strong {
  font-weight: bold;
}

table tfoot {
  margin-top: 2em;
}

table.striped {
  p {
    margin: 0;
  }
  
  tbody {
    tr:hover {
      background-color: #FFE;
    }
  }
  
  tr.even {
    background-color: #EEE;
  }
}

div.error-messages {
  margin: 1em 0;
  padding: 1em;

  span.ui-icon {
    float: left;
    margin-right: 0.5em;
  }
  
  h1 {
    font-size: 1em;
    color: #A00;
  }
}

div#search {
  margin-bottom: 1em;
}

div#notice {
  margin: 1em 0;
  padding: 1em;
  
  span.ui-icon {
    float: left;
    margin-right: 0.5em;
  }
}

div#page {
  margin: 0 30px;
  
  aside#sidebar {
    width: 20%;
    float: left;
    
    h1 {
      font-size: $h3_size;
    }
    
    ul {
      list-style-type: none;
    }
    
    input[type=text] {
      width: 10em;
    }
  }

  aside#sidebar > section {
    margin-bottom: 1em;
  }

  section#content {
    width: 75%;
    float: left;
    margin-left: 2em;
    overflow: hidden;
  }
}

div.clearfix {
  clear: both;
}


/*** Post previews ***/
div.post-previews {
  overflow: hidden;
}


/*** Paginator ***/
div.paginator {
  display: block;
  padding: 2em 0 1em 0;
  font-size: 1em;
  text-align: center;
  font-weight: bold;
  clear: both;
  
  a {
    margin: 0 3px;
    padding: 2px 6px;
    font-weight: normal;
    border: 1px solid #EAEAEA;
  }

  a.arrow {
    border: none;
  }

  a.arrow:hover {
    background: white;
    color: #9093FF;
  }

  a.current {
    border: 1px solid #AAA;
  }

  a:hover {
    background: rgb(60, 60, 220);
    color: white;
  }

  span {
    margin: 0 3px;
    padding: 2px 6px;
  }
}


/*** Dialog Boxes ***/
div.ui-dialog {
  ul {
    margin-left: 1em;
    margin-bottom: 1em;
  }
}


/*** Simple Form ***/
form.simple_form {
  margin: 0 0 1em 0;
  
  div.input.boolean {
    label {
      display: inline;
    }
  }
  
  div.input {
    margin-bottom: 1em;
    
    input[type=text], input[type=file], input[type=password], input[type=email] {
      width: 20em;
    }
    
    textarea {
      width: 30em;
    }
    
    label {
      display: block;
      cursor: pointer;
      font-weight: bold;
    }
    
    span.hint {
      color: #666;
      font-style: italic;
      display: block;
    }
    
    fieldset {
      border: none;
      display: inline;
      margin: 0;
      padding: 0;
      
      label {
        font-weight: normal;
        width: auto;
        margin-right: 2em;
        display: inline;
      }
    }
  }
}


/*** DText Preview ***/

div.dtext {
  width: 30em;
  
  ul {
    margin-left: 1em;
  }
}


/*** Pool Elements ***/

div#c-pool-elements {
  div#a-new {
    font-size: 0.8em;
    
    form {
      margin-bottom: 1em;
    }
    
    li {
      margin-left: 1em;
      cursor: pointer;
    }
    
    h1 {
      font-size: $h3_size;
    }
  }
}



/*** Pools ***/

div#c-pools {
  h1 {
    font-size: $h2_size;
  }
  
  p {
    width: 30em;
  }
  
  textarea {
    height: 10em;
  }
}


/*** Pool Orders ***/

div#c-pool-orders {
  h1 {
    font-size: $h2_size;
  }
  
  div#a-edit {
    ul.ui-sortable {
      list-style-type: none;

      li {
        padding: 0.5em;
      }

      li.ui-state-default {
        margin-bottom: 20px;
        width: 180px;
        background: none;
      }

      li.ui-state-placeholder {
        margin-bottom: 20px;
        width: 180px;
        height: 150px;
        background: none;
      }
    }
  }
}

/*** Comments ***/

div.comments-for-post {
  div.list-of-comments {
    article {
      margin-bottom: 2em;
      
      div.author {
        width: 20%;
        float: left;
        
        h1 {
          display: block;
          font-size: $h2_size;
        }
      }
      
      div.content {
        margin-left: 2em;
        width: 30em;
        float: left;
      }
    }
  }
  
  div.comment-preview {
    margin-bottom: 2em;
  }
}

div.dtext-preview {
  border: 2px dashed #AAA;
  padding: 1em;
  margin: 1em 0;
  width: 30em;
}

div#c-comments {
  div#a-index {
    div.header {
      span.info {
        margin-right: 1.5em;
      }

      strong, time {
        margin-right: 0.3em;
      }
      
      time {
        font-weight: bold;
      }
      
      div.list-of-tags {
        a {
          margin-right: 0.5em;
        }
      }
      
      div.notices {
        margin: 1em 0;
      }
    }
    
    div.preview {
      float: left;
      width: 180px;
    }
    
    div.post {
      margin-bottom: 4em;

      div.comments-for-post {
        float: left;
        width: 55em;
      }
    }
  }
}


/*** Favorites ***/
div#c-favorites {
  section#content > h1 {
    display: none;
  }
}


/*** Posts ***/

article.post-preview {
  margin-right: 4em;
  margin-bottom: 4em;
  float: left;
}

article.post-preview.blacklisted-active {
  display: none;
}

div#c-posts {
  div.notice {
    font-size: 0.8em;
    padding: 1em;
    margin-bottom: 1em;
    
    ul {
      margin-left: 1em;
    }
  }
  
  aside#sidebar > section#pool-sidebar {
    span.ui-icon {
      color: #666;
    }
  }
  
  aside#sidebar > section > ul li {
    list-style-type: none;
  }

  aside#sidebar > section > ul ul li {
    margin-left: 1em;
  }

  aside#sidebar > section#blacklist-box ul {
    margin-left: 1em;
    
    li {
      list-style-type: disc;
    }
    
    a {
      color: $link_color;
      cursor: pointer;
    }
    
    span {
      color: #AAA;
    }
  }
  
  h1 {
    font-size: $h3_size;
  }
  
  div#wiki-page-excerpt {
    position: relative;
    width: 40em;
    
    div#hide-or-show-wiki-page-excerpt {
      font-size: 1em;
      position: absolute;
      top: 0;
      right: 0;
      
      span {
        cursor: pointer;
        color: #AAA;
      }
      
      span:hover {
        color: #333;
      }
    }
  }
  
  div#a-show {
    menu#post-sections {
      font-size: $h3_size;
      font-weight: bold;
      line-height: 1.25em;

      li a {
        color: $link_color;
      }
    }
    
    section#notes article {
      margin-bottom: 1em;
    }
  }
}

div#c-explore-posts {
}


/*** Post Histories ***/
div.post_histories {
  div.index {
    div.post {
      margin-bottom: 2em;
      
      div.preview {
        width: 20%;
        float: left;
      }
      
      div.history {
        width: 70%;
        float: left;
        
        table {
          width: 100%;
        }
        
        ins {
          color: green;
          text-decoration: none;
        }
        
        del {
          color: red;
          text-decoration: line-through;
        }
      }
    }
  }
}


/*** Post Unapprovals ***/
div#unapprove-dialog {
  p {
    margin-bottom: 1em;
  }
}


/*** Sessions ***/
div#sessions {
  div#new {
    section {
      width: 30em;
      float: left;
    }
  
    h1 {
      font-size: $h2_size;
    }
  }
}


/*** Artists ***/
div#c-artists {
  span.new-artist {
    font-weight: bold;
    color: #A00;
  }

  div#a-show {
    max-width: 60em;

    p.legend {
      margin-bottom: 2em;
      font-size: 0.8em;
      font-style: italic;    
    }
  }
  
  div#a-edit, div#a-new {
    textarea {
      height: 5em;
    }
  }
}


/*** Users ***/
div#c-users {
  div#a-new {
    max-width: 60em;
    
    p {
      margin-bottom: 1em;
    }
    
    li {
      margin-left: 1em;
      list-style-type: disc;
    }
    
    div#account-comparison {
      h1 {
        font-size: $h2_size;
      }
      
      li {
        font-size: 0.8em;
        line-height: 1.5em;
      }
      
      section {
        width: 18em;
        float: left;
        padding: 1em;
      }
    }
    
    footer.nav-links {
      font-size: 1.4545em;
      font-weight: bold;
      text-align: center;
      display: block;
    }
    
    div#p2 ul {
      margin-bottom: 2em;
    }
  }
}

/*** Uploads ***/
div#c-uploads {
  div#a-new {
    div#upload-guide-notice {
      margin-bottom: 2em;
    }

    fieldset.ratings {
      label {
        display: inline;
      }
    }
  }
}



/*** Forum ***/
div.list-of-forum-posts {
  article {
    margin-bottom: 3em;
    
    div.author {
      width: 20%;
      float: left;
    }
    
    div.content {
      margin-left: 2em;
      width: 30em;
      float: left;
      
      menu {
        margin-top: 0.5em;
      }
    }
  }
}

div#c-forum-topics {
  div.single-forum-post {
    width: 60em;
  }
  
  div#a-show {
  }
  
  span.info {
    color: #AAA;
  }
  
  tr.new-topic {
    font-weight: bold;
  }
  
  div#form-content {
    float: left;
    width: 450px;
    padding-right: 1em;
  }
  
  div#form-aside {
    float: left;
    width: 400px;
    
    div#preview > p {
      margin-top: 0.5em;
      padding-top: 0.5em;
      border-top: 1px solid #AAA;
    }
  }
}



/*** Wiki Pages ***/
div#c-wiki-pages {
  span.version {
    color: #AAA;
  }
  
  div#form-content {
    float: left;
    width: 30em;
    padding-right: 1em;
  }
  
  div#form-aside {
    float: left;
    width: 20em;
    
    div#preview > p {
      margin-top: 0.5em;
      padding-top: 0.5em;
      border-top: 1px solid #AAA;
    }
  }
  
  div#a-edit, div#a-new {
    div#preview {
    }
  }
}



/*** Post Moderation ***/
div#c-moderator-post-dashboards {
  article {
    margin-bottom: 4em;
    overflow: hidden;
  }
  
  aside {
    float: left;
    width: 520px;
  }
  
  section {
    float: left;
    width: 300px;
  }
}



/*** Note Container ***/
div#note-container {
  position: absolute;
  
  div.note-body {
    position: absolute;
    border: 1px solid black;
    background: white;
    min-width: 5em;
    min-height: 1em;
    cursor: pointer;
    padding: 4px;
    z-index: 1000;
    overflow: auto;
    
    p.tn {
      font-size: 0.8em;
      color: gray;
    }
  }
  
  div.note-box {
    position: absolute;
    border: 1px solid white;
    min-width: 20px;
    min-height: 20px;
    width: 100px;
    height: 100px;
    cursor: move;
    background: transparent;
    
    div.note-box-inner-border {
      border: 1px solid black;
      background: white;
    }
    
    div.note-box-inner-border.unsaved {
      border: 1px solid red;
    }
  }
}

div.note-edit-dialog {
  font-size: 0.8em;
}


/*** Site Map ***/
div#c-static {
  div#a-site-map {
    width: 80em;
    
    h1 {
      display: none;
    }
    
    section {
      width: 20em;
      float: left;
      
      h1 {
        display: block;
        font-size: $h3_size;
      }
      
      ul {
        margin-bottom: 1.5em;
      }
    }
  }
}



/*** moderator dashboard ***/
div#moderator-dashboard {
  div#comment-activity {
    width: 45%;
    float: left;
  }

  div#post-activity {
    width: 45%;
    float: left;
    margin-left: 2em;
  }

  div#ip-addr-search {
    margin-bottom: 2em;
  }

  div#activity-search {
    margin-bottom: 2em;
  }

  table {
    margin-bottom: 2em;
  }

  caption {
    font-weight: bold;
    font-size: 1.5em;
  }
}


/*** page footer ***/
footer#page-footer {
  clear: both;
  margin: 1em;
  text-align: center;
  padding-top: 1em;
  border-top: 1px solid #EEE;
}

/*** news ticker ***/

div#news-ticker {
  padding: 5px;
  background: #EEE;
  border-bottom: 2px solid #666;
  overflow: hidden;
  font-size: 0.8em;
  
  ul {
    float: left;
    margin: 0;
    padding: 0;
  }

  li {
    list-style-type: none;
    float: left;
    margin: 0 2em 0 0;
    padding: 0;
  }

  a#close-news-ticker-link {
    float: right;
  }
}


/*** post mode menus ***/
body#mode-view {
  background-color: "#FFF";
}

body#mode-edit {
  background-color: "#3A3";
}

body#mode-add-fav {
  background-color: "#FFA";
}

body#mode-remove-fav {
  background-color: "#FFA";
}
  
body#mode-rating-q {
  background-color: "#AAA";
}

body#mode-rating-s {
  background-color: "#6F6";
}

body#mode-rating-e {
  background-color: "#F66";
}

body#mode-vote-down {
  background-color: "#FAA";
}

body#mode-vote-up {
  background-color: "#AFA";
}

body#mode-lock-rating {
  background-color: "#AA3";
}

body#mode-lock-note {
  background-color: "#3AA";
}

body#mode-approve {
  background-color: "#26A";
}

body#mode-unapprove {
  background-color: "#F66";
}

body#mode-add-to-pool {
  background-color: "#26A";
}

body#mode-apply-tag-script {
  background-color: "#A3A";
}

body#mode-edit-tag-script {
  background-color: "#FFF";
}