/*
=============================================
Tab-Element
=============================================
*/
@media only screen and (min-width: 900px){
    .tab {
        -ms-flex: 0 0 33.3333%;
        flex: 0 0 33.3333%;
        max-width: 33.3333%;
    }

    .tabcontent {
        -ms-flex: 0 0 66.6666%;
        flex: 0 0 66.6666%;
        max-width: 66.6666%;
    }

    .element-tabs .innerWrap {
        display: -ms-flexbox;
        display: flex;
        -ms-flex-wrap: wrap;
        flex-wrap: wrap;
    }

    .element-tabs .text.centered {
        width: 100%;
    }
}

.tabcontent {
    padding: 20px;
}

.tablinks {
    margin-bottom: 10px;
}

.element-tabs h3 {
    margin-top: 0px!important;
    color: var(--color-main);
    font-family: 'Caveat Brush';
    text-transform: none;
}

.tablinks.active, .tablinks:hover {
    opacity: 1;
    transition: 0.5s;
}

.tablinks {
    opacity: 0.4;
    border:none!important;
    background-repeat: no-repeat !important;
    background-position-y: bottom !important;
    background-size: contain !important;
    transition: 0.5s;
    padding-left: 2px !important;
    background-color:#FFF!important;
    color: var(--color-main)!important;
    width: 100%;
    max-width: 370px;
    text-align: left;
}

/*
=============================================
Tab-Element Responsive
=============================================
*/
@media only screen and (max-width: 899px){
    .tablinks {
        margin: 10px 20px;
        width: calc(100% - 40px);
    }

    .tabcontent-titel {
        text-align: center;
    }
}