/* Syntax highlighting */

span.hl.str { color: #d14;}
span.hl.kwa { color: #099;}
span.hl.num { color: #099;}
span.hl.kwd { color: #333; font-weight: bold;}
span.hl.com { color: #888; font-style: italic;}

/* Tweaking */

h4 { margin-top: 1em; }

td.right { text-align: right;}

p.header { 
  margin-top: 10px;
  margin-bottom: 0px;
  font-size: 11px;
}

#levelsInput .form-group {
    margin: 2px;
}

#levelsInput .form-group label {
    display: none;
}

#levelsInput .form-control {
    width: 20em;
    padding: 4px 8px;
}

.vertical-align {
    vertical-align: middle;
}

pre code {
  margin-top: 10px;
  font-size: 12px;
}

/* Sortable items */

.sortable { 
    list-style-type: none; 
    margin: 0; 
    padding: 0; 
    width: 20em; 
}

/* Taken from bootstrap's "btn" style */
.sortable li { 
  display: block;
  width: 20em;
  padding: 4px 12px;
  margin-bottom: 5px;
  font-size: 14px;
  line-height: 20px;
  color: #333333;
  text-align: left;
  text-shadow: 0 1px 1px rgba(255, 255, 255, 0.75);
  vertical-align: middle;
  background-color: #fdfdfd;
  border: 1px solid #cccccc;
  border-color: #e6e6e6 #e6e6e6 #bfbfbf;
  border-color: rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.1) rgba(0, 0, 0, 0.25);
  border-bottom-color: #b3b3b3;
  -webkit-border-radius: 4px;
     -moz-border-radius: 4px;
          border-radius: 4px;
  -webkit-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
     -moz-box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
          box-shadow: inset 0 1px 0 rgba(255, 255, 255, 0.2), 0 1px 2px rgba(0, 0, 0, 0.05);
}

.sortable li.ui-state-highlight { 
    line-height: 20px;
    background-color: #FFD;
    border: 1px dotted #ED4;
}

.sortable li:hover {
    cursor: move;
}