/**
 * Contact us.
 */

// Reusable LESS items.
@import '../../reusable.less';

.navbar {
  @media @desktop {
    margin-bottom: 0;
  }
}

.main-container {
  color: @medium-text-color;
}

.webform-component--ConsenttoProcessing {
  width: 100%;
  height: auto;
  text-align: left;
  .form-type-checkbox {
    height: auto;
    margin-bottom: 10px;
    min-height: auto;
  }
  @media @desktop-tablet {
    div.error {
      text-align: left;
    }
  }
}

.band.head {
  .background-tablet('contact-header');
  @media @desktop-tablet {
    height: 350px;
  }
  @media @desktop {
    background-position: 0 0;
  }
}

.head.band {
  h1 {
    .page-heading;
    @media @desktop {
      padding: 0;
      font-size: @font-size-h1-large;
    }
  }
}

.band.middle {
  .col-sm-12 {
    .col-sm-8.leftcol {
      background-color: @brand-highlight;
      padding: 0 0 25px;
      @media @tablet {
        padding: 30px 0 25px;
      }
      @media @desktop {
        padding: 38px 0 200px;
      }
      #node-6121 {
        .content {
          @media @desktop-tablet {
            width: 500px;
            margin: 0 auto;
          }
        }
        margin: 0 auto;
        text-align: center;
        .field-name-field-form-header h2 {
          display: block;
          .light-text;
          padding-top: 30px;
        }
        .field-name-field-form-header h2,
        .field-name-body p {
          margin: 0 0 35px;
        }
        .webform-client-form {
          .webform-component {
            input {
              padding: 0 15px;
              color: @brand-secondary;
              ::-webkit-input-placeholder,
              :-moz-placeholder,
              ::-moz-placeholder,
              :-ms-input-placeholder {
                color:#999;
              }
            }
          }

          .webform-component--Home-Phone--c 
          .description {
            position: initial;
          }

          button {
            width: 100%;
            margin: 0;
          }
        }
      }
    }
    .col-sm-4.rightcol {
      padding: 30px 0 25px;
      text-align: center;
      @media @desktop {
        padding: 38px 0 0;
        text-align: left;
      }
      .panel-pane {
        background-color: @brand-background;
        margin: 0 auto;
        padding: 3% 6%;
        @media @desktop-tablet {
          .tel {
            pointer-events: none;
          }
        }
        .pane-content {
          padding: 0 20px;
          @media @desktop {
            padding: 0;
          }
          h3 {
            margin: 0 0 20px;
            i.icon-font_phone,
            i.icon-font_mailfill,
            i.icon-font_chat {
              font-size: 40px;
              position: relative;
              top: 10px;
              left: -8px;
              margin-right: -10px;
            }
          }
          p {
            margin-bottom: 35px;
          }
          p.first {
            margin-bottom: 0px;
            @media @desktop {
              margin-bottom: 13px;
            }
          }
          p.second {
            margin-bottom: 35px;
            span {
              display: block;
              margin-top: 13px;
              @media @desktop {
                margin-top: 0;
                display: inline-block;
              }
            }
          }
          p.third {
            margin-bottom: 35px;
          }
          .red {
            .brand-primary;
          }
        }
      }
    }
  }
}