:root{
    --lithoss-black: #272727;
	--lithoss-black-light5: #a09997; /* black on grey background with opacity 0,5 */
	--lithoss-black-light1: #ddd4d0;
	--lithoss-black-light2: #B4ADAB;
    --lithoss-grey: #F0E7E2;
    --lithoss-orange: #F5E4CA;
	--lithoss-red: #D93624;
	--lithoss-red-light5: #FEEFED;
}

html,body{margin:0;padding:0;width:100%;height:100%;scroll-behavior: auto!important;}
body{overflow-x: hidden;background-color:var(--lithoss-grey); font-family: "Degular-text", "Degular", "Helvetica Neue", "Open Sans", sans-serif;}
body.noscroll{overflow-y:hidden;}

/* HEADER - FOOTER */
.background-dark{background:var(--lithoss-black);color:var(--lithoss-grey);}
.header{width:100%;display:flex;justify-content: space-between;align-items: flex-end;flex-wrap: wrap;margin-top:15px;margin-bottom:15px;}
.header .logo{width: 200px;padding:10px 15px 10px 0;}
.header .logo img{width:100%;}
.header .nav{max-width:calc(100% - 200px);}
.header .nav a{display: inline-block;text-transform: uppercase;padding: 10px 12px;font-size:14px;font-weight:500;color:var(--lithoss-grey);text-decoration: none;}
.header .nav a.button{border:1px solid var(--lithoss-grey);padding: 10px 24px;margin-left:12px;}
@media (max-width: 767px){
	.header{flex-direction: column;align-items: center;}
	.header .nav{max-width:100%;margin-top: 25px;}
}
@media (max-width: 575px){
	.header .nav a{padding: 7px 5px;}
	.header .nav a.button{margin-left:5px;}
}

/* GENERAL (EACH PAGE) */
h1{text-align:center;font-size:45px;font-weight: 500;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;color:var(--lithoss-black);letter-spacing: 1px;}
h2{text-align:center;font-size:30px;font-weight: 500;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;color:var(--lithoss-black);letter-spacing: 1px;}
.navigation-container{width: 80%;margin:auto;}
.navigation-container .navigation-item{width:calc(100% / 6);}
.navigation-container .navigation-item .step-indicator{width: 100%;display: flex;align-items: center;}
.navigation-container .navigation-item .step-indicator span{display:flex;justify-content: center;align-items: center; background-image:none;width:30px;height:30px;border:2px solid var(--lithoss-black-light5);overflow:hidden;padding:2px;}
.navigation-container .navigation-item.active .step-indicator span, .navigation-container .navigation-item.visited .step-indicator span{background-image:none;}
.navigation-container .navigation-item .step-indicator span>span{display:none;visibility: hidden;}
.navigation-container .navigation-item.active .step-indicator span>span, .navigation-container .navigation-item.visited .step-indicator span>span{display: inline-block;visibility: visible; background-color:var(--lithoss-black);width: 100%;height: 100%;border: none;padding: 0;border:none;}
.navigation-container .navigation-item .step-indicator:before, .navigation-container .navigation-item .step-indicator:after{width:calc((100% - 30px) / 2);border:none;border-top:2px solid var(--lithoss-black);}
.navigation-container .navigation-item .step-description{color:var(--lithoss-black-light5);padding:0 10px;max-width: none;}
.navigation-container .navigation-item.active .step-description, .navigation-container .navigation-item.available .step-description, .navigation-container .navigation-item.visited .step-description{color:var(--lithoss-black);}
.navigation-container .navigation-item .step-number span{border:1px solid var(--lithoss-black-light5);color:var(--lithoss-black-light5);padding:5px 20px;}
.navigation-container .navigation-item.active .step-number span, .navigation-container .navigation-item.available .step-number span, .navigation-container .navigation-item.visited .step-number span{border-color:var(--lithoss-black);color:var(--lithoss-black);}


.extra-nav .button{display:inline-flex;flex-wrap: wrap;justify-content:center;padding:0 15px;margin:0 10px;background-color:transparent;cursor:default;border-radius:0;border:1px solid var(--lithoss-black-light5);transition: all .15s ease-out;}
.extra-nav .button.active, .extra-nav .button.active:hover{background-color:transparent; color:var(--lithoss-black);border:1px solid var(--lithoss-black);cursor:pointer;}
.extra-nav .button span.text{font-size:14px;font-weight:600;color:var(--lithoss-black-light5);text-transform:uppercase;padding:10px 0;transition: all .15s ease-out;}
.extra-nav .button.active span.text, .extra-nav .button.active:hover span.text{color:var(--lithoss-black);}
.extra-nav .button-left span.text{padding-left:15px;}
.extra-nav .button-right span.text{padding-right:15px;}
.extra-nav .button span.chevron{display: inline-flex;align-items: center;line-height:0;transition: all .15s ease-out;}
.extra-nav .button-left.active:hover span.chevron{padding-right:15px;border-right:1px solid var(--lithoss-black);}
.extra-nav .button-right.active:hover span.chevron{padding-left:15px;border-left:1px solid var(--lithoss-black);}
.extra-nav .button span.chevron svg{fill: var(--lithoss-black-light5);transition: all .15s ease-out;}
.extra-nav .button.active span.chevron svg, .extra-nav .button.active:hover span.chevron svg{fill: var(--lithoss-black);}
.extra-nav .legal{margin-top: 10px;font-style: italic;color: var(--lithoss-black-light5);font-size:13px;}

@media (max-width: 991px){.navigation-container{width: 100%;}}
@media (max-width: 767px){.navigation-container .navigation-item .step-number span{padding:5px 10px;}}

/* COLLECTIE SELECTIE */
#selectCollection .flex{justify-content: center;flex-wrap:wrap;}
#selectCollection .flex .collectie-item{width: calc(100% / 5 - 20px);margin:0 10px;flex: 0 1 auto;border:1px solid transparent;background-color:rgba(255,255,255,0.5);padding:0;}
#selectCollection .flex .collectie-item:hover, #selectCollection .flex .collectie-item.active{border-color:var(--lithoss-black);}
#selectCollection .flex .collectie-item img{width:100%;margin-bottom:15px;}
#selectCollection .flex .collectie-item p{padding:0 15px;font-weight: 600;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;}
#selectCollection .flex .collectie-item p.description{padding-top:10px;padding-bottom:15px;font-weight: 400;font-family: "Degular-text", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0;}
@media (max-width: 991px){#selectCollection .flex .collectie-item{width: calc(100% / 3 - 20px);margin-bottom: 25px;}}
@media (max-width: 575px){#selectCollection .flex .collectie-item{width: calc(100% / 2 - 20px);}}
@media (max-width: 450px){
	#selectCollection .flex .collectie-item{width: calc(100% - 20px);}
	#selectCollection .flex .collectie-item p{font-size:18px;}
	#selectCollection .flex .collectie-item p.description{font-size:16px;}
}

/* FRAME SELECTIE */
.frame-group .frame-optie{border:1px solid transparent;flex:none;}
.frame-group .frame-optie:hover, .frame-group .frame-optie.active{border-color:var(--lithoss-black);}
.frame-group .frame-optie .frame-container{background-color:rgba(255,255,255,0.5);}
.frame-group .frame-optie .frame-container .frame{background-color:var(--lithoss-black-light1);}
.frame-group .frame-optie[data-type^=floating] .frame-container{box-shadow: 3px 3px 11px 0px rgba(120,115,113,0.8);}
/*.frame-group .frame-optie[data-type^=floating] .frame-container{box-shadow: 10px 10px 33px 0px rgba(120,115,113,0.8);}. => FLOATING BIG FRAME */
#selectFrames .frame-position-choise .frame-position-optie{background-color:rgba(255,255,255,0.5);border:1px solid transparent;padding:15px 25px;}
#selectFrames .frame-position-choise .frame-position-optie.active, #selectFrames .frame-position-choise .frame-position-optie:hover{border:1px solid var(--lithoss-black);padding:15px 25px;}
#frame-samenstelling[data-type^=floating] .frame-container{box-shadow: 10px 10px 33px 0px rgba(120,115,113,0.8);}
@media (max-width: 991px){.frame-group .frame-optie{width:calc(100% / 3 - 30px);}}
@media (max-width: 767px){.frame-group .frame-optie{width:calc(100% / 2 - 30px);}}
@media (max-width: 450px){.frame-group .frame-optie{width:calc(100% - 30px);}}

/* MODULE SELECTIE */
#selectModules .module-item{width:calc(100% / 8);}
#selectModules .module-item .module-item-box{background-color:rgba(255,255,255,0.5);border: 1px solid var(--lithoss-black);}
#selectModules .module-item .module-item-box.active, #selectModules .module-item:hover .module-item-box{border: 2px solid var(--lithoss-black);margin:1px;}
#selectModules .module-item .module-item-box + p, #selectModules .module-item .module-item-box + p{font-weight: 400;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;color:var(--lithoss-black);}
#selectModules .module-item .module-item-box.active + p, #selectModules .module-item:hover .module-item-box + p{font-weight: 600;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;color:var(--lithoss-black);}
#frame-samenstelling .frame-container{background-color:rgba(255,255,255,0.5);border: 1px solid var(--lithoss-black);}
#frame-samenstelling .frame-container .frame{background-color: var(--lithoss-black-light1);}
#frame-samenstelling .frame-container .frame:hover, #frame-samenstelling .frame-container .frame.hover, #frame-samenstelling .frame-container .frame.active{border:2px solid var(--lithoss-black);cursor:pointer;}
@keyframes firstTime { from {border-color: transparent;} to {border-color: var(--lithoss-black);}}
#frame-samenstelling .frame-container .frame.first-time{border:2px dashed var(--lithoss-black);}
#frame-samenstelling .frame-fields .frame-field-container select{background-color:rgba(255,255,255,0.5);}
@media (max-width: 991px){#selectModules .module-item{width:calc(100% / 6);}}
@media (max-width: 767px){#selectModules .module-item{width:calc(100% / 4);}}
@media (max-width: 575px){#selectModules .module-item{width:calc(100% / 3);}}
@media (max-width: 450px){#selectModules .module-item{width:calc(100% / 2);}}

/* FINISH SELECTIE */
.frame-box.disabled #frame-samenstelling .frame-container .frame{background-color:transparent;}
.frame-box.disabled #frame-samenstelling .frame-fields .frame-field-container select{background-color: rgba(255,255,255,0.5);border-color: var(--lithoss-black-light5);color: var(--lithoss-black-light5);}
#selectAfwerking .afwerkingsopties .afwerkingsoptie{max-width: 275px;background-color:rgba(255,255,255,0.5);border:1px solid transparent;padding:15px 25px;}
#selectAfwerking .afwerkingsopties .afwerkingsoptie:hover, #selectAfwerking .afwerkingsopties .afwerkingsoptie.active{border:1px solid var(--lithoss-black);padding:15px 25px;}
#selectAfwerking .afwerkingsopties .afwerkingsoptie p{font-weight: 600;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;color:var(--lithoss-black);}
#selectAfwerking .afwerkingsoverzicht h2{font-weight: 600;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;color:var(--lithoss-black);font-size:17px;}
#selectAfwerking .afwerkingsoverzicht .finish-options .afwerking-item .afwerking-item-box{background-color:rgba(255,255,255,1);border: 1px solid transparent;}
#selectAfwerking .afwerkingsoverzicht[id^=immix] .finish-options .afwerking-item .afwerking-item-box{background-color:transparent;}
#selectAfwerking .afwerkingsoverzicht .finish-options .afwerking-item.active .afwerking-item-box, #selectAfwerking .afwerkingsoverzicht .finish-options .afwerking-item:hover .afwerking-item-box{border: 2px solid var(--lithoss-black);margin:1px;width:calc(100% - 2px);}
#selectAfwerking .afwerkingsoverzicht#uni{width:100%;float:none;}
#selectAfwerking .afwerkingsoverzicht .finish-options .afwerking-item .afwerking-item-box + p, #selectAfwerking .afwerkingsoverzicht .finish-options .afwerking-item .afwerking-item-box + p{font-weight: 400;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;color:var(--lithoss-black);}
#selectAfwerking .afwerkingsoverzicht .finish-options .afwerking-item.active .afwerking-item-box + p, #selectAfwerking .afwerkingsoverzicht .finish-options .afwerking-item:hover .afwerking-item-box + p{font-weight: 600;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;color:var(--lithoss-black);}
#selectAfwerking .loading img {width: 45px;margin-left: 0;margin-right: 7px;}


/* GRAVURES */
#selectGravures table tr th{font-weight: 600;font-family: "Degular-display", "Degular", "Helvetica Neue", "Open Sans", sans-serif;letter-spacing: 0.5px;color:var(--lithoss-black);}
#selectGravures table span{background-color:rgba(255,255,255,0.5);}
#selectGravures table.engravings td a.add-engraving-button span{background-color:transparent;width:auto;position:relative;padding-top:0;display:inline-block;}
#selectGravures table.engravings td a.add-engraving-button{display:inline-flex;flex-wrap: wrap;justify-content:center;padding:0 15px;margin:0;background-color:transparent;cursor:pointer;border-radius:0;border:1px solid var(--lithoss-black);transition: all .15s ease-out;color:var(--lithoss-black);}
#selectGravures table.engravings td a.add-engraving-button:hover{background-color:transparent; color:var(--lithoss-black);border:1px solid var(--lithoss-black);cursor:pointer;}
#selectGravures table.engravings td a.add-engraving-button span.text{width:auto;font-size:14px;font-weight:600;color:var(--lithoss-black);text-transform:uppercase;padding:10px 0;transition: all .15s ease-out;padding-left:15px;}
#selectGravures table.engravings td a.add-engraving-button span.chevron{display: inline-flex;align-items: center;line-height:0;transition: all .15s ease-out;}
#selectGravures table.engravings td a.add-engraving-button:hover span.chevron{padding-right:15px;border-right:1px solid var(--lithoss-black);}
#selectGravures table.engravings td a.add-engraving-button img{position: relative;margin-right:0;}
#selectGravures table.engravings td.symbol img {border: 1px solid var(--lithoss-black-light5);background-color: rgba(255, 255, 255, 0.5);}
#selectGravures table.engravings td.buttons a{display: inline-flex;border:1px solid var(--lithoss-black);color:var(--lithoss-black);border-radius:0;justify-content: center;align-items: center;}
#gravure-popup .inner .engraving-options .option.active, #gravure-popup .inner .engraving-options .option:hover{border: 2px solid var(--lithoss-black);}
#gravure-popup .inner .symbols .symbol{background-color:rgba(255,255,255,0.5);padding:0;}
#gravure-popup .inner .symbols .symbol:hover, #gravure-popup .inner .symbols .symbol.active{border: 2px solid var(--lithoss-black);}


#gravure-popup .inner{background-color:var(--lithoss-grey);}
#gravure-popup .inner select{background-color:transparent;border-color:var(--lithoss-black);}
#gravure-popup .inner .buttons{background-color:transparent;}
#gravure-popup .inner .buttons .button{display:inline-flex;flex-wrap: nowrap;justify-content:center;padding:0 15px;margin:0 10px;background-color:transparent !important;border-radius:0;transition: all .15s ease-out;color:var(--lithoss-black) !important;border:1px solid var(--lithoss-black) !important;cursor:pointer;width:auto;}
#gravure-popup .inner .buttons .button span.text{font-size:14px;font-weight:600;color:var(--lithoss-black);text-transform:uppercase;padding:10px 0;transition: all .15s ease-out;}
#gravure-popup .inner .buttons .button#close-engraving-popup span.text{padding-left:15px;}
#gravure-popup .inner .buttons .button#save-engraving-popup span.text{padding-right:15px;}
#gravure-popup .inner .buttons .button span.chevron{display: inline-flex;align-items: center;line-height:0;transition: all .15s ease-out;}
#gravure-popup .inner .buttons .button#close-engraving-popup:hover span.chevron{padding-right:15px;border-right:1px solid var(--lithoss-black);}
#gravure-popup .inner .buttons .button#save-engraving-popup:hover span.chevron{padding-left:15px;border-left:1px solid var(--lithoss-black);}
#gravure-popup .inner .buttons .button span.chevron svg{fill: var(--lithoss-black);transition: all .15s ease-out;}

#saveToQuotation input#quantity{border:2px solid var(--lithoss-black) !important;}

/* QUOTATION */
p.intro{font-size: 18px;color:var(--lithoss-black);text-align: center;line-height:1.2;}
p.intro a{font-size: 18px;color:var(--lithoss-black);text-align: center;line-height:1.2;text-decoration: underline;}
#order-overview .configurations .configuration-preview .frame-container{display:inline-flex;background-color:rgba(255,255,255,0.5);}
#order-overview .configurations .configuration-preview .frame-container[data-collection="CI"]{border-radius:500px;}
#order-overview .configurations .configuration-preview .frame-container.floating{box-shadow: 2px 2px 11px 0px rgba(120, 115, 113, 0.8);}
#order-overview .configurations table tr th{width:1px;white-space: nowrap;}
#order-overview .configurations table tr td.total_price, #order-overview .configurations table tr td.unit_price, #order-overview .configurations table tr td.total{width: 1px;white-space: nowrap;}
#order-overview .configurations .details{width:auto;}
#order-overview .configurations .legal{color:var(--lithoss-black-light5);line-height:1.2;}

#order-overview .waiting{display: inline-flex;align-items: center;}
#order-overview .waiting img{width: 65px;margin-right: 10px;}
#order-overview .waiting p{font-size: 18px;color: var(--lithoss-black);}


form#bestelformulier .form-group{margin-bottom: 30px;}
form#bestelformulier label, form#bestelformulier label.error{font-weight: 600;font-size:14px;margin-bottom:4px;color:var(--lithoss-black);}
form#bestelformulier label .required{display:inline-block;margin-left:3px;color:var(--lithoss-red);}
form#bestelformulier input, form#bestelformulier textarea, form#bestelformulier select{background-color:transparent;border:1px solid transparent;border-radius: 0;border-bottom:1px solid var(--lithoss-black);padding:12px 0;font-size:16px;color:var(--lithoss-black);box-shadow:none;height:auto;transition:all 0.3s;outline:none;}
form#bestelformulier input:active, form#bestelformulier input:focus, form#bestelformulier textarea:active, form#bestelformulier textarea:focus, form#bestelformulier select:active, form#bestelformulier select:focus{box-shadow: none;border:1px solid var(--lithoss-black);border-radius: 5px;padding:12px;}
form#bestelformulier input.error, form#bestelformulier textarea.error, form#bestelformulier select.error{box-shadow: none;border:1px solid var(--lithoss-red);border-radius: 5px;padding:12px;background-color:var(--lithoss-red-light5);}
form#bestelformulier p.error{font-size: 12px;color:var(--lithoss-red) !important;padding:0 12px;}

#order-overview .configurations .details .form-group{margin-bottom:0;margin-top:20px;}
#order-overview .configurations .details .form-group label{width:100%;margin:0;}
#order-overview .configurations .details .form-group input{width: 100%;}
#order-overview .configurations .details .form-group.error input{box-shadow: none;border:1px solid var(--lithoss-red);border-radius: 5px;padding:12px;background-color:var(--lithoss-red-light5);}
#order-overview .configurations .details .form-group .legal{color:var(--lithoss-black-light5);line-height:1.2;font-size: 13px;padding:0;margin-bottom:4px;}
#order-overview .configurations table tr td.preview{min-width: 140px;}
#order-overview .configurations table tr td.aantal input{margin-top:20px;}
#order-overview .configurations table tr td.aantal .remove-item{margin-top: 30px;background-color:transparent;border:1px solid var(--lithoss-black);border-radius:0;display: inline-block;padding: 10px;color: var(--lithoss-black);line-height: 0;transition: all 0.5s;}
#order-overview .configurations table tr td.aantal .remove-item:hover{background-color:var(--lithoss-red);border-color:var(--lithoss-red);color:white;}
#order-overview .configurations span.different_finish{color:var(--lithoss-black-light5);line-height: 1.2;}
#order-overview .configurations table .on_request{font-style:italic;color:var(--lithoss-black-light5);line-height:1.2;font-size: 14px;padding:5px;}
#order-overview .configurations .legal.error{color:var(--lithoss-red);}

.checkboxfield{padding:0 15px;}
.checkboxfield input{display:none !important;}
.checkboxfield .checkbox{display: inline-block;margin:0;margin-right:15px;}
.checkboxfield .checkbox .checkbox-item label{padding:0;display: inline-flex;justify-content: center;cursor:pointer;}
.checkboxfield input + label span:first-child{width:18px !important;height:18px !important;background: none !important; border: 1px solid var(--lithoss-black);border-radius: 4px;margin-right:5px;}
.checkboxfield input + label span:first-child span{margin:2px;height:calc(100% - 4px) !important;width:calc(100% - 4px) !important;border-radius: 2px;border:none;display: flex !important;justify-content: center;align-items: center;}
.checkboxfield input:checked + label span:first-child span{background-color:var(--lithoss-black) !important;}
.checkboxfield .checkbox.radio input + label span:first-child{border-radius: 100%;}
.checkboxfield .checkbox.radio input + label span:first-child span{border-radius: 100%;}

form#bestelformulier .form-buttons .col-xs-12{display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}
form#bestelformulier .form-buttons .waiting{display: inline-flex;align-items: center;width:100%;justify-content: center;margin-bottom: 10px;}
form#bestelformulier .form-buttons  img{width: 40px;margin-right: 10px;}
form#bestelformulier .form-buttons  p{font-size: 16px;color: var(--lithoss-black);margin-bottom:0;}
form#bestelformulier .button{display:inline-flex;flex-wrap: wrap;justify-content:center;padding:0 15px;margin:0 10px;background-color:transparent;cursor:default;border-radius:0;border:1px solid var(--lithoss-black-light5);transition: all .15s ease-out;}
form#bestelformulier .button.active, .extra-nav .button.active:hover{background-color:transparent; color:var(--lithoss-black);border:1px solid var(--lithoss-black);cursor:pointer;}
form#bestelformulier .button span.text{font-size:14px;font-weight:600;color:var(--lithoss-black-light5);text-transform:uppercase;padding:10px 0;transition: all .15s ease-out;}
form#bestelformulier .button.active span.text, .extra-nav .button.active:hover span.text{color:var(--lithoss-black);}
form#bestelformulier .button-left span.text{padding-left:15px;}
form#bestelformulier .button-right span.text{padding-right:15px;}
form#bestelformulier .button span.chevron{display: inline-flex;align-items: center;line-height:0;transition: all .15s ease-out;}
form#bestelformulier .button-left.active:hover span.chevron{padding-right:15px;border-right:1px solid var(--lithoss-black);}
form#bestelformulier .button-right.active:hover span.chevron{padding-left:15px;border-left:1px solid var(--lithoss-black);}
form#bestelformulier .button span.chevron svg{fill: var(--lithoss-black-light5);transition: all .15s ease-out;}
form#bestelformulier .button.active span.chevron svg, .extra-nav .button.active:hover span.chevron svg{fill: var(--lithoss-black);}
form#bestelformulier p.error{margin-top: 10px;color: var(--lithoss-red);font-size:13px;}
form#bestelformulier .form-header{margin-top:50px;}


@media (max-width: 1199px){
	#order-overview .configurations .configuration-preview .frame-container .frame{width:60px;height:60px;}
}


.userpage{margin-top:40px;margin-bottom: 40px;}
form.userform .inputgroup{margin-bottom: 30px;}
form.userform label, form.userform label.error{font-weight: 600;font-size:14px;margin-bottom:4px;color:var(--lithoss-black);width: 100%;}
form.userform label .required{display:inline-block;margin-left:3px;color:var(--lithoss-red);}
form.userform input, form.userform textarea, form.userform select{background-color:transparent;border:1px solid transparent;border-radius: 0;border-bottom:1px solid var(--lithoss-black);padding:12px 0;font-size:16px;color:var(--lithoss-black);box-shadow:none;height:auto;transition:all 0.3s;outline:none;width:100%;}
form.userform input:active, form.userform input:focus, form.userform textarea:active, form.userform textarea:focus, form.userform select:active, form.userform select:focus{box-shadow: none;border:1px solid var(--lithoss-black);border-radius: 5px;padding:12px;}
form.userform input.error, form.userform textarea.error, form.userform select.error, form.userform .inputgroup.error input, form.userform .inputgroup.error textarea, form.userform .inputgroup.error select{box-shadow: none;border:1px solid var(--lithoss-red);border-radius: 5px;padding:12px;background-color:var(--lithoss-red-light5);}
form.userform p.error{font-size: 12px;color:var(--lithoss-red) !important;padding:0 12px;}
form.userform p.legal{color:var(--lithoss-black-light5);line-height:1.2;font-size: 13px;padding:0;margin-bottom:4px;}

.checkboxfield{padding:0 15px;}
.checkboxfield input{display:none !important;}
.checkboxfield .checkbox{display: inline-block;margin:0;margin-right:15px;}
.checkboxfield .checkbox .checkbox-item label{padding:0;display: inline-flex;justify-content: center;cursor:pointer;}
.checkboxfield input + label span:first-child{width:18px !important;height:18px !important;background: none !important; border: 1px solid var(--lithoss-black);border-radius: 4px;margin-right:5px;}
.checkboxfield input + label span:first-child span{margin:2px;height:calc(100% - 4px) !important;width:calc(100% - 4px) !important;border-radius: 2px;border:none;display: flex !important;justify-content: center;align-items: center;}
.checkboxfield input:checked + label span:first-child span{background-color:var(--lithoss-black) !important;}
.checkboxfield .checkbox.radio input + label span:first-child{border-radius: 100%;}
.checkboxfield .checkbox.radio input + label span:first-child span{border-radius: 100%;}
.checkboxfield .checkbox.radio label, .checkboxfield .checkbox.radio label{padding-left:0;}

form.userform .form-buttons .col-xs-12{display: flex;justify-content: center;align-items: center;flex-wrap: wrap;}
form.userform .form-buttons.left .col-xs-12{justify-content: flex-start;}
form.userform .form-buttons p.link{font-size: 16px;color:var(--lithoss-black);line-height:1.4;width:100%;margin-top:10px;}
form.userform .form-buttons p.link a{text-decoration: underline;color:var(--lithoss-black);}
form.userform .form-buttons .waiting{display: inline-flex;align-items: center;width:100%;justify-content: center;margin-bottom: 10px;}
form.userform .form-buttons.left .waiting{justify-content: flex-start;}
form.userform .form-buttons  img{width: 40px;margin-right: 10px;}
form.userform .form-buttons  p{font-size: 16px;color: var(--lithoss-black);margin-bottom:0;}
form.userform .button{display:inline-flex;flex-wrap: wrap;justify-content:center;padding:0 15px;margin:0 10px;background-color:transparent;cursor:default;border-radius:0;border:1px solid var(--lithoss-black-light5);transition: all .15s ease-out;}
form.userform .form-buttons.left .button{margin-left:0;margin-right:20px;}
form.userform .button.active, .extra-nav .button.active:hover{background-color:transparent; color:var(--lithoss-black);border:1px solid var(--lithoss-black);cursor:pointer;}
form.userform .button span.text{font-size:14px;font-weight:600;color:var(--lithoss-black-light5);text-transform:uppercase;padding:10px 0;transition: all .15s ease-out;}
form.userform .button.active span.text, .extra-nav .button.active:hover span.text{color:var(--lithoss-black);}
form.userform .button-left span.text{padding-left:15px;}
form.userform .button-right span.text{padding-right:15px;}
form.userform .button span.chevron{display: inline-flex;align-items: center;line-height:0;transition: all .15s ease-out;}
form.userform .button-left.active:hover span.chevron{padding-right:15px;border-right:1px solid var(--lithoss-black);}
form.userform .button-right.active:hover span.chevron{padding-left:15px;border-left:1px solid var(--lithoss-black);}
form.userform .button span.chevron svg{fill: var(--lithoss-black-light5);transition: all .15s ease-out;}
form.userform .button.active span.chevron svg, .extra-nav .button.active:hover span.chevron svg{fill: var(--lithoss-black);}
form.userform p.error{margin-top: 10px;color: var(--lithoss-red);font-size:13px;}
form.userform #algemene-error{width:100%;}
.form-successcontainer p{font-size: 18px;color:var(--lithoss-black);text-align: center;line-height:1.2;}
.form-successcontainer a{font-size: 18px;color:var(--lithoss-black);text-align: center;line-height:1.2;text-decoration: underline;}

.success-buttons .button{display:inline-flex;flex-wrap: wrap;justify-content:center;padding:0 15px;margin:0 10px;background-color:transparent;cursor:default;border-radius:0;border:1px solid var(--lithoss-black-light5);transition: all .15s ease-out;text-decoration: none;flex-wrap: nowrap;}
.success-buttons.left .button{margin-left:0 !important;margin-right:20px;}
.success-buttons .button.active, .extra-nav .button.active:hover{display: inline-flex;padding:0 15px;margin:0 10px;border-radius:0;background-color:transparent; color:var(--lithoss-black);border:1px solid var(--lithoss-black);cursor:pointer;letter-spacing:0;}
.success-buttons .button span.text{font-size:14px;font-weight:600;color:var(--lithoss-black-light5);text-transform:uppercase;padding:10px 0;transition: all .15s ease-out;}
.success-buttons .button.active span.text, .extra-nav .button.active:hover span.text{color:var(--lithoss-black);}
.success-buttons .button-right span.text{padding-right:15px;}
.success-buttons .button span.chevron{display: inline-flex;align-items: center;line-height:0;transition: all .15s ease-out;}
.success-buttons .button-right.active:hover span.chevron{padding-left:15px;border-left:1px solid var(--lithoss-black);}
.success-buttons .button span.chevron svg{fill: var(--lithoss-black-light5);transition: all .15s ease-out;}
.success-buttons .button.active span.chevron svg, .extra-nav .button.active:hover span.chevron svg{fill: var(--lithoss-black);}

.success-buttons .button.active.inverse, .success-buttons .button.active.inverse:hover{background-color:var(--lithoss-black-light2);} 
.success-buttons .button.active.inverse span.text, .extra-nav .button.inverse.active:hover span.text{color:white;}
.success-buttons .button.inverse span.chevron svg{fill: white;transition: all .15s ease-out;}

#userform-login, #forgot-pw{margin-top: 50px;}

.quotation-list{margin-top:50px;margin-bottom: 25px;}
.quotationlist .quotation{background-color:rgba(255, 255, 255, 0.5);}
.quotationlist .quotation p.title span.quotation-label{background-color: var(--lithoss-black-light5);}