:root {
  --osteen-color-white: #ffffff;
  --osteen-color-black: #000000;
  --osteen-color-red: #ff0000;
  --osteen-color-gray: #888888;

  --osteen-color-default: #f5f5f5;
  --osteen-color-default-hover: #cfcfcf;
  --osteen-color-genesis: #141414;
  --osteen-color-genesis-hover: #141414;
  --osteen-color-toyota: #d71921;
  --osteen-color-toyota-hover: #921116;
  --osteen-color-buick: #f26518;
  --osteen-color-buick-hover: #b3460a;
  --osteen-color-mini: #000000;
  --osteen-color-mini-hover: #000000;
  --osteen-color-honda: #2086c1;
  --osteen-color-honda-hover: #15587f;
  --osteen-color-ford: #2d96cd;
  --osteen-color-ford-hover: #1f688e;
  --osteen-color-subaru: #20609f;
  --osteen-color-subaru-hover: #133a5f;
  --osteen-color-hyundai: #002d73;
  --osteen-color-hyundai-hover: #000f27;
  --osteen-color-lexus: #1a1a1a;
  --osteen-color-lexus-hover: #000;
  --osteen-color-chevy: #f1b923;
  --osteen-color-chevy-hover: #bc8c0c;
  --osteen-color-kia: #c4172c;
  --osteen-color-kia-hover: #800f1d;
  --osteen-color-gmc: #bc0a0f;
  --osteen-color-gmc-hover: #730609;
  --osteen-color-volvo: #003057;
  --osteen-color-volvo-hover: #00060b;
  --osteen-color-infiniti: #201d26;
  --osteen-color-infiniti-hover: #000;
  --osteen-color-nissan: #c3002f;
  --osteen-color-nissan-hover: #77001d;
  --osteen-color-vw: #00b1eb;
  --osteen-color-vw-hover: #00779f;
  --osteen-color-mitsubishi: #f02;
  --osteen-color-mitsubishi-hover: #b30018;
  --osteen-color-mazda: #222;
  --osteen-color-mazda-hover: #000;
  --osteen-color-maserati: #0b2749;
  --osteen-color-maserati-hover: #000;
  --osteen-color-mb: #222;
  --osteen-color-mb-hover: #000;
  --osteen-color-lincoln: #231f1f;
  --osteen-color-lincoln-hover: #000;
  --osteen-color-bmw: #1c69d4;
  --osteen-color-bmw-hover: #134890;
  --osteen-color-cadillac: #9e1834;
  --osteen-color-cadillac-hover: #800f1d;
  --osteen-color-audi: #cd1f35;
  --osteen-color-audi-hover: #8b1524;
  --osteen-color-acura: #e82c2a;
  --osteen-color-acura-hover: #b21513;
}

#osteen-gm {
  font-family: Arial, Helvetica, sans-serif;
  margin: 20px auto;
  padding: 2rem;
  max-width: 90rem;
  display: grid;
  grid-template-columns: repeat(2, minmax(0, 1fr));
  align-items: center;
  gap: 2rem;
}

#osteen-gm-copy {
}

#osteen-gm-copy h1 {
  font-size: 3rem;
}

#osteen-gm-copy p {
  font-size: 1.125rem;
  line-height: 1.5rem;
}

#osteen-gm-media {
  display: flex;
  justify-content: start;
}

#osteen-gm-media img {
  max-width: 80%;
}

#osteen-gm-form {
  grid-column: span 2 / span 2;
  display: flex;
  flex-direction: column;
  gap: 1rem;
}

#osteen-gm-form .osteen-gm-form-group {
  display: flex;
  flex-direction: column;
  gap: 0.5rem;
}

#osteen-gm-form .osteen-gm-form-group label {
  color: var(--osteen-color-gray);
}

#osteen-gm-form .osteen-gm-form-group label.osteen-gm-form-required::after {
  content: "*";
  color: var(--osteen-color-red);
}

#osteen-gm-form .osteen-gm-form-group input,
#osteen-gm-form .osteen-gm-form-group textarea,
#osteen-gm-form .osteen-gm-form-group select {
  border: 1px solid var(--osteen-color-gray);
  padding: 0.5rem;
  margin-bottom: 1rem;
  max-width: 100%;
}

#osteen-gm-form .osteen-gm-form-group textarea {
  min-height: 10rem;
}

#osteen-gm-form #osteen-gm-submit {
  font-weight: 700;
  background-color: var(--osteen-color-black);
  color: var(--osteen-color-white);
  border: transparent;
  padding: 1rem 1rem;
  cursor: pointer;
  font-size: 1.125rem;
  transition-duration: 300ms;
  transition-property: background-color;
  transition-timing-function: ease-in-out;
}

#osteen-gm-form #osteen-gm-submit:hover {
  background-color: var(--osteen-color-gray);
}

#osteen-gm-form-message {
  font-size: 0.625rem;
  color: var(--osteen-color-red);
}

@media screen and (max-width: 600px) {
  #osteen-gm {
    grid-template-columns: repeat(1, minmax(0, 1fr));
  }

  #osteen-gm-copy {
    order: 2;
  }

  #osteen-gm-copy h1 {
    font-size: 4rem;
  }

  #osteen-gm-copy p {
    font-size: 1.75rem;
    line-height: 2.5rem;
  }

  #osteen-gm-media {
    order: 1;
    justify-content: center;
  }

  #osteen-gm-form {
    grid-column: span 1 / span 1;
    order: 3;
  }

  #osteen-gm-media img {
    max-width: 100%;
  }
}

/* oscd, ossv, osvv, */

/* osvj, osvo */
