.head {
    width: 100%;
    height: 150px;
    background-image: url("wheat.png");
    background-size: 100% 100%;
    background-position: 0%;
    position:fixed;
    left: 0px;
    top: 0px;
    z-index: 1;
    flex-wrap: wrap;
    line-height: 30px;
    border: 1px solid #b69200;
}
.a1 {
    position: relative;
    left:7px;
    top: 37px;
    width: 35px;
    height: 35px;
    border: 0cm;
    background-color: rgba(255, 255, 255, 0);
}
.a2 {
    position: relative;
    left: 75%;
}
body {
    opacity: 1;
    background-color : #D3B55f;
    position: absolute;
    top: 150px;
    left: 0px; 
}
.art{
    font-family:Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: 50px;
    text-decoration: none;
    letter-spacing: 30px;
    color: rgb(0, 255, 255);
    border: 10px;
    -webkit-text-stroke: 1px;
    -webkit-text-stroke-color: rgb(0, 0, 255);
    display: inline-block;
}
.art0 {
    position: relative;
    left: 10px;
    top: 30px;
    animation: anm1 1s ease-in-out infinite alternate;
}
.art1 {
    position: absolute;
    left: 31px;
    top: 30px;
    animation: anm1 1s ease-in-out infinite alternate;
    animation-delay: 1s;
}
.art2 {
    position: relative;
    left: 7px;
    top: 37px;
    }
.bt1 {
    opacity: 0.5;
    background-color: #888888;
    color: rgb(0, 0, 0);
    width: 32%;
    font-size: 20px;
    position: relative;
    left: 7px;
    top: 40px;
}
.pic1 {
    width: 50px;
    height: 50px;
    position: absolute;
}
@keyframes anm1 {
  from {
    transform: translateY(10px);
  }
  to {
    transform: translateY(-10px);
  }
}