.fred-tabs { width: 100%; }

.fred-tabs-nav {
    display: flex;
    flex-wrap: wrap;
    margin-bottom: 10px;
}

.fred-tabs-nav div {
    padding: 10px 15px;
    cursor: pointer;
    border: 1px solid #ddd;
}

.fred-tabs-nav div.active {
    background: var(--main-color);
    color: #fff;
}

/* Styles */
.style-pill .fred-tabs-nav div { border-radius: 50px; }
.style-line .fred-tabs-nav div {
    border: none;
    border-bottom: 2px solid transparent;
}
.style-line .fred-tabs-nav div.active {
    border-bottom: 2px solid var(--main-color);
    color: var(--main-color);
}

.align-center { justify-content: center; }
.align-right { justify-content: flex-end; }
.align-justify div { flex: 1; text-align: center; }

.fred-tab-pane { display:none;  }
.fred-tab-pane.active {  display:block;  }

/*.fred-tab-pane { width:0; height:0; opacity: 0;  }
.fred-tab-pane.active {  width:auto; height:auto; opacity: 1;  }*/