/************************************************
 **************** Breakpoints *******************
 ************************************************/
/************************************************
 ******************* Color **********************
 ************************************************/
/************************************************
 ****************** Mixins **********************
 ************************************************/
.contact .breadcrumb .breadcrumb-arrow {
  background: url("https://www.webda.de/wp-content/themes/wwt/public/css/../images/breadcrumb-arrow-white.png") 0 55% no-repeat;
}
.contact .intro {
  position: relative;
  background: url("https://www.webda.de/wp-content/themes/wwt/public/css/../images/office.jpg") 50% 50% no-repeat;
  padding: 120px 0 100px 0;
}
@media (max-width: 800px) {
  .contact .intro {
    background-position: 35% 20%;
  }
}
@media (max-width: 767px) {
  .contact .intro {
    padding: 55px 0 40px 0;
  }
}
.contact .intro .background-mask {
  height: 100%;
  width: 100%;
  position: absolute;
  background: #272727;
  opacity: 0.85;
  top: 0;
  left: 0;
  z-index: 0;
}
.contact .intro h1 {
  text-transform: none;
  margin-bottom: 18px;
  position: relative;
  z-index: 1;
  margin-top: 60px;
}
@media (max-width: 767px) {
  .contact .intro h1 {
    margin-top: 10px;
  }
}
.contact .intro .h1-separator {
  margin-bottom: 22px;
  position: relative;
  z-index: 1;
}
.contact .intro p {
  color: #ededed;
  font-size: 15px;
  text-align: center;
  position: relative;
  z-index: 1;
}
.contact .main-content {
  padding: 20px 0 80px;
  position: relative;
}
@media (max-width: 991px) {
  .contact .main-content {
    padding: 15px 0 50px;
  }
}
.contact .main-content .form-anchor {
  position: absolute;
  top: -70px;
}
.contact .main-content h2 {
  text-align: left;
  font-size: 24px;
  font-weight: 600;
}
.contact .main-content > p {
  padding-right: 30px;
}
.contact .main-content .error-message {
  color: #D70000;
  display: none;
}
.contact .main-content .error-message.show {
  display: inline-block;
}
.contact .main-content .success-message {
  color: #0C9838;
  font-weight: bold;
  margin: 10px 0 23px;
  display: inline-block;
}
.contact .main-content form {
  margin-top: 15px;
}
.contact .main-content form .input,
.contact .main-content form .select,
.contact .main-content form .textarea {
  padding-right: 30px;
  margin-bottom: 7px;
  position: relative;
}
@media (max-width: 767px) {
  .contact .main-content form .input,
  .contact .main-content form .select,
  .contact .main-content form .textarea {
    padding-right: 0;
  }
}
.contact .main-content form .input input.budget,
.contact .main-content form .select input.budget,
.contact .main-content form .textarea input.budget {
  padding-right: 25px;
}
.contact .main-content form .input .euro,
.contact .main-content form .select .euro,
.contact .main-content form .textarea .euro {
  position: absolute;
  z-index: 2;
  top: 6px;
  right: 35px;
}
.contact .main-content form .input.success,
.contact .main-content form .select.success,
.contact .main-content form .textarea.success {
  background: url("https://www.webda.de/wp-content/themes/wwt/public/css/../images/ico-arrow-green.png") 99% no-repeat;
}
@media (max-width: 992px) {
  .contact .main-content form .input.success,
  .contact .main-content form .select.success,
  .contact .main-content form .textarea.success {
    background-position-x: 97%;
  }
}
.contact .main-content form .input.success.textarea,
.contact .main-content form .select.success.textarea,
.contact .main-content form .textarea.success.textarea {
  background-position-y: 8px;
}
@media (min-width: 992px) {
  .contact .main-content form .input.success.col-md-6,
  .contact .main-content form .select.success.col-md-6,
  .contact .main-content form .textarea.success.col-md-6 {
    background-position-x: 98%;
  }
}
.contact .main-content form .input.error,
.contact .main-content form .select.error,
.contact .main-content form .textarea.error {
  background: url("https://www.webda.de/wp-content/themes/wwt/public/css/../images/ico-cross-red.png") 97% no-repeat;
}
.contact .main-content form .input.error.textarea,
.contact .main-content form .select.error.textarea,
.contact .main-content form .textarea.error.textarea {
  background-position-y: 8px;
}
@media (min-width: 992px) {
  .contact .main-content form .input.error.col-md-6,
  .contact .main-content form .select.error.col-md-6,
  .contact .main-content form .textarea.error.col-md-6 {
    background-position-x: 98%;
  }
}
.contact .main-content form input,
.contact .main-content form select,
.contact .main-content form textarea {
  border: 1px solid #ccc;
  border-radius: 2px;
  padding: 9px 12px;
}
.contact .main-content form input:hover,
.contact .main-content form select:hover,
.contact .main-content form textarea:hover {
  border: 1px solid #828282;
}
.contact .main-content form input:active,
.contact .main-content form select:active,
.contact .main-content form textarea:active,
.contact .main-content form input:focus,
.contact .main-content form select:focus,
.contact .main-content form textarea:focus {
  border: 1px solid #272727;
  outline: none;
}
.contact .main-content form input.empty,
.contact .main-content form select.empty,
.contact .main-content form textarea.empty {
  color: #272727;
}
.contact .main-content form select {
  padding: 7px 8px;
}
.contact .main-content form button {
  margin-right: 25px;
  padding: 10px 45px;
}
@media (max-width: 767px) {
  .contact .main-content form button {
    margin-right: 0;
    margin-top: 10px;
  }
}
.contact .main-content form .project-data {
  margin-bottom: 20px;
}
.contact .main-content form .message-data {
  margin-top: 20px;
}
.contact .main-content form .form-footer {
  margin-top: 5px;
}
.contact .main-content form aside {
  font-size: 13px;
}
.contact .sidebar {
  float: right;
  position: relative;
  min-height: 585px;
  padding-left: 30px;
  padding-right: 0;
}
@media (max-width: 1199px) {
  .contact .sidebar {
    padding-right: 0;
    padding-left: 0;
  }
}
@media (max-width: 767px) {
  .contact .sidebar {
    margin-top: 35px;
  }
}
.captcha-wrapper {
  margin: 20px 0 22px 0;
}
@media (max-width: 992px) {
  .captcha-wrapper {
    text-align: center;
  }
}