@import "elements/variables";

@import "elements/introduction";

.noBold{font-family: 'open_sansregular';}
.leftRight{text-align: left;}
.centerLeft{text-align: center;}

.contactus{
  margin-top: 25px; overflow: visible;
  .media-list{
    p, .media-heading{margin: 0;font-size: 16px;}

    .media{
      display: table;width: 100%;text-align: left;margin: 20px 0 0;
      &.first{margin:0;}
      .media-object{max-width: 44px;max-height: 44px;height: 44px;width: 44px;}
      .media-body{
        display: table-cell; vertical-align: middle;width: 100%;
        a {color: @brand-primary;}
      }
    }
  }

  form{
    .title{text-transform: uppercase;font-family: 'open_sansbold';text-align: center;margin: 1em 0;font-size: 21px;}
    .data{text-align: left;font-size: 16px;}
    .CheckRadio span.text{width: 92%}
  }

  #contactForm {padding-top: 20px;
    .bg{border: 1px solid @greydc}
    .select-chosen .chosen-results{height: 160px; overflow-y: auto}
    .step{margin-bottom:1em;}
    .step_2{margin-top: 25px;}
    .error{position: relative;}
    .radios{
      &.error{
        & > label:first-child:after{content:''; position: absolute; top: 0; left: 15px; width: 82%; display: block; border: 1px solid @brand-warning; height: 100%;
          @media(min-width: @screen-lg){width: 40%;}
        }
      }
      .CheckRadio {
        @media(min-width: @screen-lg){width: 40%; display: block}
      }
    }
    .tooltip{
      &-inner.error{border: 1px solid @brand-warning;}
    }
    .tip {
      &-2 {
        .tooltip-arrow {
          @media (min-width: 1200px) {
            top: 48%;
          }
        }
      }
      &-1 {
        .tooltip-arrow {
          @media (min-width: 1200px) {
            top: 25%;
          }
        }
      }
    }
  }
  .tooltip{position: relative;margin-top: 3px;padding: 5px 0px;.opacity(1);
      @media(min-width: 1200px){left: 40%;}
      .tooltip-arrow{top: 1px;left: 50%;margin-left: -5px;border-width: 0px 5px 5px;border-bottom-color: @black00;z-index: 4;}
      .tooltip-inner{width: 100%;max-width: 100%;text-align: left; z-index: 3}
    }
}

@media (min-width: 768px){
  .leftRight{text-align: right;}
  .centerLeft{text-align: left;}

  .contactus{
    form{
      .title{margin: 2.5em 0px 1em;}
      .data{text-align: right;font-size: 14px;}
      .form-btn .btn-primary{width: auto}
    }

    #contactForm{
      margin: 0;background-position: 20% 0%;
      .tooltip{
        .tooltip-arrow{left: 25%; }
        .tooltip-inner{
          label{
            width: 50%;float: left;white-space: normal;padding-right: 10px; margin-bottom: 5px;
            .text{width: 90%;text-align: left;}
          }
        }
      }
      .step_2{margin-top: 0px;}
    }

    .step_1{min-height: 15em;}
  }

}


@media (min-width: 1200px){
  .contactus{
    #contactForm{
      .step_1{min-height: 8.5em;}

      .tooltip{width: 60%;position: absolute;top: 0em;margin-left: 3px;margin-top: 0px;padding: 0 5px;
        .tooltip-arrow{left: 1px;margin-top: -5px;border-width: 5px 5px 5px 0px;border-right-color: @black00;margin-left:0px;border-bottom-color: transparent;}
      }
    }
  }

}

.lt-ie9{
  .contactus .CheckBox span{top:-1px;}

  @media (min-width: 768px){
    .contactus .CheckBox span{top:-1px;}
  }
}