.container{
  width:470px;
  margin:100px auto;
 padding:20px 20px;
  border: 1px solid black;
  box-shadow: 8px 5px 3px;
  border-top:5px solid darkcyan;
  border-left: 5px solid darkcyan;
}

.anim{
  opacity: 0;
  transform: translateY(70px);
  animation: moveup 4s linear forwards;
}

@keyframes moveup{
  100%{
      opacity: 1;
      transform: translateY(0px);
  }
}

::placeholder{
  color:white;
}

input[type=text],input[type=password]{
  width:100%;
  padding:15px 15px;
  border:none;
  background-color: gray;
  border-radius: 5px;
  margin-bottom: 35px;
  border:3px solid gray;
  outline: none;
  border-left:10px solid darkcyan;
  box-shadow: 10px 10px;
}



input[type=text]:focus,input[type=password]:focus{
  border-bottom:3px solid darkcyan;
  background: none;
  border-top:none;
  border-left: none;
  border-right: none;
  border-left: 10px solid darkcyan;

}

button{

  width:100%;
  padding:15px 15px;
  border:none;
  background-color: darkcyan;
  border-radius: 5px;
  margin-bottom: 15px;
  color:white;
  font-weight: bolder;
  letter-spacing: 3px;


}

h1{
  text-align: center;
}

@media screen and (max-width:600px)
{
  .container{
      width:100%;
      border: none;
  }

}