/* Alter selects */
select {
  width: 100%;
  border: none;
  border-bottom: solid 1px #757575;
  padding-left: 5px;
  display: none;
}
select.ignore-input-style {
  display: block;
  border: 1px solid #a2a2a2;
  padding: 12px 20px 12px 10px;
}

.select-clone-value {
  background: transparent;
  padding: 8px 12px 8px 10px;
  min-height: 40px;
  width: 100%;
  border: none;
  border: 1px solid var(--defaultDarkGrey);
  background-color: var(--defaultWhite);
  color: var(--defaultBlack);
  display: flex;
  cursor: pointer;
}
.select-clone-value img {
  height: 24px;
  width: 24px;
  margin-right: 10px;
  object-fit: cover;
}
.select-clone-value.disabled {
  background-color: #f8f8f8;
  color: #808080;
  cursor: not-allowed;
}
.select-clone-value::after {
  content: "\f107";
  display: block;
  color: #8e8e8e;
  position: absolute;
  right: 15px;
  top: 10px;
  font-family: var(--fa-family-classic);
}
.select-clone-value.empty {
  color: #b1b1b1;
}

.select-clone {
  background-color: var(--defaultWhite);
  width: 100%;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  z-index: 110;
  box-shadow: 0px 0px 7px 0px rgba(50, 50, 50, 0.52);
  display: none;
  max-height: 300px;
  overflow: auto;
}
.select-clone .search {
  background-color: var(--defaultWhite);
}
.select-clone .search input[type=search] {
  padding: 5px;
  width: 100%;
  height: 41px;
  border: none;
  border-bottom: 1px solid var(--defaultDarkGrey);
}
.select-clone .option {
  display: flex;
  color: #747474;
  cursor: pointer;
}
.select-clone .option img {
  height: 24px;
  width: 24px;
  margin-right: 10px;
  object-fit: cover;
}
.select-clone .option:not(.disabled):hover {
  background-color: #e1f3ff;
}
.select-clone .option[hidden] {
  display: none;
}
.select-clone .option.disabled {
  color: #c4c4c4;
}

/* End Alter selects */
/* Radiobutton animation */
input:is([type=radio], [type=checkbox]) {
  padding: 0;
  height: auto;
  border: none;
  min-height: 0;
  float: left;
  display: none;
}

.radiobutton-clone {
  display: inline-block;
  padding: 12px 0 0 24px;
  cursor: pointer;
}
.radiobutton-clone::before {
  content: "";
  position: absolute;
  top: 4px;
  left: 0;
  width: 16px;
  height: 16px;
  background-color: transparent;
  border: 1px solid #999;
  border-radius: 14px;
  z-index: 1;
  transition: border-color 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}
.radiobutton-clone::after {
  content: "";
  position: absolute;
  top: 8px;
  left: 4px;
  width: 8px;
  height: 8px;
  background-color: var(--defaultBlue);
  border-radius: 50%;
  z-index: 2;
  transform: scale(0, 0);
  transition: transform 0.28s cubic-bezier(0.4, 0, 0.2, 1);
}
.radiobutton-clone.checked::before {
  border-color: var(--defaultBlue);
}
.radiobutton-clone.checked::after {
  transform: scale(1, 1);
}

/* End Radiobutton animation */
/* checkbox animation */
input[type=checkbox] {
  display: none;
}

.checkbox-clone {
  transition: var(--shortTransition);
  transition-property: background-color, border-color;
  display: inline-block;
  width: 16px;
  height: 16px;
  border: 2px solid #999;
  top: 3px;
  position: absolute;
  cursor: pointer;
}
.checkbox-clone:not(.disabled):hover {
  border: 2px solid #999;
}
.checkbox-clone.checked {
  background-color: var(--defaultBlue);
  border-color: var(--defaultBlue);
}
.checkbox-clone.checked:not(.disabled):hover {
  border-color: var(--defaultBlue);
}
.checkbox-clone.disabled {
  background-color: #636363;
  border-color: #636363;
}
.checkbox-clone::after {
  content: "";
  position: absolute;
  width: 12px;
  height: 5px;
  border-bottom: 2px solid var(--defaultWhite);
  border-left: 2px solid var(--defaultWhite);
  top: 3px;
  transform-origin: bottom-left;
  opacity: 0;
  transition: var(--shortTransition);
  transition-property: opacity, transform;
}
.checkbox-clone.checked::after {
  opacity: 1;
  transform: rotate(-45deg);
}

/* end checkbox animation */
/* buttons */
[rel=button] {
  display: inline-block;
  padding: 5px 15px;
  background-color: #a2a2a2;
  color: var(--defaultWhite);
  transition: var(--shortTransition);
  transition-property: background-color, color;
}

.article.my-contact-info-wrap .btn-add,
.input-wrap .input input[type=submit] {
  background-color: #a2a2a2;
  color: var(--defaultWhite);
  transition: var(--shortTransition);
  transition-property: background-color, color;
}

[rel=button]:hover,
.article.my-contact-info-wrap .btn-add:hover,
.select-clone .option.selected.selected,
.input-wrap .input input[type=submit]:hover {
  background-color: #419cd5;
  color: var(--defaultWhite);
}

/* Forms */
#login-form .input-wrap .input input,
.select-clone .option {
  padding: 7px 10px 5px 10px;
  border-radius: 0px;
  min-height: 40px;
}

label.controle-tegen-niet-mensen {
  position: absolute;
  margin-left: -5000px;
}

.form-row .input-wrap:last-child:not(:first-child), .form-row .input-wrap.width-100:last-child:first-child {
  padding-right: 0px;
}
.form-row .start-repeat-items {
  border: dashed 1px var(--defaultDarkGrey);
  padding: 10px;
}
.form-row .start-repeat-items .repeat-block {
  width: 100%;
  padding: 10px;
  background-color: var(--defaultDarkGrey);
  position: relative;
}
.form-row .start-repeat-items .repeat-block:not(:first-child) {
  margin-top: 10px;
}
.form-row .start-repeat-items .repeat-block .remove {
  position: absolute;
  top: 3px;
  right: 5px;
  cursor: pointer;
}
.form-row .start-repeat-items .repeat-block:first-child .remove {
  display: none;
}
.form-row .add-repeat-button {
  text-align: center;
  padding: 20px;
  cursor: pointer;
  background-color: var(--defaultLightGrey);
  margin-top: 10px;
  text-transform: uppercase;
  transition: var(--shortTransition);
  transition-property: background-color;
}
.form-row .add-repeat-button:hover {
  background-color: var(--defaultDarkGrey);
}

form fieldset {
  margin: 15px 0;
  padding: 20px;
}

.input-wrap {
  position: relative;
  margin: 3px 0px 5px 0px;
  padding-right: 10px;
}
.input-wrap[data-name=verborgenveld] {
  display: none;
}
.input-wrap .label {
  width: 100%;
  padding-bottom: 5px;
}
.input-wrap .label.hide {
  display: none;
}
.input-wrap .input {
  float: left;
  width: 100%;
  position: relative;
}
.input-wrap .input > .tooltip {
  position: absolute;
  right: 1px;
  top: 1px;
  bottom: 1px;
  width: 30px;
  text-align: center;
}
.input-wrap .input > .tooltip > [data-toggle=tooltip] {
  color: #5a5a5a;
}
.input-wrap .input.field-type-numeric > .tooltip {
  position: absolute;
  right: 25px;
  top: 1px;
  bottom: 1px;
  width: 30px;
  text-align: center;
}
.input-wrap .input.field-type-radio > .tooltip > [data-toggle=tooltip], .input-wrap .input.field-type-checkbox > .tooltip > [data-toggle=tooltip] {
  margin-top: 0;
}
.input-wrap .input.field-type-file > .tooltip > [data-toggle=tooltip], .input-wrap .input.field-type-input > .tooltip > [data-toggle=tooltip], .input-wrap .input.field-type-phone > .tooltip > [data-toggle=tooltip], .input-wrap .input.field-type-email > .tooltip > [data-toggle=tooltip] {
  margin-top: 9px;
}
.input-wrap .input.field-type-numeric > .tooltip > [data-toggle=tooltip], .input-wrap .input.field-type-price > .tooltip > [data-toggle=tooltip], .input-wrap .input.field-type-website > .tooltip > [data-toggle=tooltip] {
  margin-top: 10px;
}
.input-wrap .input.field-type-agreement .label, .input-wrap .input.field-type-mailchimp .label, .input-wrap .input.field-type-checkbox .label, .input-wrap .input.field-type-radio .label, .input-wrap .input.field-type-mailerlite .label {
  padding-left: 25px;
}
.input-wrap .input input,
.input-wrap .input textarea {
  padding: 7px 10px 5px 10px;
  border-radius: 0px;
  min-height: 40px;
  border: solid 1px var(--defaultDarkGrey);
  width: 100%;
  -webkit-appearance: none;
  font-family: inherit;
  line-height: inherit;
}
.input-wrap .input input::placeholder,
.input-wrap .input textarea::placeholder {
  color: var(--defaultDarkGrey);
}
.input-wrap .input textarea {
  resize: vertical;
}
.input-wrap .input textarea:focus,
.input-wrap .input input:not([type=button], [type=checkbox], [type=color], [type=file], [type=radio], [type=range], [type=reset], [type=submit]):focus {
  border-bottom: solid 1px #4779af;
}
.input-wrap .input div.prefix {
  display: inline-block;
  position: absolute;
  padding: 10px 8px 9px 8px;
  top: 0;
  bottom: 0;
  width: 30px;
}
.input-wrap .input.field-type-phone div.prefix {
  padding-top: 10px;
  padding-left: 10px;
}
.input-wrap .input div.prefix > i {
  color: inherit;
}
.input-wrap .input div.prefix ~ input {
  padding-left: 35px;
}
.input-wrap .input .text-block {
  margin-bottom: 0;
}
.input-wrap .input input[type=submit] {
  width: auto;
  padding: 5px 25px;
  float: right;
  border: 0px;
}
.input-wrap .text-block.text-alignment-left {
  text-align: left;
}
.input-wrap .text-block.text-alignment-center {
  text-align: center;
}
.input-wrap .text-block.text-alignment-right {
  text-align: right;
}

.article.widget-default-login input:not([type=button], [type=checkbox], [type=color], [type=file], [type=radio], [type=range], [type=reset], [type=submit]), .article.shoppingCart-wrap .popup-my-addresses .address-wrap input, .article.my-password .content input:not([type=button], [type=checkbox], [type=color], [type=file], [type=radio], [type=range], [type=reset], [type=submit]), .article.filter-inputs-wrap input {
  border: solid 1px var(--defaultDarkGrey);
  width: 100%;
  -webkit-appearance: none;
  font-family: inherit;
  line-height: inherit;
}
.article.shoppingCart-wrap .popup-my-addresses .address-wrap input::placeholder, .article.my-password input:not([type=button], [type=checkbox], [type=color], [type=file], [type=radio], [type=range], [type=reset], [type=submit])::placeholder, .article.filter-inputs-wrap input::placeholder {
  color: var(--defaultDarkGrey);
}
.article.shoppingCart-wrap .popup-my-addresses .address-wrap input:focus, .article.my-password input[type=password]:focus, .article.filter-inputs-wrap input:focus {
  border-bottom: solid 1px #4779af;
}
.article.widget-default-login .form-holder input:not([type=button], [type=checkbox], [type=color], [type=file], [type=radio], [type=range], [type=reset], [type=submit]), .article.shoppingCart-wrap .popup-my-addresses .address-wrap input, .article.my-password input[type=password], .article.filter-inputs-wrap input {
  padding: 7px 10px 5px 10px;
  border-radius: 0px;
  min-height: 40px;
}
.article.widget-default-login .form-holder fieldset > .login-row > .input-wrap > .input.field-type-password > input {
  padding-right: 40px;
}
.article.shoppingCart-wrap .popup-my-addresses .my-addresses-wrap .address-wrap .use .button-use, .article.shoppingCart-wrap .popup-my-addresses .address-wrap .button-add-address, .article.shoppingCart-wrap .popup-my-addresses .address-wrap .button-edit-address, .article.my-order-detail .reorder-button .button, .article.my-contact-info-wrap .btn-int, .article.my-contact-info-wrap .user-view > .edit-user-content > .content input[type=submit], .article.widget-default-login .form-holder fieldset > .submit-wrap > #login-submit-button, .article.widget-default-login .form-holder fieldset > .submit-wrap > #forgot-password-submit-button, .article.widget-default-login .form-holder .buttons > .submit-wrap > .new-account-submit-button, .article.widget-default-login .form-holder fieldset > .submit-wrap > .go-to-create-button {
  border: none;
  background-color: var(--defaultBlue);
  color: var(--defaultWhite);
  display: inline-block;
  padding: 10px 20px;
  text-align: center;
  cursor: pointer;
  width: 50%;
  transition: background-color var(--shortTransition);
}
.article.shoppingCart-wrap .popup-my-addresses .my-addresses-wrap .address-wrap .use .button-use:hover, .article.shoppingCart-wrap .popup-my-addresses .address-wrap .button-add-address:hover, .article.shoppingCart-wrap .popup-my-addresses .address-wrap .button-edit-address:hover, .article.my-order-detail .reorder-button .button:hover, .article.my-contact-info-wrap .btn-int:hover, .article.my-contact-info-wrap .user-view > .edit-user-content > .content input[type=submit]:hover, .article.widget-default-login .form-holder fieldset > .submit-wrap > #login-submit-button:hover, .article.widget-default-login .form-holder fieldset > .submit-wrap > #forgot-password-submit-button:hover, .article.widget-default-login .form-holder .buttons > .submit-wrap > .new-account-submit-button:hover, .article.widget-default-login .form-holder fieldset > .submit-wrap > .go-to-create-button:hover {
  background-color: #064180;
}
.article.shoppingCart-wrap .popup-my-addresses .address-wrap .button-add-address,
.article.shoppingCart-wrap .popup-my-addresses .address-wrap .button-edit-address {
  float: left;
  min-width: 150px;
  padding: 8px;
  width: auto;
}
.article.shoppingCart-wrap .popup-my-addresses .my-addresses-wrap .address-wrap .use .button-use {
  width: 100%;
  padding: 8px;
}
.article.my-contact-info-wrap .btn-int {
  font-size: var(--smallerFontSize);
  padding: 8px 45px;
  min-width: 150px;
  width: auto;
}
.article.my-order-detail .reorder-button .button {
  float: right;
  font-size: var(--smallerFontSize);
  width: auto;
}
.article.configuratorDetail-wrap .product-content .favorite-login-icon,
.article.configuratorDetail-wrap .product-content .favorite-icon, .article.item-catalogus-detail .product-content .favorite-login-icon,
.article.item-catalogus-detail .product-content .favorite-icon, .article.item-catalogus-list .favorite-login-icon,
.article.item-catalogus-list .favorite-icon {
  color: black;
  font-size: 20px;
  font-weight: 300;
  top: 10px;
  right: 10px;
  left: auto;
  position: absolute;
  z-index: 1;
  cursor: pointer;
  text-align: right;
  border-radius: 50%;
  box-shadow: 0 2px 4px -2px rgba(17, 34, 68, 0.2);
  background-color: var(--defaultWhite);
  width: 32px;
  height: 32px;
  display: flex;
  justify-content: center;
  align-items: center;
  transition: var(--shortTransition);
  transition-property: border-radius, box-shadow;
  border: none;
}
.article.configuratorDetail-wrap .product-content .favorite-login-icon i,
.article.configuratorDetail-wrap .product-content .favorite-icon i, .article.item-catalogus-detail .product-content .favorite-login-icon i,
.article.item-catalogus-detail .product-content .favorite-icon i, .article.item-catalogus-list .favorite-login-icon i,
.article.item-catalogus-list .favorite-icon i {
  margin-top: 2px;
}
.article.configuratorDetail-wrap .product-content .favorite-login-icon:hover,
.article.configuratorDetail-wrap .product-content .favorite-icon:hover, .article.item-catalogus-detail .product-content .favorite-login-icon:hover,
.article.item-catalogus-detail .product-content .favorite-icon:hover, .article.item-catalogus-list .favorite-login-icon:hover,
.article.item-catalogus-list .favorite-icon:hover {
  box-shadow: 0 2px 4px 0px rgba(17, 34, 68, 0.2);
}
.article.configuratorDetail-wrap .product-content .favorite-login-icon:active,
.article.configuratorDetail-wrap .product-content .favorite-icon:active, .article.item-catalogus-detail .product-content .favorite-login-icon:active,
.article.item-catalogus-detail .product-content .favorite-icon:active, .article.item-catalogus-list .favorite-login-icon:active,
.article.item-catalogus-list .favorite-icon:active {
  box-shadow: 0 0px 0px 3px rgba(17, 34, 68, 0.2);
  font-size: var(--biggerFontSize);
}
.article.configuratorDetail-wrap .product-content .favorite-icon .active, .article.item-catalogus-detail .product-content .favorite-icon .active, .article.item-catalogus-list .favorite-icon .active {
  color: var(--defaultBlue);
}

/* End Forms */
/* Error message */
.input-wrap .input .field-error {
  border-bottom: 2px solid #c95456;
}

.input-error .select-clone-value,
.checkbox-clone.input-error,
.input-error > .input input,
.input-error > .input textarea,
.radiobutton-clone.input-error,
.field-type-radio.input-error input[type=radio]::before {
  border-color: var(--defaultRed);
}

/* End Error message */
/* styling the checkbox animation */
.animate-success-tip {
  animation: 0.75s ease 0s normal none 1 running animate-success-tip;
}

.animate-success-long {
  animation: 0.75s ease 0s normal none 1 running animate-success-long;
}

.article.item-form .form-succes .icon.success.animate::after {
  animation: 4.25s ease-in 0s normal none 1 running rotatePlaceholder;
}

@keyframes animate-success-tip {
  0% {
    left: 1px;
    top: 19px;
    width: 0;
  }
  54% {
    left: 1px;
    top: 19px;
    width: 0;
  }
  70% {
    left: -8px;
    top: 37px;
    width: 50px;
  }
  84% {
    left: 21px;
    top: 48px;
    width: 17px;
  }
  100% {
    left: 14px;
    top: 45px;
    width: 25px;
  }
}
@keyframes animate-success-long {
  0% {
    right: 46px;
    top: 54px;
    width: 0;
  }
  65% {
    right: 46px;
    top: 54px;
    width: 0;
  }
  84% {
    right: 0;
    top: 35px;
    width: 55px;
  }
  100% {
    right: 8px;
    top: 38px;
    width: 47px;
  }
}
@keyframes rotatePlaceholder {
  0% {
    transform: rotate(-45deg);
  }
  5% {
    transform: rotate(-45deg);
  }
  12% {
    transform: rotate(-405deg);
  }
  100% {
    transform: rotate(-405deg);
  }
}
/* End styling the checkbox animation */
/* Grade A */
/* Grade B */
/* Grade C */
@media (max-width: 767px) {
  .select-clone-value {
    padding-top: 8px;
    padding-bottom: 8px;
  }
}
/* Grade D */
@media (max-width: 479px) {
  form .form-row > .input-wrap,
  form .form-row > fieldset .input-wrap,
  form .form-row > .start-repeat-items .repeat-block .input-wrap {
    width: 100%;
    padding-right: 0;
  }
}

/*# sourceMappingURL=elements.css.map */