.main-content {
  margin-block-start: 2rem;
}

.section-container {
  border:5px solid var(--primary-background);
  border-radius:50px;
  margin-block-end: 6rem;
  background-color: white;
}

.image-container {
  height: 35rem;
  padding: 0;
  margin: 0;
}

.form-container {
  padding: 2rem;
}

.form-container > form {
  padding: 0;
}

.image-container > img{
  height: 100%;
  width: 100%;
  object-fit: cover;
  border-top-left-radius: 45px;
  border-top-right-radius: 45px;
  max-height: 870px;
}


.form-content {
  background-color: var(--primary-background);
  color: var(--primary-text);
  width: 40rem;
  height: 40rem;
  border-radius: 50px;
  padding: 50px;
}

.form-control, .form-select {
border-width: 2px;
}

.form-control:focus {
  border-color: var(--bs-navbar-active-color);
  box-shadow: 0.5px 0.5px 2px var(--bs-navbar-active-color);
}

.form-select:focus, .form-select:focus-visible  {
  border-color: black;
  box-shadow: 0.5px 0.5px 2px black;
}

.button-container {
  margin-top: 120px;
}

.btn-primary {
  background-color: var(--primary-text);
  border-color: var(--primary-text);
  color: var(--secondary-background);
  
}

.btn-primary:hover {
  background-color: black;
  border-color: black;
}

.btn-primary:active {
  background-color: rgba(0, 0, 0, 0.9) !important;
  border-color: rgba(0, 0, 0, 0.9) !important;
  box-shadow: none;
}

.btn-primary:focus-visible {
  background-color: rgba(0, 0, 0, 0.9);
  border-color: rgba(0, 0, 0, 0.9);
  box-shadow: 0 0 0 0.25rem rgba(0, 0, 0, 0.349);

}


@media (min-width: 768px) {
  .image-container {
  height: unset;
  }

  .image-container > img{
    border-top-right-radius: unset;
    border-bottom-left-radius: 45px;
  }
}