/*Tabelle*/

.model-comparison-table table {
    border: none!important;
    margin-top: 50px;
}

.model-comparison-table .divider th {
    background: #7C7B7B;
    color: #fff;
    border: none!important;
    padding: 10px;
}

.model-comparison-table .divider {
    border: none !important;
}

.model-comparison-table thead tr {
    background-color: #fff !important;
}

.model-comparison-table tbody tr:nth-child(even) {
    background-color: #F7F7F7;
}

.model-comparison-table tbody tr:nth-child(odd) {
    background-color: #fff;
}

.model-comparison-table tr:nth-child(even) .recommended {
    background-color: #0086CD;
}

.model-comparison-table tr:nth-child(odd) .recommended {
    background-color: #0082c6;
}

.model-comparison-table tr:nth-child(even) .recommendedPricePerformance {
    background-color: #005D95;
}

.model-comparison-table tr:nth-child(odd) .recommendedPricePerformance {
    background-color: #00578b;
}

.model-comparison-table .recommended, .model-comparison-table .recommendedPricePerformance {
    color: white !important;
}

.model-comparison-table tr td,
.model-comparison-table tr th {
    border: none!important;
    padding: 10px!important;
    text-align: center;
}

.model-comparison-table tr td:first-child,
.model-comparison-table tr th:first-child {
    text-align: left;
    min-width: 200px;
}

.model-comparison-table thead tr {
    margin-bottom: 20px;
}

.model-comparison-table thead tr td div div {
    font-size: 24px;
    color: #0086CD;
    margin-bottom: 10px;
}

.model-comparison-table thead tr .recommended div div, .model-comparison-table thead tr .recommended div a {
    color: white;
}

.model-comparison-table thead tr .recommendedPricePerformance div div, .model-comparison-table thead tr .recommendedPricePerformance div a {
    color: white;
}

.model-comparison-table thead tr td div img {
    max-width: 280px;
}

.model-comparison-table .recommendationHeader td {
    /*background-color: #005D95 !important;*/
    border-bottom: 1px solid white !important;
    color: white;
    font-weight: bold;
    font-size: 16px !important;
    padding: 10px;
    visibility: hidden;
}

.model-comparison-table td .mobile-content {
    font-size: 13px;
    font-weight: 600;
    color: #7C7B7B;
}

.model-comparison-table td.recommended .mobile-content,  .model-comparison-table td.recommendedPricePerformance .mobile-content{
    color: #f7f7f7;
}


.mobile-content, .mobile-content ~ br {
    display: none;
}

/*Tabbar*/
.model-comparison-tabbar-container {
    /*overflow-x: auto;*/
    border-bottom: 1px solid #000;
}

.model-comparison-tabbar {
    display: flex;
    justify-content: space-between;
    min-width: 1000px;
    height: 30px;
}

.model-comparison-tabbar .tabs {
    display: flex;
    gap: 10px;


    flex-direction: row;
    /*width: 100%;*/
    overflow-x: auto;
}

.model-comparison-tab {
    color: #0086CD;
    background: unset;
    border: none;
    border-bottom: 5px solid #fff;
    font-size: 16px;
    padding-bottom: 4px;
    cursor: pointer;
}

.model-comparison-tab.active {
    border-bottom: 5px solid #0086CD;
}


@media only screen and (max-width: 1024px) {
    .model-comparison-tabbar {
        display: flex;
        justify-content: flex-start;
        flex-wrap: wrap;
        flex-direction: column;
        min-width: unset;
        height: unset;
        align-items: flex-start;
        gap: 20px;
    }

    .model-comparison-tabbar .tabs {
        width: 100%;
    }

    .model-comparison-tabbar button {
        white-space: nowrap;
    }
}

@media only screen and (max-width: 640px) {
    .mobile-content, .mobile-content ~ br {
        display: inline-block;
    }

    .model-comparison-table tr td:first-child,
    .model-comparison-table tr th:first-child {
        display: none;
    }

    .model-comparison-table tr td,
    .model-comparison-table tr th {
        min-width: calc(100vw - 40px);
        white-space: normal;
    }
}

@media only screen and (max-width: 520px) {
    .model-comparison-tabbar .tabs {
        display: flex;
        flex-wrap: wrap;
        flex-direction: column;
        align-items: flex-start;
    }

    .model-comparison-tabbar button {
        width: 100%;
        text-align: justify;
    }
}