@import url('eggplant/jquery-ui-1.8.10.custom.css');

body {
  font-family: "HelveticaNeue", Helvetica, Arial, sans-serif;
  color: #080603;
}
a {
  text-decoration: none;
  color: #68962c;
}
pre {
  padding: 4px 7px;
  background-color: #fafafa;
  border: 1px solid #f0f0f0;
  font-family: Courier;
  font-size: 14px;
  line-height: 23px;
}
pre.wrap {
  white-space: normal;
}

.clear { clear: both; }

.container {
  width: 500px;
  margin: 0 auto;
}
.header {
  border-bottom: 1px solid #ddd;
}
.header a {
  display: inline-block;
  padding: 4px 10px;
  background-color: #eee;
}

.flash {
  padding: 10px 0;
  border-bottom: 1px solid #ddd;
}
.flash.notice {
  color: #68962c;
}
.flash.error {
  color: #c00e0e;
}


.option {
  margin: 1em 0 1em 0;
  padding-bottom: 1em;
  border-bottom: 1px solid #eee;
}

button[type=submit] {
  width: 100%;
  padding: 13px;
  text-align: center;
  cursor: pointer;
}

#red, #green, #blue {
  float: left;
  clear: left;
  width: 300px;
  margin-bottom: 10px;
}
#swatch {
  width: 120px;
  height: 100px;
  margin-top: 18px;
  margin-left: 350px;
  background-image: none;
}
#red   .ui-slider-range { background: #dd0000; }
#red   .ui-state-default { border-color: #aa0000; background: #dd0000; }

#green .ui-slider-range { background: #00dd00; }
#green .ui-state-default { border-color: #00aa00; background: #00dd00; }

#blue  .ui-slider-range { background: #0000dd; }
#blue  .ui-state-default { border-color: #0000aa; background: #0000dd; }
