/*
Theme Name: Houzez Child
Theme URI: http://www.favethemes.com/
Author: Favethemes
Author URI: http://www.favethemes.com/
Description: Houzez is a premium WordPress theme for real estate agents where modern aesthetics are combined with tasteful simplicity, and where the ease of use is achieved without compromise in your ability to customise the design. Whether you are a real estate agent looking to build a website for your company or a web developer seeking a perfect WordPress theme for your next project, you are certain to appreciate the numerous features and benefits that our theme provides.
Version: 1.0
Tags: white, right-sidebar, left-sidebar, custom-colors, custom-menu, featured-images, post-formats, theme-options, translation-ready
License: GNU General Public License version 3.0
License URI: http://www.gnu.org/licenses/gpl-3.0.html
Text Domain: houzez
Template: houzez
*/

@import url("../houzez/style.css");

/* Your CSS code goes here
-------------------------------------- */
/* Basic Form */
body .basic-form .gform_fields {
  position: relative;
}
body .basic-form .gfield_checkbox label {
  position: relative;
  padding: 0 0 0 35px;
  margin: 0;
  cursor: pointer;
  color: #8a0e12;
  font-family: "Roboto", Sans-serif;
  font-weight: 400;
  line-height: 27px;
}
body .basic-form .mt-20 {
  margin-top: 20px;
}
body .basic-form .gfield.agreement .gfield_checkbox label::before {
  border-radius: 1000px;
}
body .basic-form .gfield_checkbox label::before,
body .basic-form .gfield_checkbox label::after {
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
}
body .basic-form .gfield-choice-input {
  position: absolute;
  left: -35px;
  visibility: hidden;
}
body .basic-form .gfield_checkbox label a {
  color: #8a0e12;
  text-decoration: underline;
  -webkit-text-decoration-skip-ink: none;
  text-decoration-skip-ink: none;
}
body .basic-form .gfield.pflichtfeld {
  color: #8a0e12;
  font-family: "Roboto", Sans-serif;
  font-style: normal;
  font-weight: 400;
  line-height: 150%;
  position: absolute;
  bottom: 0;
  right: 0;
}
body .basic-form .gfield_checkbox label::before {
  background-color: #ffffff;
  left: 0;
  top: 0;
  -webkit-transition: background-color 0.2s;
  -o-transition: background-color 0.2s;
  transition: background-color 0.2s;
  width: 22px;
  height: 22px;
  border: 1px solid #d1d3e6;
}
body .basic-form .gfield_checkbox label::after {
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  -webkit-transition: color 0.2s;
  -o-transition: color 0.2s;
  transition: color 0.2s;
}
body
  .basic-form
  .gfield_checkbox
  input[type="checkbox"]:checked
  + label::before {
  background-color: #8a0e12;
  border-color: #8a0e12;
}
body
  .basic-form
  .gfield_checkbox
  input[type="checkbox"]:checked
  + label::after {
  color: #229bee;
  background: url(/wp-content/uploads/2024/05/checkmark-light.svg) no-repeat;
  background-size: contain;
}

body .basic-form .gfield_radio label {
  position: relative;
  padding: 0 0 0 30px;
  margin: 0;
  cursor: pointer;
  color: #8a0e12;
  font-family: "Roboto", Sans-serif;
  font-weight: 400;
  line-height: 27px;
}
body .basic-form .gfield_radio label::before,
body .basic-form .gfield_radio label::after {
  content: "";
  margin: auto;
  position: absolute;
  top: 0;
  bottom: 0;
}
body .basic-form .gfield-radio-input {
  position: absolute;
  left: -35px;
  visibility: hidden;
}
body .basic-form .gfield_radio label::before {
  background-color: #ffffff;
  left: 0;
  top: 0;
  -webkit-transition: background-color 0.2s;
  -o-transition: background-color 0.2s;
  transition: background-color 0.2s;
  border-radius: 1000px;
  width: 22px;
  height: 22px;
  border: 1px solid #d1d3e6;
}
body .basic-form .gfield_radio label::after {
  top: 0;
  left: 0;
  width: 22px;
  height: 22px;
  -webkit-transition: color 0.2s;
  -o-transition: color 0.2s;
  transition: color 0.2s;
}
body .basic-form .gfield_radio input[type="radio"]:checked + label::before {
  background-color: #8a0e12;
  border-color: #8a0e12;
}
body .basic-form .gfield_radio input[type="radio"]:checked + label::after {
  color: #229bee;
  background: url(/wp-content/uploads/2024/05/checkmark-light.svg) no-repeat;
  background-size: contain;
}
body .basic-form .ginput_container_textarea textarea {
  position: relative;
  border-radius: 10px;
  border: 1px solid #d1d3e6;
  background-color: #f1f1f1;
  padding: 16px 26px 17px 26px;
  color: #8a0e12;
  font-family: "Roboto", Sans-serif;
  font-weight: 400;
  line-height: 27px;
}
body .basic-form .gfield_label {
  color: #8a0e12;
  font-family: "Roboto", Sans-serif;
  font-weight: 700;
  line-height: normal;
}
body .basic-form .gfield_description {
  color: #8a0e12;
  font-family: "Roboto", Sans-serif;
  font-weight: 400;
  line-height: normal;
}
body .basic-form .noUi-connect {
  background: #8a0e12;
}
body .basic-form .gform-theme--framework .gf_progressbar .percentbar_blue {
  background-color: #8a0e12;
}
body .basic-form .gform-theme--framework .gf_progressbar_title {
  color: #8a0e12;
  font-family: "Roboto", Sans-serif;
  font-weight: 400;
  line-height: normal;
}
body .basic-form .gform-theme--framework .gf_page_steps,
body .basic-form .gform-theme--framework .gf_progressbar_wrapper {
  margin-bottom: 60px;
}

body .basic-form .ginput_container_text input,
body .basic-form .ginput_container_email input,
body .basic-form .ginput_container_number input[type="number"] {
  position: relative;
  border-radius: 24px;
  border: 0px solid #d1d3e6;
  background-color: #ffffff;
  padding: 10px 20px;
  color: #1d1e1c;
  font-family: "Roboto", Sans-serif;
  font-weight: 300;
  line-height: 27px;
  height: 50px;
  box-shadow: rgba(0, 0, 0, 0.04) 0px 4px 8px;
}
body .basic-form .ginput_container_text input::-webkit-input-placeholder,
body .basic-form .ginput_container_email input::-webkit-input-placeholder,
body .basic-form .ginput_container_number input::-webkit-input-placeholder {
  opacity: 1;
}
body
  .basic-form
  .ginput_container_textarea
  textarea::-webkit-input-placeholder {
  opacity: 1;
}
.hide-instruction .instruction {
  display: none;
}
body .basic-form .gform-theme--framework button.main-cta-red {
  padding: 4px 6px 4px 30px !important;
  border-radius: 24px !important;
  border: 1px solid #8a0e12 !important;
  position: relative;
  display: -webkit-inline-box;
  display: -ms-inline-flexbox;
  display: inline-flex;
  overflow: hidden;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s !important;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out !important;
  background-color: #ffffff !important;
  -webkit-box-shadow: none !important;
  box-shadow: none !important;
}
body .basic-form .gform-theme--framework span.cta-text-container {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  gap: 20px;
}
body .basic-form .gform-theme--framework .main-cta-red .cta-text {
  color: #1d1e1c;
  text-align: center;
  font-size: 16px;
  font-weight: 300;
  line-height: normal;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
  z-index: 2;
}
body .basic-form .gform-theme--framework .main-cta-red:hover .cta-text {
  color: #ffffff;
}
body .basic-form .gform-theme--framework .main-cta-red .cta-icon {
  width: 40px;
  height: 40px;
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
}
body .basic-form .gform-theme--framework .main-cta-red .cta-icon:before {
  content: "";
  width: 40px;
  height: 40px;
  position: absolute;
  background-color: #8a0e12;
  z-index: 1;
  right: 6px;
  -webkit-transition: width 0.25s ease-in-out 0.05s,
    -webkit-transform 0.05s ease-in-out;
  transition: width 0.25s ease-in-out 0.05s, -webkit-transform 0.05s ease-in-out;
  -o-transition: transform 0.05s ease-in-out, width 0.25s ease-in-out 0.05s;
  transition: transform 0.05s ease-in-out, width 0.25s ease-in-out 0.05s;
  transition: transform 0.05s ease-in-out, width 0.25s ease-in-out 0.05s,
    -webkit-transform 0.05s ease-in-out; /* Delay width transition on hover out */
  -webkit-transform: scale(1);
  -ms-transform: scale(1);
  transform: scale(1);
  border-radius: 24px;
}
body .basic-form .gform-theme--framework .main-cta-red:hover .cta-icon:before {
  width: calc(100% - 12px);
  transform: scale(1.5);
  transition: width 0.25s ease-in-out, transform 0.05s ease-in-out 0.05s;
}
body .basic-form .gform-theme--framework .main-cta-red .cta-icon > span {
  display: -webkit-box;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-align: center;
  -ms-flex-align: center;
  align-items: center;
  -webkit-box-pack: center;
  -ms-flex-pack: center;
  justify-content: center;
  z-index: 2;
  position: absolute;
  width: 40px;
  height: 40px;
  -webkit-transition: 0.3s;
  -o-transition: 0.3s;
  transition: 0.3s;
  -webkit-transition-timing-function: ease-in-out;
  -o-transition-timing-function: ease-in-out;
  transition-timing-function: ease-in-out;
}
body .basic-form .main-cta-red .cta-icon > span.cta-icon-initial:after {
  content: "";
  display: block;
  width: 13px;
  height: 10px;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12.4 9.6'%3E%3Cpath d='M12.2,5.2a.7.7,0,0,0,0-.9L8,.2a.6.6,0,0,0-.9,0,.6.6,0,0,0,0,.9l3.7,3.7L7.1,8.5a.6.6,0,0,0,0,.9.7.7,0,0,0,.9,0ZM0,5.4H11.7V4.1H0Z' fill='%23fff'/%3E%3C/svg%3E%0A");
}
body .basic-form .main-cta-red .cta-icon > span.cta-icon-state:after {
  content: "";
  display: block;
  width: 13px;
  height: 10px;
  background-size: contain;
  background-repeat: no-repeat;
  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 12.4 9.6'%3E%3Cpath d='M12.2,5.2a.7.7,0,0,0,0-.9L8,.2a.6.6,0,0,0-.9,0,.6.6,0,0,0,0,.9l3.7,3.7L7.1,8.5a.6.6,0,0,0,0,.9.7.7,0,0,0,.9,0ZM0,5.4H11.7V4.1H0Z' fill='%23fff'/%3E%3C/svg%3E%0A");
}
body .basic-form .main-cta-red span.cta-icon-state {
  -webkit-transform: translateX(-30px);
  -ms-transform: translateX(-30px);
  transform: translateX(-30px);
  opacity: 0;
}
body .basic-form .main-cta-red span.cta-icon-initial {
  -webkit-transform: translateX(0px);
  -ms-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
body .basic-form .main-cta-red:hover span.cta-icon-state {
  -webkit-transform: translateX(0px);
  -ms-transform: translateX(0px);
  transform: translateX(0px);
  opacity: 1;
}
body .basic-form .main-cta-red:hover span.cta-icon-initial {
  -webkit-transform: translateX(30px);
  -ms-transform: translateX(30px);
  transform: translateX(30px);
  opacity: 0;
}
@media (max-width: 880px) {
  body .basic-form .gfield.pflichtfeld {
    font-size: 14px;
    line-height: 21px;
    bottom: 50px;
  }
  body .basic-form .gfield.agreement {
    margin-top: 50px;
  }
  body .basic-form .gfield.agreement label {
    font-size: 14px;
    line-height: 21px;
  }
  body .basic-form .ginput_container_text input,
  body .basic-form .ginput_container_email input {
    font-size: 16px;
    line-height: 24px;
    padding: 16px 20px 22px 20px;
  }
  body .basic-form .ginput_container_textarea textarea {
    font-size: 16px;
    line-height: 24px;
    padding: 16px 20px 22px 20px;
  }
  body .basic-form .gform-theme--framework button.main-cta-red {
    padding: 4.5px 5.4px 4.5px 27px !important;
  }
  body .basic-form .gform-theme--framework .main-cta-red .cta-text {
    font-size: 17.5px;
  }
  body .basic-form .gform-theme--framework .main-cta-red .cta-icon {
    width: 42.705px;
    height: 42.705px;
  }
  body .basic-form .gform-theme--framework .main-cta-red .cta-icon:before {
    width: 42.705px;
    height: 42.705px;
  }
  body .basic-form .gform-theme--framework .main-cta-red .cta-icon > span {
    width: 42.705px;
    height: 42.705px;
  }
}
@media (max-width: 640px) {
  body .gfield.pflichtfeld {
    bottom: 70px;
  }
}
