body, input, button {
  font-family: 'Roboto Condensed', sans-serif;
  font-size: 20px;
  text-align: center;
  background-position: center;
  margin-top:-100px;
}

button {
  background: #CCC;
  border: 1px solid rgba(0,0,0,.2);
  box-shadow: inset 0 1px 0 rgba(255,255,255,.7), 0 1px 2px rgba(0,0,0,.25);
  border-radius: 5px;
  padding: 10px 20px;
  margin: 15px 0 15px 10px;
}

button:hover {
  background: #DDD;
  cursor: pointer;
}

button:active {
  background: #BBB;
  box-shadow: inset 0 1px 2px rgba(0,0,0,.25);
}

header{
  font-size: 2em;
  margin: 10px 0 10px 0;
}

input {
  background: #F8F8F8;
  width: 50px;
  padding: 10px 20px;
  border-radius: 6px;
  border: 1px solid #C6C6C6;
}

.card{
    background-color: white;
    max-width: 60%;
    min-width: 300px;
    margin: auto;
    padding: 25px;
    margin-top: 25vh;
    border-radius: 10px;
    box-shadow: 5px 5px 10px black;

    background: #A7CFDF;
    background: -webkit-linear-gradient(top, #A7CFDF 0%, #23538A 100%);
    background:    -moz-linear-gradient(top, #A7CFDF 0%, #23538A 100%); 
    background:         linear-gradient(to bottom, #A7CFDF 0%, #23538A 100%);
}

.spacing{
  margin: 15px;
}

.temp-fields{
  display: inline-block;
}

.wrapper{
  max-width: 960px;
  margin: auto;
}


#article {
  text-align: left;
  padding: 5% 10% 0;
}