html {
  background: #efefef;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  font-size: 13px;
}

body {
  padding: 0 10px;
  margin: 10px auto 0;
}

.header {
  background: #ededed;
  background: -webkit-gradient(linear, left top, left bottom,
                color-stop(0%,#576a76),
                color-stop(100%,#4d5256));
  background: -moz-linear-gradient(top, #576076 0%, #414e58 100%);
  background: -webkit-linear-gradient(top, #576a76 0%, #414e58 100%);
  background: -o-linear-gradient(top, #576a76 0%, #414e58 100%);
  background: -ms-linear-gradient(top, #576a76 0%, #414e58 100%);
  background: linear-gradient(top, #576a76 0%, #414e58 100%);
  border-bottom: 1px solid #fff;
  -moz-border-radius-topleft:     5px;
  -webkit-border-top-left-radius: 5px;
  border-top-left-radius:         5px;
  -moz-border-radius-topright:    5px;
  -webkit-border-top-right-radius:5px;
  border-top-right-radius:        5px;

  overflow:hidden;
  padding: 10px 5%;
  text-shadow:0 1px 0 #000;
}

.header h1 {
  color: #eee;
  float:left;
  font-size:1.2em;
  font-weight:normal;
  margin:2px 30px 0 0;
}

.header ul li {
  display: inline;
}

.header ul li a {
  color: #eee;
  text-decoration: none;
  margin-right: 10px;
  display: inline-block;
  padding: 4px 8px;
  -moz-border-radius:   10px;
  -webkit-border-radius:10px;
  border-radius:        10px;

}

.header ul li a:hover {
  background: rgba(255,255,255,0.1);
}

.header ul li a:active {
  -moz-box-shadow:   inset 0 1px 0 rgba(0,0,0,0.2);
  -webkit-box-shadow:inset 0 1px 0 rgba(0,0,0,0.2);
  box-shadow:        inset 0 1px 0 rgba(0,0,0,0.2);
}

.header ul li.current a {
  background: rgba(255,255,255,0.1);
  -moz-box-shadow:   inset 0 1px 0 rgba(0,0,0,0.2);
  -webkit-box-shadow:inset 0 1px 0 rgba(0,0,0,0.2);
  box-shadow:        inset 0 1px 0 rgba(0,0,0,0.2);
  color: #fff;
}

.header p.environment {
  clear: both;
  padding: 10px 0 0 0;
  color: #BBB;
  font-style: italic;
  float: right;
}

#main {
  padding: 10px 5%;
  background: #f9f9f9;
  border:1px solid #ccc;
  border-top:none;
  -moz-box-shadow:   0 3px 10px rgba(0,0,0,0.2);
  -webkit-box-shadow:0 3px 10px rgba(0,0,0,0.2);
  box-shadow:        0 3px 10px rgba(0,0,0,0.2);
  overflow: hidden;
}

#main .logo {
  float: right;
  margin: 10px;
}

#main span.hl {
  background: #efefef;
  padding: 2px;
}

#main h1 {
  margin: 10px 0;
  font-size: 190%;
  font-weight: bold;
  color: #0080FF;
}

#main table {
  width: 100%;
  margin:0 0 10px;
}

#main table tr td, #main table tr th {
  border-bottom: 1px solid #ccc;
  padding: 6px;
}

#main table tr th {
  background: #efefef;
  color: #888;
  font-size: 80%;
  text-transform:uppercase;
}

#main table tr td.no-data {
  text-align: center;
  padding: 40px 0;
  color: #999;
  font-style: italic;
  font-size: 130%;
}

#main a {
  color: #111;
}

#main p {
  margin: 5px 0;
}

#main p.intro {
  margin-bottom: 15px;
  font-size: 85%;
  color: #999;
  margin-top: 0;
  line-height: 1.3;
}

#main h1.wi {
  margin-bottom: 5px;
}

#main p.sub {
  font-size: 95%;
  color: #999;
}

.experiment {
  background:#fff;
  border: 1px solid #eee;
  border-bottom:none;
  margin:30px 0;
}

.experiment_with_goal {
  margin: -32px 0 30px 0;
}

.experiment .experiment-header {
  background: #f4f4f4;
  background: -webkit-gradient(linear, left top, left bottom,
                color-stop(0%,#f4f4f4),
                color-stop(100%,#e0e0e0));
  background: -moz-linear-gradient   (top, #f4f4f4 0%, #e0e0e0 100%);
  background: -webkit-linear-gradient(top, #f4f4f4 0%, #e0e0e0 100%);
  background: -o-linear-gradient     (top, #f4f4f4 0%, #e0e0e0 100%);
  background: -ms-linear-gradient    (top, #f4f4f4 0%, #e0e0e0 100%);
  background: linear-gradient        (top, #f4f4f4 0%, #e0e0e0 100%);
  border-top:1px solid #fff;
  overflow:hidden;
  padding:0 10px;
}

.experiment h2 {
  color:#888;
  margin: 12px 0 12px 0;
  font-size: 1em;
  font-weight:bold;
  float:left;
  text-shadow:0 1px 0 rgba(255,255,255,0.8);
}

.experiment h2 .goal {
  font-style: italic;
}

.experiment h2 .version {
  font-style:italic;
  font-size:0.8em;
  color:#bbb;
  font-weight:normal;
}

.experiment table em{
  font-style:italic;
  font-size:0.9em;
  color:#bbb;
}

.experiment table .totals td {
  background: #eee;
  font-weight: bold;
}

#footer {
  padding: 10px 5%;
  color: #999;
  font-size: 85%;
  line-height: 1.5;
  padding-top: 10px;
}

#footer p a {
  color: #999;
}

.inline-controls {
  float:right;
}

.inline-controls small {
  color: #888;
  font-size: 11px;
}

.inline-controls form {
  display: inline-block;
  font-size: 10px;
  line-height: 38px;
}

.inline-controls input {
  margin-left: 10px;
}

.worse, .better {
  color: #773F3F;
  font-size: 10px;
  font-weight:bold;
}

.better {
  color: #408C48;
}

a.button, button, input[type="submit"] {
  padding: 4px 10px;
  overflow: hidden;
  background: #d8dae0;
  -moz-box-shadow:   0 1px 0 rgba(0,0,0,0.5);
  -webkit-box-shadow:0 1px 0 rgba(0,0,0,0.5);
  box-shadow:        0 1px 0 rgba(0,0,0,0.5);
  border:none;
  -moz-border-radius:   30px;
  -webkit-border-radius:30px;
  border-radius:        30px;
  color:#2e3035;
  cursor: pointer;
  font-family: 'Helvetica Neue', Helvetica, Arial, sans-serif;
  text-decoration: none;
  text-shadow:0 1px 0 rgba(255,255,255,0.8);
  -moz-user-select:   none;
  -webkit-user-select:none;
  user-select:        none;
  white-space: nowrap;
}
a.button:hover, button:hover, input[type="submit"]:hover,
a.button:focus, button:focus, input[type="submit"]:focus{
  background:#bbbfc7;
}
a.button:active, button:active, input[type="submit"]:active{
  -moz-box-shadow:   inset 0 0 4px #484d57;
  -webkit-box-shadow:inset 0 0 4px #484d57;
  box-shadow:        inset 0 0 4px #484d57;
  position:relative;
  top:1px;
}

a.button.red,   button.red,   input[type="submit"].red,
a.button.green, button.green, input[type="submit"].green {
  color:#fff;
  text-shadow:0 1px 0 rgba(0,0,0,0.4);
}

a.button.red, button.red, input[type="submit"].red {
  background:#a56d6d;
}
a.button.red:hover, button.red:hover, input[type="submit"].red:hover,
a.button.red:focus, button.red:focus, input[type="submit"].red:focus {
  background:#895C5C;
}
a.button.green, button.green, input[type="submit"].green {
  background:#8daa92;
}
a.button.green:hover, button.green:hover, input[type="submit"].green:hover,
a.button.green:focus, button.green:focus, input[type="submit"].green:focus {
  background:#768E7A;
}

#filter, #clear-filter {
  padding: 10px;
}


.pagination {
  text-align: center;
  font-size: 15px;
}

.pagination a, .paginaton span {
  display: inline-block;
  padding: 5px;
}