.step {display:none;}
.step.active {display:block;}
.buttons {margin-top:20px;display: flex;align-items: center;gap: 20px;}
button {padding:10px 20px;cursor:pointer;}
#datum {padding:10px;font-weight:bold;font-size:18px;}
#overzicht {background:#f5f5f5;padding:15px;border-radius:6px;margin-bottom:25px;display:none;border:solid 1px #000;}
#overzicht ul {margin:5px 0 0 20px;}
.row {display:flex;justify-content:space-between;align-items:center;margin-bottom:12px;}
.row label {flex:1;}
.counter {display:inline-flex;align-items:center;border:1px solid #cfcfcf;border-radius:6px;overflow:hidden;background:#fff;}
.counter button {height:40px;width:40px;border:none;background:#f3f3f3;font-size:18px;font-weight:bold;cursor:pointer;display:flex;align-items:center;justify-content:center;}
.counter button:hover {background:#e6e6e6;}
.counter input {height:40px;width:48px;border:none;text-align:center;font-size:16px;font-weight:600;background:#fff;pointer-events:none;font-family:var(--MAINFONT);line-height:40px;padding:0;}
.counter button:hover {background:#e6e6e6;}
.counter button.minus {border-radius:6px 0 0 6px;}
.counter button.plus {border-radius:0 6px 6px 0;}
#oz_totaal {margin-top:10px;font-weight:bold;color:var(--MAINCOLOR);}
#grBezoek,#IndBezoek{display:none;}

.step {
    opacity: 0;
    transform: translateX(40px);
    transition: all 0.45s ease;
    position: absolute;
    width: 100%;
    top: 0;
    left: 0;
}

.step.active {
    opacity: 1;
    transform: translateX(0);
    position: relative;
}

.step.fadeOutLeft {
    opacity: 0;
    transform: translateX(-40px);
}

.step.fadeOutRight {
    opacity: 0;
    transform: translateX(40px);
}

.counter button{-webkit-appearance:none;appearance:none;border:none;background:#f3f3f3;color:#000;box-shadow:none;-webkit-tap-highlight-color:transparent;}
.counter button:active{background:#e6e6e6;color:#000;}
.counter button:focus{outline:none;box-shadow:none;}
input[type="radio"]{transform:scale(1.3);margin-right:8px;}