body{
  background-color: #fdd;
}
h1{
  background-color:white;
}

input,select{
  font-size:1.8em;
}

.clearfix:after {
    content:"";
    display:block;
    clear:both;
}
.query{
  width: 90%;
}

.control{
  margin:0em;
}
.bottom-control{
  text-align:center;
  margin:1em;
}
.bottom-control button{
  font-size:1.8em;
}

.footer{
  padding:2em;
  background-color:#933;
  color:white;
}
.footer a{
  color:white;
}

.recommend{
  border:solid 1px black;
  padding:5px;
  margin:5px;
  background-color:#fe9;
  float:left;
}

.piece{
  float:left;
  border:solid #d00 1px;
  margin:2px;
  width:min(120px,31%);
  font-size:1em;
}
.piece .price{
  background-color: #d00;
  color:white;
  text-align:center;
}
.piece div.img{
  background-color: #ccc;
  background-position: center center;
  background-repeat: no-repeat;
  margin: 0px;
  width: 100%;
  height: 120px;
  background-size: cover;
}

@keyframes spinner {
  to {transform: rotate(360deg);}
}

.spinner:before {
  content: '';
  box-sizing: border-box;
  position: absolute;
  top: 50%;
  left: 50%;
  width: 20px;
  height: 20px;
  margin-top: -10px;
  margin-left: -10px;
  border-radius: 50%;
  border: 2px solid #ccc;
  border-top-color: #000;
  animation: spinner .6s linear infinite;
}