
.wellness-wheel-container {
    display: flex;
    flex-flow: row wrap;
    justify-content: center;
    justify-items: center;
    align-items: flex-start;
    align-content: flex-start;
}

.wellness-wheel-col {
    flex: 1 1 50%;
    min-width: 300px
}

.wellness-wheel {
    position: relative;
    text-align: center;
    padding: 30px
}

.wellness-wheel .slice {
    transition: all .4s ease;
    opacity: .5
}

.wellness-wheel .slice.active {
    opacity: 1
}

.wellness-wheel .slice:hover {
    opacity: 1;
    box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.1);
    cursor: pointer
}

.wellness-wheel .slice1 {
    fill: #f3d84e
}

.wellness-wheel .slice2 {
    fill: #f2686b
}

.wellness-wheel .slice3 {
    fill: #0297af
}

.wellness-wheel .slice4 {
    fill: #94cad6
}

.wellness-wheel .slice5 {
    fill: #49a547
}

.wellness-wheel .slice6 {
    fill: #4eb2e5
}

.wellness-wheel .slice7 {
    fill: #d39dc7
}

.wellness-wheel .slice8 {
    fill: #a7d16a
}

.wellness-wheel .center-circle {
    fill: #dededd
}

.wellness-wheel .slice-text {
    fill: #fff;
    pointer-events: none
}

.wellness-wheel .center-text {
    fill: #000
}

.wellness-tabs {
    padding: 30px
}

.wellness-tabs .tab-content {
    display: none
}

.wellness-tabs .tab-content.active {
    display: block
}

.wellness-tabs .tab-content h3 {
    text-transform: uppercase
}

.wellness-tabs .tab-content#slice1-content h3 {
    color: #f3d84e
}

.wellness-tabs .tab-content#slice2-content h3 {
    color: #f2686b
}

.wellness-tabs .tab-content#slice3-content h3 {
    color: #0297af
}

.wellness-tabs .tab-content#slice4-content h3 {
    color: #94cad6
}

.wellness-tabs .tab-content#slice5-content h3 {
    color: #49a547
}

.wellness-tabs .tab-content#slice6-content h3 {
    color: #4eb2e5
}

.wellness-tabs .tab-content#slice7-content h3 {
    color: #d39dc7
}

.wellness-tabs .tab-content#slice8-content h3 {
    color: #a7d16a
}
