/* Generated by less 2.5.1 */
body {
  margin: 0;
  padding: 0;
}
#noService .success,
#noService .error-message {
  width: 100%;
  max-width: 640px;
  text-align: center;
  font-size: 1.5em;
  margin: 7% auto 18%;
}
#noService .success h2,
#noService .error-message h2 {
  margin: 0 auto;
  font-size: 1em;
}
#noService .success img,
#noService .error-message img {
  width: 70px;
  display: block;
  margin: 0.5em auto;
}
#noService .success a,
#noService .error-message a {
  color: #1a8076;
  text-decoration: none;
}
#noService .wrapper,
#noService .wrapper-m {
  direction: rtl;
  font-size: 15px;
  max-width: 970px;
  width: 100%;
  font-family: arial;
  margin: 0 auto;
}
#noService .wrapper .form-box,
#noService .wrapper-m .form-box {
  width: 100%;
  background: #e5e5e5;
  margin: 2em auto;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box,
  #noService .wrapper-m .form-box {
    padding-bottom: 0.5em;
  }
}
#noService .wrapper .form-box img.side-img,
#noService .wrapper-m .form-box img.side-img {
  display: inline-block;
  width: 40%;
  margin-right: 1.4%;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box img.side-img,
  #noService .wrapper-m .form-box img.side-img {
    display: none;
  }
}
#noService .wrapper .form-box img.side-img-m,
#noService .wrapper-m .form-box img.side-img-m {
  display: none;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box img.side-img-m,
  #noService .wrapper-m .form-box img.side-img-m {
    width: 100%;
    display: block;
    margin-right: 0;
  }
}
#noService .wrapper .form-box .formContent,
#noService .wrapper-m .form-box .formContent {
  margin: 3%;
  margin-left: 0;
  width: 55%;
  display: inline-block;
  vertical-align: top;
  font-size: 1.6em;
  font-weight: normal;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent,
  #noService .wrapper-m .form-box .formContent {
    margin: 1em auto;
    width: 95%;
    display: block;
  }
}
#noService .wrapper .form-box .formContent h2,
#noService .wrapper-m .form-box .formContent h2 {
  font-size: 1.1em;
  margin: 0;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent h2,
  #noService .wrapper-m .form-box .formContent h2 {
    text-align: center;
  }
}
#noService .wrapper .form-box .formContent p,
#noService .wrapper-m .form-box .formContent p {
  margin: 0 auto;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent p,
  #noService .wrapper-m .form-box .formContent p {
    text-align: center;
  }
}
#noService .wrapper .form-box .formContent .form,
#noService .wrapper-m .form-box .formContent .form {
  width: 70%;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent .form,
  #noService .wrapper-m .form-box .formContent .form {
    width: 95%;
    margin: 1em auto;
  }
}
#noService .wrapper .form-box .formContent .form .field-group,
#noService .wrapper-m .form-box .formContent .form .field-group {
  margin: 1em;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent .form .field-group,
  #noService .wrapper-m .form-box .formContent .form .field-group {
    margin: 1em auto;
  }
}
#noService .wrapper .form-box .formContent .form label,
#noService .wrapper-m .form-box .formContent .form label {
  font-size: 0.8em;
  display: block;
}
#noService .wrapper .form-box .formContent .form input,
#noService .wrapper-m .form-box .formContent .form input,
#noService .wrapper .form-box .formContent .form select,
#noService .wrapper-m .form-box .formContent .form select {
  width: 90%;
  font-size: 0.8em;
  padding: 0.6em;
  border: 1px solid;
  margin-top: 0.2em;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent .form input,
  #noService .wrapper-m .form-box .formContent .form input,
  #noService .wrapper .form-box .formContent .form select,
  #noService .wrapper-m .form-box .formContent .form select {
    margin: 0.2em auto;
    display: block;
    width: 100%;
  }
}
#noService .wrapper .form-box .formContent .form .input-error,
#noService .wrapper-m .form-box .formContent .form .input-error {
  color: red;
}
#noService .wrapper .form-box .formContent .form .error-message,
#noService .wrapper-m .form-box .formContent .form .error-message {
  color: red;
  font-size: 0.62em;
  float: right;
  text-align: right;
  margin: 0.5em auto;
}
#noService .wrapper .form-box .formContent .form select,
#noService .wrapper-m .form-box .formContent .form select {
  background: transparent;
  width: 100%;
  display: block;
  border: 0;
  border-radius: 0;
  -webkit-appearance: none;
}
#noService .wrapper .form-box .formContent .form input:focus,
#noService .wrapper-m .form-box .formContent .form input:focus,
#noService .wrapper .form-box .formContent .form select:focus,
#noService .wrapper-m .form-box .formContent .form select:focus {
  outline: none;
}
#noService .wrapper .form-box .formContent .form .coustom-select,
#noService .wrapper-m .form-box .formContent .form .coustom-select {
  width: 97%;
  overflow: hidden;
  background: url('../imgs/arrow_down.png') no-repeat left center white;
  background-position: 5%;
  border: 1px solid black;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent .form .coustom-select,
  #noService .wrapper-m .form-box .formContent .form .coustom-select {
    margin: 0.2em auto;
    width: 100%;
  }
}
#noService .wrapper .form-box .formContent .form .btn,
#noService .wrapper-m .form-box .formContent .form .btn {
  display: inline-block;
  min-width: 110px;
  padding: 0 15px;
  height: 45px;
  line-height: 45px;
  background-color: #2cd5c4;
  color: #231f20;
  font-size: 0.92em;
  font-weight: bold;
  text-align: center;
  text-decoration: none;
  cursor: pointer;
  border: none !important;
  vertical-align: middle;
  margin: 1em;
  margin-bottom: 0;
  margin-top: 0.2em;
}
@media only screen and (max-width: 768px) {
  #noService .wrapper .form-box .formContent .form .btn,
  #noService .wrapper-m .form-box .formContent .form .btn {
    width: 100%;
    margin: 1.5em auto;
    display: block;
    font-size: 1em;
  }
}
#noService .wrapper .form-box .formContent .form .btn:hover,
#noService .wrapper-m .form-box .formContent .form .btn:hover {
  background-color: #aaddd7;
}
.clearfix {
  clear: both;
}
.wrapper-m h1 {
  font-size: 2em;
  margin: 0.3em;
}