/*
Theme Name: Woningspecialist
Theme URI: https://woningspecialist.be/
Description: Custom Theme
Author: Kishan
Author URI: https://www.daverend.com/
Template: landpress
Version: 1.0
License: Envato Standard License
License URI: https://themeforest.net/licenses/standard
Tags: one-column, two-columns, three-columns, four-columns, left-sidebar, right-sidebar, custom-menu, featured-images, flexible-header, post-formats, sticky-post, translation-ready
Text Domain: woningspecialist
*/

#crepiForm{
	max-width: 500px;
	margin: 20px auto;
}

#crepiForm .tab{
	margin-bottom: 20px;
	display: none;
}

/* Make circles that indicate the steps of the form: */

#crepiForm .steps {
	text-align: center;
  color: #4b5563;
  grid-area: steps;
  display: block;
}

#crepiForm .stepsprogrees {
	background-color: #e5e7eb;
  border-radius: 9999px;
  grid-area: progress;
  width: 100%;
  height: .625rem;
  position: relative;	
  margin-bottom: 3rem;
}

#crepiForm .step {
  border-radius: 9999px;
  background: #44ad34;
  height: .625rem;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  position: absolute;
  width: 25%;
}

/* Mark the active step: */
#crepiForm .step.active {
  opacity: 1;
}

/* Mark the steps that are finished and valid: */
#crepiForm .step.finish {
  background-color: #04AA6D;
}

#crepiForm h5{
	margin-top: 10px;
}

/* Mark input boxes that gets an error on validation: */
#crepiForm input.invalid{
  background-color: #ffdddd;
}

#crepiForm .error{
	color: #ff4444;
  display: none;
}

#crepiForm .tab p{
	margin-bottom: 0.5em;
	margin-left: 7px;
}
.steptitle{
	color: #1a4389;
    margin-bottom: 1rem;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem;
    display: block;
}

#crepiForm .permissionoption{
	display: none;
}

#crepiForm .stepsbuttons{
	width: 100%;
}

#crepiForm .stepsbuttons .button{
	width: 40%;
}

#crepiForm .stepsbuttons #nextBtn{
	float: right;
}

#crepiForm .leadsuccess{
	background-color: #499CEA;
	border-radius: 10px;
	border: solid 1px #fff;
	color: #fff;
	font-size: 16px;
	padding: 20px 30px;
}


/*****************************
					dakwerken
*****************************/

#dakwerkenForm{
	max-width: 500px;
	margin: 20px auto;
}

#dakwerkenForm .tab{
	margin-bottom: 20px;
	display: none;
}

/* Make circles that indicate the steps of the form: */

#dakwerkenForm .steps {
	text-align: center;
  color: #4b5563;
  grid-area: steps;
  display: block;
}

#dakwerkenForm .stepsprogrees {
	background-color: #e5e7eb;
  border-radius: 9999px;
  grid-area: progress;
  width: 100%;
  height: .625rem;
  position: relative;	
  margin-bottom: 3rem;
}

#dakwerkenForm .step {
  border-radius: 9999px;
  background: #44ad34;
  height: .625rem;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  position: absolute;
  width: 25%;
}

/* Mark the active step: */
#dakwerkenForm .step.active {
  opacity: 1;
}

/* Mark the steps that are finished and valid: */
#dakwerkenForm .step.finish {
  background-color: #04AA6D;
}

#dakwerkenForm h5{
	margin-top: 10px;
}

/* Mark input boxes that gets an error on validation: */
#dakwerkenForm input.invalid {
  background-color: #ffdddd;
}

#dakwerkenForm .error{
	color: #ff4444;
  display: none;
}

#dakwerkenForm #invalid {
  background-color: #ff4444;
  display: none;
}

#dakwerkenForm .tab p{
	margin-bottom: 0.5em;
	margin-left: 7px;
}

#dakwerkenForm p.invalid {
  color: #ffdddd;
}

.steptitle{
	color: #1a4389;
    margin-bottom: 1rem;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem;
    display: block;
}

#dakwerkenForm .permissionoption,
#dakwerkenForm .newroofoption,
#dakwerkenForm .renovateroofoption {
	display: none;
}

#dakwerkenForm .stepsbuttons{
	width: 100%;
}

#dakwerkenForm .stepsbuttons .button{
	width: 40%;
}

#dakwerkenForm .stepsbuttons #nextBtn{
	float: right;
}

#dakwerkenForm .leadsuccess{
	background-color: #499CEA;
	border-radius: 10px;
	border: solid 1px #fff;
	color: #fff;
	font-size: 16px;
	padding: 20px 30px;
}


/*****************************
					zonnepanelen
*****************************/

#zonnepanelenForm{
	max-width: 500px;
	margin: 20px auto;
}

#zonnepanelenForm .tab{
	margin-bottom: 20px;
	display: none;
}

/* Make circles that indicate the steps of the form: */

#zonnepanelenForm .steps {
	text-align: center;
  color: #4b5563;
  grid-area: steps;
  display: block;
}

#zonnepanelenForm .stepsprogrees {
	background-color: #e5e7eb;
  border-radius: 9999px;
  grid-area: progress;
  width: 100%;
  height: .625rem;
  position: relative;	
  margin-bottom: 3rem;
}

#zonnepanelenForm .step {
  border-radius: 9999px;
  background: #44ad34;
  height: .625rem;
  transition-property: all;
  transition-duration: .2s;
  transition-timing-function: cubic-bezier(.4,0,.2,1);
  position: absolute;
  width: 25%;
}

/* Mark the active step: */
#zonnepanelenForm .step.active {
  opacity: 1;
}

/* Mark the steps that are finished and valid: */
#zonnepanelenForm .step.finish {
  background-color: #04AA6D;
}

#zonnepanelenForm h5{
	margin-top: 10px;
}

/* Mark input boxes that gets an error on validation: */
#zonnepanelenForm input.invalid {
  background-color: #ffdddd;
}

#zonnepanelenForm .tab p{
	margin-bottom: 0.5em;
	margin-left: 7px;
}

#zonnepanelenForm #invalid,
#zonnepanelenForm .error {
  color: #ff4444;
  display: none;
}

.steptitle{
	color: #1a4389;
    margin-bottom: 1rem;
    font-size: 1.5rem;
    font-weight: 400;
    line-height: 2rem;
    display: block;
}

#zonnepanelenForm .companyname{
	display: none;
}

#zonnepanelenForm .stepsbuttons{
	width: 100%;
}

#zonnepanelenForm .stepsbuttons .button{
	width: 40%;
}

#zonnepanelenForm .stepsbuttons #nextBtn{
	float: right;
}

#zonnepanelenForm .leadsuccess{
	background-color: #499CEA;
	border-radius: 10px;
	border: solid 1px #fff;
	color: #fff;
	font-size: 16px;
	padding: 20px 30px;
}