.tab-holder {
     position: relative;
     overflow: hidden;
}

.tab-controls {
     display: flex;
     position: relative;
     z-index: 1;
     margin: 0 0 20px;
     overflow-y: auto;
}
.tab-controls a {
    display: inline-flex;
    white-space: nowrap;
    position: relative;
    margin: 0 22px 0 23px;
    color: var(--black-hover);
}
.tab-control.active a {
    color: var(--black-main);
}
.tab-controls a.active:after {
    background: var(--black-main);
    content: "";
    position: absolute;
    left: 0;
    right: 0;
    bottom: -10px;
    height: 1px;
}

 .tab-controls a:hover {
     opacity: 1;
}
 .tab-controls-holder {
     display: flex;
     justify-content: center;
     margin: auto;
}
.tab-content {
    position: absolute;
    left: 0;
    right: 0;
    top: 0;
    bottom: 0;
    opacity: 0;
    pointer-events: none;
}
 .tab-content.active {
     display: block;
     position: relative;
     z-index: 1;
     opacity: 1;
     pointer-events: visible;
}
 .tab-content-holder {
     position: relative;
}
 @media (min-width: 768px) {
     .tab-controls {
         justify-content: center;
    }
     .tab-controls a {
         /*margin: 0 15px;*/
    }
}
 @media (max-width: 767px) {

}