/* #####################################################################################################
   Forms
   ##################################################################################################### */

/*--- standard variables ---*/
/*--- overwrite variables with the variable from a theme ---*/
/* #####################################################################################################
   This stylesheet is used for theme specific variables
   ##################################################################################################### */
/*--- media queries. When using responsive ---*/
/*--- custom class functions ---*/
/*----- Default functions -----*/
/*---------------------------------------------------
    LESS Elements 0.9
  ---------------------------------------------------
    A set of useful LESS mixins
    More info at: http://lesselements.com
  ---------------------------------------------------*/
/*----- CSS3 Animation functions -----*/
/* reCaptcha */

.grecaptcha-badge {
  margin-bottom: 10px;
}
p.required {
  padding-left: 7px;
  background: url(../../../images/required.gif) 0 2px no-repeat;
}
.required {
  background: url(../../../images/required.gif) 98% 6px no-repeat;
}
input {
  border-radius: 0;
}
input[type="text"],
input[type="email"],
input[type="tel"],
input[type="number"],
input[type="password"],
input[type="datetime"],
input[type="datetime-local"],
textarea {
  padding: 0 2%;
  height: 25px;
  line-height: 25px;
  background: #f3f5f8;
  border: 1px solid #e0e6ec;
  color: #001f4b;
}
.isMobile input[type="text"]::-webkit-input-placeholder,
.isMobile input[type="email"]::-webkit-input-placeholder,
.isMobile input[type="tel"]::-webkit-input-placeholder,
.isMobile input[type="number"]::-webkit-input-placeholder,
.isMobile input[type="password"]::-webkit-input-placeholder,
.isMobile input[type="datetime"]::-webkit-input-placeholder,
.isMobile input[type="datetime-local"]::-webkit-input-placeholder,
.isMobile textarea::-webkit-input-placeholder {
  color: #869eb7 !important;
}
.isMobile input[type="text"]::-moz-placeholder,
.isMobile input[type="email"]::-moz-placeholder,
.isMobile input[type="tel"]::-moz-placeholder,
.isMobile input[type="number"]::-moz-placeholder,
.isMobile input[type="password"]::-moz-placeholder,
.isMobile input[type="datetime"]::-moz-placeholder,
.isMobile input[type="datetime-local"]::-moz-placeholder,
.isMobile textarea::-moz-placeholder {
  color: #6785a3 !important;
}
.isMobile input[type="text"]:-moz-placeholder,
.isMobile input[type="email"]:-moz-placeholder,
.isMobile input[type="tel"]:-moz-placeholder,
.isMobile input[type="number"]:-moz-placeholder,
.isMobile input[type="password"]:-moz-placeholder,
.isMobile input[type="datetime"]:-moz-placeholder,
.isMobile input[type="datetime-local"]:-moz-placeholder,
.isMobile textarea:-moz-placeholder {
  color: #6785a3 !important;
}
.isMobile input[type="text"]:-ms-input-placeholder,
.isMobile input[type="email"]:-ms-input-placeholder,
.isMobile input[type="tel"]:-ms-input-placeholder,
.isMobile input[type="number"]:-ms-input-placeholder,
.isMobile input[type="password"]:-ms-input-placeholder,
.isMobile input[type="datetime"]:-ms-input-placeholder,
.isMobile input[type="datetime-local"]:-ms-input-placeholder,
.isMobile textarea:-ms-input-placeholder {
  color: #a6b8ca !important;
}
input[type="checkbox"],
input[type="radio"] {
  margin: 0 15px 0 0;
}
textarea.favorites {
  max-width: 455px;
  width: 100%;
}
td.favorites {
  padding-left: 0px !important;
}
select {
  border: 1px solid #e6ebf0;
  color: #001f4b;
  padding: 6px 4px;
}
select.noFixedWidth {
  width: auto;
}
select option {
  padding: 0 5px 0 2px;
}
/* Validatie */

input.errorfield {
  background: #ffdedd;
  border: 1px solid #e6575a;
}
.coupon .validation {
  width: 370px;
  margin-bottom: 10px;
}
#content .valMessage {
  display: inline-block;
  line-height: initial;
  color: #e6575a;
  width: 100%;
  box-sizing: border-box;
  list-style: none;
}
#content .valMessage ul {
  background: #f3f9ec;
  border: 1px solid #8fb776;
  padding: 1% 3%;
  margin: 0 0 1.5%;
  color: #8fb776;
  list-style: none;
  width: 100%;
  box-sizing: border-box;
}
#content .valMessage ul li {
  margin: 0 0 0 2%;
  width: 100%;
}
#content .valMessage.alt ul {
  background: #ffdedd;
  border: 1px solid #e6575a;
  color: #e6575a;
}
#content .valMessage.alt a {
  color: #e6575a;
  text-decoration: underline;
}
#Email + .valMessage {
  display: inline-block;
  margin-top: 15px;
}
#Email + .valMessage + .valMessage {
  display: inline-block;
  margin-top: 15px;
}
#Email + .valMessage + .valMessage + .valMessage {
  display: inline-block;
  margin-top: 15px;
}
.message ul {
  background: #ffffcc;
  border: 1px solid green;
  margin: 15px 0 0 0;
  padding: 8px 10px;
}
.message ul li {
  margin-left: 16px;
}
#content .siteForm .row .forms_nameRow {
  display: flex;
}
#content .siteForm .row .forms_nameRow > input[type="text"] {
  flex-grow: 1;
  flex-shrink: 1;
  margin-right: 5px;
  flex-basis: 100px;
}
#content .siteForm .row .forms_nameRow > input[type="text"]:nth-child(1) {
  flex-grow: 7;
  flex-shrink: 1;
}
#content .siteForm .row .forms_nameRow > input[type="text"]:nth-child(3) {
  flex-grow: 7;
  flex-shrink: 1;
  margin-right: 0;
}
#content .siteForm #createAccount {
  margin-top: calc(40px);
}
#content .siteForm #createAccount .row {
  min-height: initial;
}
.generatedForm {
  padding: 2% 1%;
  width: 98%;
}
.siteForm,
.generatedForm {
  position: relative;
  background-color: #fcfcfc;
  border: 1px solid #e6ebf0;
  padding: 2%;
  /*end .row */

}
.siteForm h3,
.generatedForm h3 {
  margin: 2% 0 0;
  display: block;
}
.siteForm p,
.generatedForm p {
  margin: 1% 0;
}
.siteForm p.required,
.generatedForm p.required {
  margin: 0 0 15px;
}
#content .siteForm .row,
#content .generatedForm .row {
  margin-bottom: 20px;
  position: relative;
  line-height: initial;
  /* row with selectbox */

  /* row with radiobuttons */

  /* row with a checkbox */

  /* row with text */

}
#content .siteForm .row.smallInput,
#content .generatedForm .row.smallInput {
  margin-bottom: 15px;
}
#content .siteForm .row.smallInput > input,
#content .generatedForm .row.smallInput > input {
  width: 32%;
  float: left;
  margin-bottom: 0;
}
#content .siteForm .row.smallInput > input + input:not(.first),
#content .generatedForm .row.smallInput > input + input:not(.first),
#content .siteForm .row.smallInput > input ~ .valMessage + input:not(.first),
#content .generatedForm .row.smallInput > input ~ .valMessage + input:not(.first) {
  margin-left: 2%;
}
#content .siteForm .row.smallInput > input.small,
#content .generatedForm .row.smallInput > input.small {
  width: 22%;
}
#content .siteForm .row.smallInput > input.wide,
#content .generatedForm .row.smallInput > input.wide {
  width: 42%;
}
#content .siteForm .row.smallInput > input.half,
#content .generatedForm .row.smallInput > input.half {
  width: 49%;
}
#content .siteForm .row.lineHeight,
#content .generatedForm .row.lineHeight {
  line-height: initial;
}
#content .siteForm .row.lineHeight label,
#content .generatedForm .row.lineHeight label,
#content .siteForm .row.lineHeight span.label,
#content .generatedForm .row.lineHeight span.label {
  margin: 0;
  display: block;
  font-weight: bold;
  font-size: 13px;
}
#content .siteForm .row.lineHeight input::-webkit-input-placeholder,
#content .generatedForm .row.lineHeight input::-webkit-input-placeholder {
  visibility: visible;
  color: darkgray;
}
#content .siteForm .row.lineHeight input::-moz-placeholder,
#content .generatedForm .row.lineHeight input::-moz-placeholder {
  visibility: visible !important;
  color: darkgray;
}
#content .siteForm .row.lineHeight input:-moz-placeholder,
#content .generatedForm .row.lineHeight input:-moz-placeholder {
  visibility: visible !important;
  color: darkgray;
}
#content .siteForm .row.lineHeight input:-ms-input-placeholder,
#content .generatedForm .row.lineHeight input:-ms-input-placeholder {
  visibility: visible;
  color: darkgray;
}
#content .siteForm .row > label,
#content .generatedForm .row > label {
  /*font-size: 0;*/
  font-weight: 600;
  display: block;
  margin-bottom: 10px;
}
#content .siteForm .row.inputtype-6 label,
#content .generatedForm .row.inputtype-6 label {
  font-size: 12px;
  line-height: normal;
  display: block;
  margin: 0 0 1%;
  font-weight: 700;
}
#content .siteForm .row p,
#content .generatedForm .row p {
  line-height: normal;
}
#content .siteForm .row input[type="text"],
#content .generatedForm .row input[type="text"],
#content .siteForm .row input[type="email"],
#content .generatedForm .row input[type="email"],
#content .siteForm .row input[type="tel"],
#content .generatedForm .row input[type="tel"],
#content .siteForm .row input[type="number"],
#content .generatedForm .row input[type="number"],
#content .siteForm .row input[type="password"],
#content .generatedForm .row input[type="password"],
#content .siteForm .row textarea,
#content .generatedForm .row textarea {
  margin: 0;
  width: 96.8%;
  padding: 8px 1.5%;
}
#content .siteForm .row textarea,
#content .generatedForm .row textarea {
  min-height: 100px;
}
#content .siteForm .row input[type="checkbox"],
#content .generatedForm .row input[type="checkbox"] {
  float: left;
  margin: 0.5% 2% 0 0;
}
#content .siteForm .row .optionWrap,
#content .generatedForm .row .optionWrap {
  display: block;
  width: 99%;
}
#content .siteForm .row .innerRow > span,
#content .generatedForm .row .innerRow > span {
  display: block;
}
#content .siteForm .row .innerRow select,
#content .generatedForm .row .innerRow select {
  margin: 0 0 0 1.5%;
}
#content .siteForm .row span label,
#content .generatedForm .row span label,
#content .siteForm .row span.label,
#content .generatedForm .row span.label {
  display: inline;
}
#content .siteForm .row span label,
#content .generatedForm .row span label,
#content .siteForm .row span input,
#content .generatedForm .row span input {
  cursor: pointer;
}
#content .siteForm .row.inputtype-2 > label,
#content .generatedForm .row.inputtype-2 > label {
  width: 100%;
  margin: 0 0 10px;
  display: block;
  font-size: 12px;
  line-height: 20px;
}
#content .siteForm .row.inputtype-2 .optionWrap,
#content .generatedForm .row.inputtype-2 .optionWrap {
  width: 100;
  margin-left: 0;
}
#content .siteForm .row.inputtype-3 label,
#content .generatedForm .row.inputtype-3 label,
#content .siteForm .row.type-radio label,
#content .generatedForm .row.type-radio label {
  line-height: 24px;
}
#content .siteForm .row.inputtype-3 > label,
#content .generatedForm .row.inputtype-3 > label,
#content .siteForm .row.type-radio > label,
#content .generatedForm .row.type-radio > label {
  /*idth: 20%;*/
  /*float: left;*/
  display: block;
  font-size: 12px;
  font-weight: bold;
}
#content .siteForm .row.inputtype-3 > label + input[type="radio"],
#content .generatedForm .row.inputtype-3 > label + input[type="radio"],
#content .siteForm .row.type-radio > label + input[type="radio"],
#content .generatedForm .row.type-radio > label + input[type="radio"] {
  margin-left: 20px;
}
#content .siteForm .row.inputtype-3 span input,
#content .generatedForm .row.inputtype-3 span input,
#content .siteForm .row.type-radio span input,
#content .generatedForm .row.type-radio span input {
  margin: 0 1% 0 0;
}
#content .siteForm .row.inputtype-3 span label,
#content .generatedForm .row.inputtype-3 span label,
#content .siteForm .row.type-radio span label,
#content .generatedForm .row.type-radio span label {
  margin: 0 3% 0 0;
}
#content .siteForm .row.inputtype-3 span label + input[type="radio"],
#content .generatedForm .row.inputtype-3 span label + input[type="radio"],
#content .siteForm .row.type-radio span label + input[type="radio"],
#content .generatedForm .row.type-radio span label + input[type="radio"] {
  margin-left: 20px;
}
#content .siteForm .row.inputtype-3 .optionWrap,
#content .generatedForm .row.inputtype-3 .optionWrap,
#content .siteForm .row.type-radio .optionWrap,
#content .generatedForm .row.type-radio .optionWrap {
  width: 78%;
  margin-left: 2%;
  line-height: 20px;
}
#content .siteForm .row.inputtype-4,
#content .generatedForm .row.inputtype-4 {
  padding: 0;
  line-height: 20px;
}
#content .siteForm .row.inputtype-4 > label,
#content .generatedForm .row.inputtype-4 > label {
  font-size: 13px;
  font-weight: normal;
}
#content .siteForm .row.inputtype-4 span,
#content .generatedForm .row.inputtype-4 span {
  overflow: auto;
  display: block;
}
#content .siteForm .row.inputtype-4 span input[type="checkbox"],
#content .generatedForm .row.inputtype-4 span input[type="checkbox"] {
  margin: 3px 5px 10px 0;
  clear: both;
}
#content .siteForm .row.inputtype-4 span label,
#content .generatedForm .row.inputtype-4 span label {
  float: left;
}
#content .siteForm .row.inputtype-7,
#content .generatedForm .row.inputtype-7 {
  line-height: 20px;
}
.siteForm .rowGroup,
.generatedForm .rowGroup {
  margin: 0 0 8%;
}
/*end .siteForm*/

/* Table in lijstformat */

.tableList td {
  width: auto;
  background: white;
}
.tableList thead td {
  border-bottom: 2px solid #e6ebf0;
  font-weight: 600;
}
.tableList > td {
  border-bottom: 1px dotted #e6ebf0;
}
.tableList .even td {
  background: white;
}
.birthDate_wrapper {
  display: flex;
  justify-content: space-between;
}
.birthDate_wrapper > * {
  flex-basis: 29%;
}
@media only screen and (max-width: 768px) {
  .formBottom {
    margin-top: 3rem;
  }
}
@media only screen and (max-width: 768px) {
  .formBottom .bttn {
    margin-top: 1rem;
    width: 100%;
  }
}
/* ==========================================================================
   Tablet styles
   ========================================================================== */

@media only screen and (min-width : 768px) {
  .siteForm:after,
  .generatedForm:after {
    content: ".";
    display: block;
    height: 0;
    clear: both;
    visibility: hidden;
    *zoom: 1;
  }
  .siteForm .formTop,
  .generatedForm .formTop {
    float: left;
    width: 47.5%;
    padding: 1% 2% 1% 0;
    border-right: 1px solid #e6ebf0;
  }
  .siteForm .formBottom,
  .generatedForm .formBottom {
    float: left;
    width: 48%;
    padding: 1% 0 1% 2%;
  }
  .siteForm .row,
  .generatedForm .row {
    padding: 0;
    clear: left;
    min-height: 47px;
    /* row with selectbox */
  
    /* row with radiobuttons */
  
    /* row with a checkbox */
  
  }
  .siteForm .row h3,
  .generatedForm .row h3 {
    margin-top: 0;
  }
  .siteForm .row > label,
  .generatedForm .row > label {
    line-height: normal;
    display: block;
    margin: 0 0 1%;
    font-weight: 700;
    font-size: 12px;
    cursor: pointer;
  }
  .siteForm .row.halfWidth,
  .generatedForm .row.halfWidth {
    float: left;
    vertical-align: top;
    width: 47.5%;
    clear: none;
  }
  .siteForm .row.halfWidth + .halfWidth,
  .generatedForm .row.halfWidth + .halfWidth {
    margin-left: 5%;
  }
  .siteForm .row input[type="text"],
  .generatedForm .row input[type="text"],
  .siteForm .row input[type="email"],
  .generatedForm .row input[type="email"],
  .siteForm .row input[type="tel"],
  .generatedForm .row input[type="tel"],
  .siteForm .row input[type="number"],
  .generatedForm .row input[type="number"],
  .siteForm .row input[type="password"],
  .generatedForm .row input[type="password"],
  .siteForm .row input[type="file"],
  .generatedForm .row input[type="file"],
  .siteForm .row textarea,
  .generatedForm .row textarea,
  .siteForm .row .fakeFileInput,
  .generatedForm .row .fakeFileInput {
    padding: 4px 1.5%;
  }
  .siteForm .row input[type="text"]::-webkit-input-placeholder,
  .generatedForm .row input[type="text"]::-webkit-input-placeholder,
  .siteForm .row input[type="email"]::-webkit-input-placeholder,
  .generatedForm .row input[type="email"]::-webkit-input-placeholder,
  .siteForm .row input[type="tel"]::-webkit-input-placeholder,
  .generatedForm .row input[type="tel"]::-webkit-input-placeholder,
  .siteForm .row input[type="number"]::-webkit-input-placeholder,
  .generatedForm .row input[type="number"]::-webkit-input-placeholder,
  .siteForm .row input[type="password"]::-webkit-input-placeholder,
  .generatedForm .row input[type="password"]::-webkit-input-placeholder,
  .siteForm .row input[type="file"]::-webkit-input-placeholder,
  .generatedForm .row input[type="file"]::-webkit-input-placeholder,
  .siteForm .row textarea::-webkit-input-placeholder,
  .generatedForm .row textarea::-webkit-input-placeholder,
  .siteForm .row .fakeFileInput::-webkit-input-placeholder,
  .generatedForm .row .fakeFileInput::-webkit-input-placeholder {
    visibility: hidden;
    color: transparent;
  }
  .siteForm .row input[type="text"]::-moz-placeholder,
  .generatedForm .row input[type="text"]::-moz-placeholder,
  .siteForm .row input[type="email"]::-moz-placeholder,
  .generatedForm .row input[type="email"]::-moz-placeholder,
  .siteForm .row input[type="tel"]::-moz-placeholder,
  .generatedForm .row input[type="tel"]::-moz-placeholder,
  .siteForm .row input[type="number"]::-moz-placeholder,
  .generatedForm .row input[type="number"]::-moz-placeholder,
  .siteForm .row input[type="password"]::-moz-placeholder,
  .generatedForm .row input[type="password"]::-moz-placeholder,
  .siteForm .row input[type="file"]::-moz-placeholder,
  .generatedForm .row input[type="file"]::-moz-placeholder,
  .siteForm .row textarea::-moz-placeholder,
  .generatedForm .row textarea::-moz-placeholder,
  .siteForm .row .fakeFileInput::-moz-placeholder,
  .generatedForm .row .fakeFileInput::-moz-placeholder {
    visibility: hidden !important;
    color: transparent;
  }
  .siteForm .row input[type="text"]:-moz-placeholder,
  .generatedForm .row input[type="text"]:-moz-placeholder,
  .siteForm .row input[type="email"]:-moz-placeholder,
  .generatedForm .row input[type="email"]:-moz-placeholder,
  .siteForm .row input[type="tel"]:-moz-placeholder,
  .generatedForm .row input[type="tel"]:-moz-placeholder,
  .siteForm .row input[type="number"]:-moz-placeholder,
  .generatedForm .row input[type="number"]:-moz-placeholder,
  .siteForm .row input[type="password"]:-moz-placeholder,
  .generatedForm .row input[type="password"]:-moz-placeholder,
  .siteForm .row input[type="file"]:-moz-placeholder,
  .generatedForm .row input[type="file"]:-moz-placeholder,
  .siteForm .row textarea:-moz-placeholder,
  .generatedForm .row textarea:-moz-placeholder,
  .siteForm .row .fakeFileInput:-moz-placeholder,
  .generatedForm .row .fakeFileInput:-moz-placeholder {
    visibility: hidden !important;
    color: transparent;
  }
  .siteForm .row input[type="text"]:-ms-input-placeholder,
  .generatedForm .row input[type="text"]:-ms-input-placeholder,
  .siteForm .row input[type="email"]:-ms-input-placeholder,
  .generatedForm .row input[type="email"]:-ms-input-placeholder,
  .siteForm .row input[type="tel"]:-ms-input-placeholder,
  .generatedForm .row input[type="tel"]:-ms-input-placeholder,
  .siteForm .row input[type="number"]:-ms-input-placeholder,
  .generatedForm .row input[type="number"]:-ms-input-placeholder,
  .siteForm .row input[type="password"]:-ms-input-placeholder,
  .generatedForm .row input[type="password"]:-ms-input-placeholder,
  .siteForm .row input[type="file"]:-ms-input-placeholder,
  .generatedForm .row input[type="file"]:-ms-input-placeholder,
  .siteForm .row textarea:-ms-input-placeholder,
  .generatedForm .row textarea:-ms-input-placeholder,
  .siteForm .row .fakeFileInput:-ms-input-placeholder,
  .generatedForm .row .fakeFileInput:-ms-input-placeholder {
    color: transparent;
  }
  .siteForm .row.inputtype-2 > label,
  .generatedForm .row.inputtype-2 > label {
    width: auto;
    float: none;
    margin: 0 0 1%;
    /*line-height: @lineHeight;*/
  
  }
  .siteForm .row.inputtype-2 .optionWrap,
  .generatedForm .row.inputtype-2 .optionWrap {
    width: auto;
    margin-left: 0;
  }
  .siteForm .row.inputtype-3 > label,
  .generatedForm .row.inputtype-3 > label {
    width: auto;
    float: none;
    line-height: 20px;
  }
  .siteForm .row.inputtype-3 .optionWrap,
  .generatedForm .row.inputtype-3 .optionWrap {
    width: auto;
    margin-left: 0;
  }
  .siteForm .row.inputtype-4,
  .generatedForm .row.inputtype-4 {
    padding: 3% 0 0;
  }
  .siteForm .row.type-checkbox,
  .generatedForm .row.type-checkbox {
    min-height: 0;
  }
  /*end .siteForm*/
}
.formButtons {
  margin: 15px 0 0;
}
@media only screen and (min-width : 768px) {
  .formButtons {
    margin: 30px 0 0;
  }
}
/* ==========================================================================
   Desktop styles
   ========================================================================== */

@media only screen and (min-width : 1180px) {
  .siteForm .row,
  .generatedForm .row {
    min-height: 47px;
  }
}
