:root {
  --columnwrap: column;
  --columnwidth: 96%;
  --top-space: 9vh;
  --bottom-space: 50px;
  --padding-left: 1rem;
  --narrow-left: 1rem;
}
@media screen and (min-width: 641px) {
  :root {
    --columnwrap: row;
    --columnwidth: 96%;
    --bottom-space: 250px;
    --padding-left: 4rem;
    --narrow-left: 1px;
  }
}

.messagebar {
  padding-top: 8vh;
  text-align: center;
  color: black;
  font-size: var(--title-font);
}
.mytop {
  color: black;
  padding-left: var(--padding-left);
  padding-right: var(--padding-left);
}

.contact-box {
  color: black;
  display: flex;
  justify-content: space-between;
  flex-direction: var(--columnwrap);
  padding-bottom: 4rem;
  padding-left: var(--padding-left);
}

.contact-text {
  padding-left: var(--narrow-left);
  padding-right: var(--padding-left);
  padding-top: var(--top-space);
  width: var(--columnwidth);
}

.contact-heading {
  font-size: calc(1.5 * var(--title-font));
  font-weight: 500;
}

.contact-subhead {
  padding-top: 5vh;
  font-size: calc(1.17 * var(--min-text-size));
  font-weight: 500;
}

.contact-info {
  padding-top: 4vh;
  font-size: var(--min-text-size);
  font-weight: 200;
  line-height: var(--min-text-spacing);
}

.contact-entry {
  padding-right: 4rem;
  padding-left: var(--narrow-left);
  padding-top: calc(var(--top-space) + .5rem);
  width: var(--columnwidth);
}

.inobservatus {
  display: none;
  border: 0 !important;
  clip: rect(0 0 0 0) !important;
  height: 1px !important;
  margin: -1px !important;
  overflow: hidden !important;
  padding: 0 !important;
  position: absolute !important;
  width: 1px !important;
}

input[type=text], input[type=email], input[type=subject], textarea{
  width: 100%;
  padding: 12px;
  border: 1px solid #ccc;
  border-radius: 4px;
  box-sizing: border-box;
  resize: vertical;
  margin-top: .5rem;
  margin-bottom: .5rem;
  font-size: var(--min-text-size);
  font-weight: 200;
}

label {
  font-size: var(--min-text-size);
  font-weight: 200;
}

input[type=submit] {
  margin-bottom: var(--bottom-space);
  height: 70px;
  width: 150px;
  text-align:center;
  text-decoration: none;
  background-color: var(--background1);
  color: var(--foreground1);
  font-size: var(--min-text-size);
  cursor: pointer;
  border: 1px var(--background1) solid;
  margin-top: 1rem;
}

input[type=submit]:hover {
  background-color: var(--background2);
  color: var(--activeback);
  border: 1px var(--background2) solid;
}