html {
  padding: 1em;
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #dddddd), color-stop(100%, #ffffff)) no-repeat;
  background: -webkit-linear-gradient(#dddddd, #ffffff) no-repeat;
  background: -moz-linear-gradient(#dddddd, #ffffff) no-repeat;
  background: -o-linear-gradient(#dddddd, #ffffff) no-repeat;
  background: -ms-linear-gradient(#dddddd, #ffffff) no-repeat;
  background: linear-gradient(#dddddd, #ffffff) no-repeat;
}

h1 {
  font-size: 2em;
  margin-bottom: 1em;
}

h2 {
  font-size: 1.4em;
  margin-bottom: .6em;
}

.doc {
  background: #fff;
  border: #ddd;
  padding: 1em;
  color: #aaa;
  margin: 1em;
  font-style: italic;
}
.doc a {
  color: #999;
}

form {
  padding: 2em;
  background: #fff;
  -moz-border-radius: 1em;
  -webkit-border-radius: 1em;
  -o-border-radius: 1em;
  -ms-border-radius: 1em;
  -khtml-border-radius: 1em;
  border-radius: 1em;
  -moz-box-shadow: 0 0.2em 0.4em rgba(0, 0, 0, 0.4);
  -webkit-box-shadow: 0 0.2em 0.4em rgba(0, 0, 0, 0.4);
  -o-box-shadow: 0 0.2em 0.4em rgba(0, 0, 0, 0.4);
  box-shadow: 0 0.2em 0.4em rgba(0, 0, 0, 0.4);
}

.form-element {
  display: block;
  margin: 2em 0;
}

label {
  cursor: pointer;
  color: #666666;
}

input,
select,
textarea {
  padding: .4em;
  border: 1px solid #3399e9;
  border-top-color: #45a2eb;
  border-bottom-color: #2190e7;
  -moz-border-radius: 0.4em;
  -webkit-border-radius: 0.4em;
  -o-border-radius: 0.4em;
  -ms-border-radius: 0.4em;
  -khtml-border-radius: 0.4em;
  border-radius: 0.4em;
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #ffffff), color-stop(1%, #e6e6e6), color-stop(30%, #ffffff));
  background: -webkit-linear-gradient(#ffffff, #e6e6e6 1%, #ffffff 30%);
  background: -moz-linear-gradient(#ffffff, #e6e6e6 1%, #ffffff 30%);
  background: -o-linear-gradient(#ffffff, #e6e6e6 1%, #ffffff 30%);
  background: -ms-linear-gradient(#ffffff, #e6e6e6 1%, #ffffff 30%);
  background: linear-gradient(#ffffff, #e6e6e6 1%, #ffffff 30%);
  -moz-box-shadow: rgba(0, 0, 0, 0.1) 0 0 0.4em;
  -webkit-box-shadow: rgba(0, 0, 0, 0.1) 0 0 0.4em;
  -o-box-shadow: rgba(0, 0, 0, 0.1) 0 0 0.4em;
  box-shadow: rgba(0, 0, 0, 0.1) 0 0 0.4em;
  -moz-transition: -moz- box-shadow linear 0.2s, border linear 0.2s;
  -webkit-transition: -webkit- box-shadow linear 0.2s, border linear 0.2s;
  transition: box-shadow linear 0.2s, border linear 0.2s;
}
input:hover, label:hover + input,
select:hover, label:hover +
select,
textarea:hover, label:hover +
textarea {
  -moz-box-shadow: 0 0 0.8em rgba(51, 153, 233, 0.4);
  -webkit-box-shadow: 0 0 0.8em rgba(51, 153, 233, 0.4);
  -o-box-shadow: 0 0 0.8em rgba(51, 153, 233, 0.4);
  box-shadow: 0 0 0.8em rgba(51, 153, 233, 0.4);
}
input:focus,
select:focus,
textarea:focus {
  outline: none;
  border-color: #3399e9;
  -moz-box-shadow: 0 0 0.4em rgba(51, 153, 233, 0.65);
  -webkit-box-shadow: 0 0 0.4em rgba(51, 153, 233, 0.65);
  -o-box-shadow: 0 0 0.4em rgba(51, 153, 233, 0.65);
  box-shadow: 0 0 0.4em rgba(51, 153, 233, 0.65);
}

button,
.button {
  cursor: pointer;
  display: inline-block;
  width: auto;
  color: white;
  padding: .6em 1em;
  text-shadow: 0 1px 0 rgba(0, 0, 0, 0.4);
  border: 1px solid #1c8de7;
  border-top-color: #1780d2;
  border-bottom-color: #61b0ee;
  background: #3399e9;
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #61b0ee), color-stop(100%, #1780d2));
  background: -webkit-linear-gradient(#61b0ee, #1780d2);
  background: -moz-linear-gradient(#61b0ee, #1780d2);
  background: -o-linear-gradient(#61b0ee, #1780d2);
  background: -ms-linear-gradient(#61b0ee, #1780d2);
  background: linear-gradient(#61b0ee, #1780d2);
  -moz-border-radius: 0.6em;
  -webkit-border-radius: 0.6em;
  -o-border-radius: 0.6em;
  -ms-border-radius: 0.6em;
  -khtml-border-radius: 0.6em;
  border-radius: 0.6em;
  -moz-box-shadow: rgba(0, 0, 0, 0.4) 0 0.1em 0.2em;
  -webkit-box-shadow: rgba(0, 0, 0, 0.4) 0 0.1em 0.2em;
  -o-box-shadow: rgba(0, 0, 0, 0.4) 0 0.1em 0.2em;
  box-shadow: rgba(0, 0, 0, 0.4) 0 0.1em 0.2em;
}
button:focus, button:hover,
.button:focus,
.button:hover {
  text-decoration: none;
  background: #1c8de7;
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #6ab5ef), color-stop(100%, #167ac9));
  background: -webkit-linear-gradient(#6ab5ef, #167ac9);
  background: -moz-linear-gradient(#6ab5ef, #167ac9);
  background: -o-linear-gradient(#6ab5ef, #167ac9);
  background: -ms-linear-gradient(#6ab5ef, #167ac9);
  background: linear-gradient(#6ab5ef, #167ac9);
}
button:active,
.button:active {
  text-decoration: none;
  background: #1885dc;
  background: -webkit-gradient(linear, 50% 0%, 50% 100%, color-stop(0%, #167ac9), color-stop(100%, #6ab5ef));
  background: -webkit-linear-gradient(#167ac9, #6ab5ef);
  background: -moz-linear-gradient(#167ac9, #6ab5ef);
  background: -o-linear-gradient(#167ac9, #6ab5ef);
  background: -ms-linear-gradient(#167ac9, #6ab5ef);
  background: linear-gradient(#167ac9, #6ab5ef);
}