*{
  box-sizing: border-box;
  padding: 0px;
  margin: 0px;
  font-family: sans-serif;

}

.logo{
  display: inline-block;
}

ul, li{
  display: inline-block;
}

.logo, ul, .search{
  float: left;
  font-weight: 500;
  transition: all 0.5s;
}

ul li{
  transition: all 0.5s;
}

.logo:hover, ul li:hover{
  transform: scale(1.01, 1.01);
  color: #c29178;
}

.icons img{
  float: left;
  width: 15px;
  height: 15px;
  margin-left: 25px;
  transition: all 1s;
  margin-top: 5px;
}
.icons img:hover{
  transform: scale(1.16, 1.16);
  background-color: #fcfbfb;
}

ul{
  margin-left: 25%;
}

li{
  margin-left: 35px;
}

.search{
  margin-left: 18%;
}
.search input{
  border: none;
  background-color: #f5f4f4;
  border-radius: 5px;
  padding: 5px;
}
nav{
  padding: 15px;
  border-bottom: 1px solid gray;
  width: 100%;
  position: fixed;
  background-color: white;
  z-index: 2222;
}

.cls{
  clear: both;
}


header{
  height: 80vh;
}

header img{
  margin-top:70px;
  width: 400px;
  height: 375px;
  float: left;
  transition: all 0.5s;
}

header img:hover{
  transform: scale(1.03, 1.03);
}

header .log-in{
  margin-top:130px;
  float: left;
  margin-left: 50px;
}

.log-in p{
  margin: 10px 0px;
  font-size: 14px;
  color: gray;
}


.log-in form input{
  width: 400px;
  border: none;
  margin: 10px 0px;
  padding: 15px;
  border-bottom: solid 2px #DDD;
}

.log-in form .button{
  width: 100px;
  color: white;
  margin: 10px 0px;
  padding: 15px;
  border-radius: 5px;
  background-color: #8c5f3c;
}

.log-in form .button:hover{
  background-color: #996b49;
}

.log-in span{
  display: inline-block;
  margin-left: 160px;
  margin-top: 30px;
  color: #8c5f3c;
}

.log-in span:hover{
  display: inline-block;
  margin-left: 160px;
  margin-top: 30px;
  color: #996b49;
}

footer{
  background-color: black;
  color: white;
  height: 30vh;
  padding: 10px;
}

footer div{
  font-size: 10px;
  font-weight: normal;
  float: left;
  width: calc(100% / 5);
}

footer h3{
  font-weight: normal;
  margin: 10px;
}

footer p{
  margin: 10px;
  transition: all 0.5s;
}

footer p:hover{
  color: lightgrey;
  transform: scale(1.03, 1.03);
}

footer input{
  margin: 0px 10px;
  background-color: black;
  color: gray;
  padding: 10px;
  border-radius: 5px;
  border: white 1px solid;
}


footer .code{
  margin: 10px;
}

footer .appstore{
  margin-bottom: 30px;
  animation: test 3s infinite ;
  animation-direction: alternate;
}

footer img {
  animation: test 3s infinite alternate;
}

@keyframes test {
  0% {
    transform: scale(1, 1);
  }
  50% {
    transform: scale(1.03, 1.03);
  }
  100% {
    transform: scale(1, 1);
  }
}