/* =====================================
   Compare Section
===================================== */

#compare {

    background: #ffffff;
}

/* =========================
   Table
========================= */

.compare-table-wrapper {

    margin-top: 60px;

    overflow-x: auto;
}

.compare-table {

    width: 100%;

    border-collapse: collapse;

    background: #fff;

    border-radius: 20px;

    overflow: hidden;

    box-shadow:
    0 15px 40px rgba(0,0,0,.08);
}

.compare-table thead {

    background:
    linear-gradient(
    135deg,
    #0F2744,
    #17385F
    );
}

.compare-table th {

    color: #fff;

    padding: 25px;

    text-align: center;

    font-size: 18px;
}

.compare-table td {

    padding: 22px;

    text-align: center;

    border-bottom:
    1px solid #E5ECF2;

    font-size: 16px;
}

.compare-table tbody tr:nth-child(even) {

    background: #F8FAFC;
}

.compare-table tbody tr:hover {

    background: #EDF5FF;
}

.kmax-column {

    background: var(--accent);
}

.good {

    color: #00A86B;

    font-weight: 700;

    font-size: 20px;
}

/* =========================
   Message
========================= */

.compare-message {

    margin-top: 70px;

    padding: 60px;

    border-radius: 25px;

    background:
    linear-gradient(
    135deg,
    #0F2744,
    #17385F
    );

    color: #fff;

    text-align: center;
}

.compare-message h3 {

    font-size: 36px;

    line-height: 1.6;

    margin-bottom: 25px;
}

.compare-message span {

    color: var(--accent);
}

.compare-message p {

    max-width: 800px;

    margin: auto;

    font-size: 20px;

    line-height: 2;
}

/* =========================
   Mobile
========================= */

@media screen and (max-width:992px){

    .compare-table{

        font-size:14px;
    }

    .compare-table th,
    .compare-table td{

        padding:14px 12px;
    }
}

@media screen and (max-width:768px){

    .compare-table{

        display:block;
        overflow-x:auto;
        -webkit-overflow-scrolling:touch;
    }

    .compare-table th,
    .compare-table td{

        padding:14px;

        font-size:14px;
    }

    .compare-message{

        padding:35px 25px;
    }

    .compare-message h3{

        font-size:26px;
    }

    .compare-message p{

        font-size:16px;
    }

}