body {
  text-align: center;
}
.what{
  text-align: center;
}

.top {
  padding: 30px;
  height: auto;
  background-color:#0084FF;
  align-items: center;
  font-weight: bold;
  font-size: 30px;
  font-family:-apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
  color: white;
  box-shadow: 0 1px 3px #999;
}

/* .hb {
  box-shadow: 0 1px 3px #999;
    margin: 10px;
    border: 10px solid white;
}*/

img{
    cursor: pointer;/*鼠标变成手指样式*/
    transition: all 0.6s;/*所有属性变化在0.6秒内执行动画*/
}

.hb img:hover{
  transform: scale(1.03);/*鼠标放上之后元素变成1.4倍大小*/
}

.photo img:hover{
  transform: scale(1.1);/*鼠标放上之后元素变成1.4倍大小*/
}

.hb img {
  box-shadow: 0 1px 3px #999;
  margin-bottom: 2%;
  /* padding-bottom: 10px; */
  width: 300px;
  /* width: 30%; */
  height: auto;
  /* border-radius: 10px; */
  border: 5px solid white;
}

.photo img {
  box-shadow: 0 1px 3px #999;
  margin-bottom: 2%;
  width: 300px;
  /* width: 30%; */
  height: auto;
  border: 5px solid white;
  /* padding-top: 10px;
  padding-bottom: 10px; */
}

.sort {
  background-color: #0084FF;
  text-align: center;
  display: inline-block;
  width: 100px;
  height: auto;
  border-radius: 10px;
  color: white;
  font-size: 150%;
  padding: 5px;
  font-weight: bold;
  font-family: -apple-system,BlinkMacSystemFont,Helvetica Neue,PingFang SC,Microsoft YaHei,Source Han Sans SC,Noto Sans CJK SC,WenQuanYi Micro Hei,sans-serif;
  border: 1px solid white;
  box-shadow: 0 1px 3px #999;
  margin-top: 25px;
  margin-bottom: 25px;
}