* {
      font-family: 'Poppins', sans-serif;
  }

body{
    background-color: rgb(200,200,200);
}

  .center {
            margin: 255px auto;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 330px;
            flex-direction: column;
            border: 9px solid rgb(80, 200, 170);
            width: 350px;
            background-color: white;
            padding: 15px;
            border-radius: 20px;
        }

  .center > * {
            margin: 10px;
        }


  .reset{
    margin-left: 50px;
    cursor: pointer;
    font-size: 20px;
    background-color: white;
    border-radius: 7px;
    transition: color 0.3s ease 0s;
    transition: background-color 0.3s ease 0s;
}

.reset:hover{
    color: rgb(255, 60, 66);
    background-color: rgb(80, 200, 170);
}

h1{
  color: rgb(255, 60, 66);
}

.homepage{
    margin-top: 20px;
    margin-right: 30px;
    text-decoration: none;
    color: rgb(255, 60, 66);
}

.homepage:hover{
    color: red;
}

input{
    width: 250px;
}

ul.errorlist {
    color: #e53935;
    margin: 0 0 20px 15px;
    padding: 0;
    list-style: none;
}

ul.errorlist li {
    margin-bottom: 2px;
}

@media screen and (max-width: 968px) {

       h1{
            font-size: 26px;
       }

      .center {
            margin: 115px auto;
            display: flex;
            justify-content: center;
            align-items: center;
            height: 390px;
            flex-direction: column;
            border: 9px solid rgb(80, 200, 170);
            width: 290px;
            background-color: white;
            padding: 15px;
            border-radius: 20px;
        }


        .reset{
            color: black;
            border: 1px solid black;
            margin-left: 20px;
        }
      
      input{
	    width: 163px;
	}

	ul.errorlist {
        margin-left: 0;
    }

}