@import url('https://fonts.googleapis.com/css?family=Montserrat:300');

body {
background-image:url("https://as1.ftcdn.net/v2/jpg/02/53/91/26/1000_F_253912686_qJJaXiD7DebyBj6Gzb9SKRqTnhTr476k.jpg");
background-size: cover;
  box-sizing: border-box;
  
  height: 100vh;
  overflow: hidden;
  display: flex;
  justify-content: center;
  align-items: center;
  margin: 0;
  font-family: 'Montserrat', sans-serif;
}

.wrapper {
  height: 620px;
  width: 460px;
  background-color: white;
  border-radius: 24px;
  overflow: hidden;
}

.header {
  width: 100%;
  height: 32%;
  background-image: url(https://images.unsplash.com/photo-1506305269769-53a5714a93be?ixlib=rb-1.2.1&auto=format&fit=crop&w=645&q=80);
  background-size: cover;
  background-position: center;
  color: white;
  text-align: center;
}

h1 {
  margin: 0;
  padding: 34px 24px 12px;
  font-weight: 300;
  font-size: 60px;
}

p {
  margin: 0;
  padding: 0 24px;
  font-size: 16px;
  width: 360px;
  opacity: 0.8;
  margin: 0 auto;
}

form {
  display: flex;
  flex-direction: column;
  margin: 8px auto;
  width: 76%;
}

h4 {
  color: #666;
  margin: 16px 0 6px;
  font-size: 16px;
  letter-spacing: 1px;
  
}

input,
textarea {
  border: solid 1px #cbcbcb; 
  border-radius: 6px;
  width: 92%;
  padding: 6px 12px;
  outline: none;
  margin: 4px auto;
}

input {
  height: 28px;
}

textarea {
  height: 62px;
}

button {
  height: 42px;
  width: 60%;
  margin: 24px auto;
  border-radius: 6px;
  border: none;
  color: white;
  background: linear-gradient(to left bottom, #000046, #5B86E5);
  cursor: pointer;
}