@media screen and (max-width: 1000px) {
/* Full-width input fields */

  input[type=text], input[type=password] {
    width: 100%;
    padding: 12px 20px;
    margin: 8px 0;
    display: inline-block;
    border: 1px solid #ccc;
    box-sizing: border-box;
    font-size: 26px;
  }
}

@media screen and (min-width: 1000px) {
    input[type=text], input[type=password] {
        width: 97%;
    padding: 2%;
    border: 1px solid #ccc;
    border-radius: 4px;
    resize: vertical;
  }
}

/* Set a style for all buttons */
button {
  background-color: #046daa;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 20%;
    border-radius: 6px;

}

@media screen and (max-width: 1000px) {
  button {
  background-color: #046daa;
    color: white;
    padding: 14px 20px;
    margin: 8px 0;
    border: none;
    cursor: pointer;
    width: 100%;
    border-radius: 6px;

}
}

button:hover {
  opacity: 0.8;
}

/* Extra styles for the cancel button */
.cancelbtn {
  width: auto;
  padding: 10px 18px;
  background-color: #f44336;
}

/* Center the image and position the close button */
.imgcontainer {
  text-align: center;
  margin: 24px 0 12px 0;
  position: relative;
}

img.avatar {
  width: 40%;
  border-radius: 50%;
}