/* Layout */

header div.container {
    background-image: url("../img/nature-forest.jpg");
}
/* Extra small devices (phones, 600px and down) */
@media (max-width: 600px) {
  header div.container {
      background-image: url("../img/nature-forest-mobile.jpg");
  }
}
@media (max-width: 370px) {
  header div.container {
      background-image: url("../img/nature-forest-mobile2.jpg");
  }
}

/* form start */
form.contact-form{
  display: grid;
  gap: 1.25rem;
}

.form-group{
  display: grid;
}

input[type=text], input[type=tel], input[type=email], textarea{
	border: 1px solid var(--color, rgb(26, 58, 20));
	border-radius: 7px;
  padding: 2px 10px;
  }

.form-group:has(input), .form-group:has(textarea){
	--color: var(--clr-input-valid);
}

.input-hint {
    margin: 0;
    font-size: 1rem;
    color: hsl(0 0% 70%);
}
  
  input::placeholder, textarea::placeholder {
	font-size: 1.1rem;
  }
  
  @media only screen and (min-width: 35em){
    .contact-form{
          grid-template-columns: 1fr 1fr;
    }
    
}
/* form end */