/** Shopify CDN: Minification failed

Line 179:0 Unexpected "@media"

**/
.contact img {
  max-width: 100%;
}

.contact .field::after, .select::after, .customer {
  border-color: black;
  border-top: none;
  border-right: none;
  border-left: none;
  box-shadow: none;
}

.contact .field select {
  padding-top: 16px;
  font-size: 1.3rem;
  color: #575757;
  text-transform: uppercase;
}

.contact .form__message {
  align-items: flex-start;
}

.contact .icon-success {
  margin-top: 0.2rem;
}

.contact .field {
  margin-bottom: 3.5rem;
}

.contact-container {
  display: grid;
  grid-template-columns: 1fr 1fr;
  height: 65.5rem;
}

.contact-container .contact-with-image {
  display: flex;
  flex-direction: column;
  justify-content: flex-end;
  padding-bottom: 5rem;
}

.lined {
  line-height: 4rem;   /* wide spacing — you can change this */
  font-size: 1.5rem;
  padding: 0;

  --line: var(--black);

  background:
    /* Line 1 */
    linear-gradient(to bottom,
      transparent 54px,
      var(--line) 54px,
      var(--line) 55px,
      transparent 55px
    ),
    /* Line 2 */
    linear-gradient(to bottom,
      transparent 120px,
      var(--line) 120px,
      var(--line) 121px,
      transparent 121px
    ),
    /* Line 3 */
    linear-gradient(to bottom,
      transparent 187px,
      var(--line) 187px,
      var(--line) 188px,
      transparent 188px
    ),
    /* Line 4 */
    linear-gradient(to bottom,
      transparent 254px,
      var(--line) 254px,
      var(--line) 255px,
      transparent 255px
    );
}

.contact .field__input:focus~.field__label,
.field__input:not(:placeholder-shown)~.field__label {
  /* top: calc(-1rem + var(--inputs-border-width)); */
  letter-spacing: 0;
}

.text-area.lined {
  min-height: 16rem;
  padding: 0;
}

.field input,
.field textarea {
  font-family: var(--moderat-serif);
  letter-spacing: 0;
}

.contact .field.textarea-field::after {
  border-bottom: none !important;
}

.contact-with-image,
.contact-image {
  width: 100%;
  max-width: 100%;
}

.contact-image {
  padding-top: 100%;
}

.contact-with-image {
  padding: 0 9%;
  background-color: #FBAB1C;
}

.contact-image {
  position: relative;
}

.contact-image img {
  position: absolute;
  top: 0;
  width: 100%;
  height: 100%;
  object-fit: cover;
  object-position: top left;
  
}

.contact .field__label {
  left: 0!important;
  font-size: 1rem;
  text-transform: uppercase;
}

.contact .field__input:focus ~ .field__label {
  font-size: 1rem;
  left: 0;
}

.contact__fields label.field__label,
.field label.field__label {
  font-family: var(--moderat-serif);
  font-size: 1rem;
  text-transform: capitalize;
  letter-spacing: 0;
}

.contact__fields .field__input,
.field .field__input {
  background-color: transparent;
}

.contact__fields .field__input {
  padding-left: 0;
  font-family: var(--moderat-serif);
}

.contact__fields .field__input:focus,
.field .field__input:focus,
.contact__fields .field__input:focus-within,
.field .field__input:focus-within,
.contact__fields .field__input:hover,
.field .field__input:hover,
.contact__fields .field:hover {
  box-shadow: none;
}

.contact__fields .field

@media screen and (min-width: 750px) {
  .contact-with-image,
  .contact-image {
    width: 50%;
    max-width: 50%;
  }

  .contact .field {
    margin-bottom: 1.5rem;
  }

  .contact .field__input:focus ~ .field__label {
    top: -40px;
  }

  .contact-image {
    padding-top: 0;
  }
  
  .contact .field__label {
    top: -40px!important;
    font-size: 1.3rem !important;
  }
  
  .contact .field {
    margin-bottom: 2rem;
  }
}

.contact__button {
  margin-top: 3rem;
}

.contact__button button[type="submit"] {
  background-color: var(--black);
  font-family: var(--pressura);
  font-weight: 500;
  text-transform: uppercase; 
  padding: 10px 70px;
  color: var(--white);
  width: 22.5rem;
  display: flex;
  justify-content: center;
  align-items: center;
}

.find-us-on p:first-of-type {
  display: flex;
  align-items: center;
}

.find-us-on {
  font-family: var(--moderat-serif);
  font-size: 1.375rem;
  font-weight: 400;
  line-height: 1.75;
  margin-top: 2rem;
}

.sellar-logo {
  width: 5.75rem;
  height: 1.5rem;
  object-fit: contain;
}

@media screen and (min-width: 750px) {
  .contact__button {
    margin-top: 0;
  }

  .contact__fields {
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    grid-column-gap: 2rem;
    margin: 0.625rem 0;
  }
}

@media screen and (min-width: 1101px) and (max-width: 1600px) {
  .contact .field__input:focus ~ .field__label,
  .field__input:not(:placeholder-shown) ~ .field__label,
  .field__label {
    top: calc(0rem + var(--inputs-border-width));
  }

  .textarea-field .field__label,
  .contact .textarea-field .field__input:focus ~ .field__label {
    top: calc(-1rem + var(--inputs-border-width));
  }

  .contact-container {
    height: 85vh;
  }

  .contact-container .contact-with-image {
    padding-bottom: 3rem;
    padding-top: 3rem;
  }

  .find-us-on {
    line-height: 1.2;
  }
}

@media screen and (min-width: 679px) and (max-width: 1100px) {
  .find-us-on {
    line-height: 1.25;
    margin-top: 3rem;
  }

  .contact-container .contact-with-image {
    padding-top: 5rem;
  }
  
  .contact-container {
    grid-template-columns: 1fr;
    height: auto;
  }

  .contact-image {
    padding: 0;
    height: 40vh;
  }

  .contact-image img {
    object-position: center;
  }
}

@media screen and (max-width: 678px) {
  .contact__button {
    margin-top: 2rem;
  }

  .contact__button button[type="submit"] {
    width: 18.375rem;
    height: 3rem;
    padding: 0;
    min-height: unset;
    font-size: 1rem;
    margin: 0 auto;
  }

  .contact-container {
    grid-template-columns: 1fr;
    height: auto;
  }

  .contact-container .contact-image {
    display: none;
  }

  .contact__fields .field__label {
    bottom: 2rem;
    top: unset !important;
    transition: 0.15s ease all;
  }

  .contact-container .contact-with-image {
    justify-content: flex-start;
    padding: 1.5rem 6% 3rem 6%;
  }

  .contact .field {
    margin-bottom: 0;
  }

  .contact .field::after {
    border-bottom: 0.5px solid var(--black);
  }

  .text-area.lined {
    height: 14.5rem;
  }

  .lined {
    line-height: 2.5rem;
    --line: var(--black);

    background:
/* Line 1 */
      linear-gradient(to bottom,
        transparent 34px,
        var(--line) 34px,
        var(--line) 34.5px,
        transparent 34.5px
      ),
      /* Line 2 */
      linear-gradient(to bottom,
        transparent 70px,
        var(--line) 70px,
        var(--line) 70.5px,
        transparent 70.5px
      ),
      /* Line 3 */
      linear-gradient(to bottom,
        transparent 106px,
        var(--line) 106px,
        var(--line) 106.5px,
        transparent 106.5px
      ),
      /* Line 4 */
      linear-gradient(to bottom,
        transparent 142px,
        var(--line) 142px,
        var(--line) 142.5px,
        transparent 142.5px
      )
  }

  .contact img {
    width: 4.6rem;
    height: 1.2rem;
  }

  .find-us-on {
    font-size: 1rem;
    line-height: 1.5;
    margin-top: 3rem;
  }

  .lined {
    font-size: 1rem;
  }

  .text-area.lined {
    min-height: unset;
    height: 9rem;
    margin-top: 0.5rem;
  }
}
