

.btnvjSelection {
    float: left;
    position: relative;
    height: 2.5rem;
    padding: 0;
    margin: 0px 5px -10px; /* Boven, links/rechts, en ondermarge voor niet-actieve knoppen */
    z-index: 0;
    border: 1px solid #e0e0e06c;
    color: #e37e2b;
    background: #fff;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 15px;
    border-bottom-right-radius: 15px;
    transition: color 0.2s;
}

.btnvjSelection:hover {
    color: #CE5916;
}

.btnvjSelection.active {
    color: #333333;
    font-weight: bold;
    background-color: white;
    border-color: white;
    z-index: 3;
    height: 2.8rem;
    border-bottom-color: #fff;
    margin: 0px 5px 0px !important; /* Verwijdert ondermarge voor actieve knop */ 
    padding-bottom: 0.5rem;
    border-top-left-radius: 15px;
    border-top-right-radius: 15px;
    border-bottom-left-radius: 0;
    border-bottom-right-radius: 0;
}




/* 
.btnvjSelection:before, .btnvjSelection:after, 
.btnvjSelection a:before, .btnvjSelection a:after {
  /* All pseudo elements are 
     abs. positioned and on bottom */
/*  position: absolute;
  bottom: 0;
}*/

/* Only the first, last, and active
   tabs need pseudo elements at all */
/*.btnvjSelection:last-child:after,   .tabs li:last-child a:after,
.btnvjSelection:first-child:before, .tabs li:first-child a:before,
.btnvjSelection.active:after,  
.btnvjSelection.active:before, 
.btnvjSelection.active:after,
.btnvjSelection.active:before {
  content: "";
}

.btnvjSelection.active:before, 
.btnvjSelection.active:after {
  background:  #eef0f3;   
  /* Squares below circles */
/*  z-index: 1;
}*/

/* Squares */
.btnvjSelection:before, .btnvjSelection:after {
  background: #eef0f3;
  width: 10px;
  height: 10px;
}
.btnvjSelection:before {
  left: -10px;      
}
.btnvjSelection:after { 
  right: -10px;
}

/* Circles */
.btnvjSelection:after, 
.btnvjSelection:before {
  width: 20px; 
  height: 20px;
  /* Circles are circular */
  -webkit-border-radius: 10px;
  -moz-border-radius:    10px;
  border-radius:         10px;
  background: #eef0f3; 
  /* Circles over squares */
  z-index: 2;
}
.btnvjSelection.active:after, 
.btnvjSelection.active:before {
  background: #eef0f3;
}
/* First and last tabs have different
   outside color needs */
.btnvjSelection:first-child.active:before,
.btnvjSelection:last-child.active:after {
  background: #EEF0F3;
}
.btnvjSelection:before {
  left: -20px;
}
.btnvjSelection:after {
  right: -20px;
} */