/* Steps ====================*/

.steps-bg {
  padding: 0 0 30px 0;
}
#pills-tabContent {
  max-width: 700px;
  margin: 0 auto;
  padding: 0;
  border-radius: 0 0 10px 10px;
 }
.tab-content>.active {
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: horizontal;
          box-orient: horizontal;
  -webkit-box-direction: normal;
          box-direction: normal;
  -webkit-flex-flow: row wrap;
      -ms-flex-flow: row wrap;
          flex-flow: row wrap;
}
#pills-tabContent .steps .genres{
  padding: 0px;
  display: -webkit-box;
  display: -webkit-flex;
  display: -ms-flexbox;
  display: flex;
  -webkit-box-orient: vertical;
          box-orient: vertical;
  -webkit-box-direction: normal;
          box-direction: normal;
  -webkit-flex-flow: column;
  -ms-flex-flow: column;
          flex-flow: column;
  -webkit-box-pack: justify;
  -ms-flex-pack: justify;
          box-pack: justify;
  -webkit-justify-content: space-between;
          justify-content: space-between;
  transition: all .4s ease-in-out;
  width:100%;
}
.genre-container, .preferences-container {
  width: 100%;
  margin: 0px;
  -webkit-box-pack: justify;
  box-pack: justify;
  -webkit-justify-content: space-between;
  -ms-flex-pack: justify;
  justify-content: space-between;
}
.steps .user-pass {
  text-align: left;
  margin: 0 auto;
}
.md-form {
  text-align:left;
}
.steps .user-pass .md-form {
  margin: 15px auto 0 auto;
  width: 100%;
  float:left;
}
.steps .email-terms .md-form {
  margin: 0;
}
.registerFormMultistep {
  max-width: 700px;
  margin: 0 auto;
  padding:0;
  border-radius: 10px;
}
.steps h2 {
  text-align: left;
  margin-bottom:0;
}
@media screen and (max-width: 767px) {
  .steps h2 {
    font-size: 1.5em;
  }
}
@media screen and (max-width: 575px) {
  .steps h2 {
    font-size: 1.25em;
  }
}
@media screen and (max-width: 375px) {
  #pills-tabContent .steps .genres{
    padding:15px 15px 95px 15px;
  }
}

@media screen and (max-width: 375px) {
  .title-multistep{
    padding:15px 15px 0px 15px;
  }
}

@media screen and (max-width: 320px) {
  .steps h2 {
    font-size:1em;
   }
}

#pills-tabContent #genders label, #pills-tabContent .steps #gender_interest label, .preferences label.genre {
  width: 380px !important;
  max-width: 380px !important;
  margin-left: 10px;
  display: block;
  background-color: var(--primary);
  border-radius: 25px;
  font-size: 1rem;
  letter-spacing: 0px;
  padding: 0.8rem 0.2rem;
}

@media screen and (max-width: 767px) {
  #pills-tabContent #genders label, #pills-tabContent .steps #gender_interest label, .preferences label.genre {
    width: 330px !important;
    max-width: 330x !important;
    
  }
}


.user{
  width: 100% !important;
  max-width: 380px !important;
  margin: 0;
  display: block;
  background-color: #fff;
  border-radius: 5px;
  font-size: 1rem;
  letter-spacing: 0px;
  padding: 0px;
  
}

.md-form label{
  left: 10px;
  top: .5rem;
}

.md-form .prefix {
  top: .25rem;
  font-size: 1.25rem;
}

.select-wrapper input.select-dropdown, .md-form input[type=text] {
  color: #757575;
  margin-bottom: 0rem !important;
}

.pass{
  width: 100% !important;
  max-width: 380px !important;
  margin: 0;
  display: block;
  background-color: #fff;
  border-radius: 5px;
  font-size: 1rem;
  letter-spacing: 0px;
  padding: 0px;
}

.md-form{
  width: 100% !important;
  /* max-width: 380px !important; */
  margin: 0;
  display: block;
  background-color: #fff;
  border-radius: 5px;
  font-size: 1rem;
  letter-spacing: 0px;
  padding: 0px;
}

.md-form .validate {
  margin-bottom: 0rem;
}
.form-check-input[type=checkbox]+label, label.btn input[type=checkbox]+label {
  color: #fff !important;
}

.form-control{
  border-bottom: none !important;
}

.md-form label .active{
  border-bottom: none !important;
}


.termsPoprivacy.footer-level a {
    color: #fff !important;
}

.md-form .prefix {
  top: .50rem;
  font-size: 1.25rem;
}

/* .fas fa-envelope-open prefix{
  padding-right: 5px;
} */

#pills-tabContent .submit-container button.btn.btn-next, #pills-tabContent .submit-container button.btn.btn-submit {
  margin-top: 10px;
  height: 39px;
  padding-top: 11px;
}

.privacy.footer-level .link a {
  color:#fff !important;
  }

@media screen and (max-width: 767px) {
.main-frame-logo-centered .logo img{
width: 300px !important;
}}

.stepper-progress{
 height: 80px;
}

.gesprekspartner{
  padding-left: 30px
}

.md-form .prefix~label.active {
  display: none;
}

.mb-1, .my-1{
  margin: 0;
}


.mb-1{
  margin-bottom: 0;
}

.steps.active {
    padding: 0 15px 80px 15px;
}