.indicator_qcp {
    display: flex;
    justify-content: start;
    position: relative;
}

.qcp_filter {
    width: 20%;
    margin-top: 20px;
    display: none;
}

.qcp_filter .qcp_child {
    position: sticky;
    top: 100px;
    display: flex;
    flex-direction: column;
    place-items: center;
    background-color: #f1f1f1;
    padding-top: 20px;
    border-radius: 10px;
}

.qcp_child a {
    margin-bottom: 40px;
}

.qcp_child img {
    height: 20px;
    width: 20px;
}

/* LSI CSS */
.lsi_quick_count {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 30px;
    background-image: url(/img/bg_quickcnt.webp);
    display: none;
}

.lsi_wrap_qc {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.lsi_lembaga_survey {
    border: 2px solid #4CA3D8;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    background-color: #F9FDFF;
    font-family: "Noto Sans", sans-serif;
    justify-content: center;
}

.lsi_lembaga_survey .lsi_wrap_keteranagan {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px;
}

.lsi_lembaga_survey .lsi_keterangan {
    /* width: 100%;  */
    font-size: 14px;
}

.lsi_lembaga_survey .lsi_info_jumlah {
    font-size: 28px;
    color: #4CA3D8;
    font-weight: 600;
}

.lsi_lembaga_survey img {
    width: 50%;
    height: 100%;
}

.lsi_lembaga_survey .lsi_wrap_date {
    width: 100%;
    text-align: center;
    font-size: 12px;
}

/* .lsi_paslon {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #f9f9f9;
}

.lsi_paslon img {
    width: 180px;
    height: 130px;
    object-fit: cover;
} */

/* .lsi_paslon .lsi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
} */

.lsi_kanal_pemilu {
    background-color: #37a2d6;
    padding: 10px;
    color: whitesmoke;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    width: 50%;
    place-self: center;
}

.lsi_paslon_anies {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #E1EFFF
}

.lsi_paslon_anies img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.lsi_paslon_anies .lsi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.lsi_paslon_prabowo {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #F0F8FD
}

.lsi_paslon_prabowo img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.lsi_paslon_prabowo .lsi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.lsi_paslon_ganjar {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #FDF0F0
}

.lsi_paslon_ganjar img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.lsi_paslon_ganjar .lsi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

/* LSI CSS END*/

/* POLTRACKING CSS */
.pol_quick_count {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
    background-image: url(/img/bg_quickcnt.webp);
    display: none;
}

.pol_wrap_qc {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.pol_lembaga_survey {
    border: 2px solid #4CA3D8;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    background-color: #F9FDFF;
    font-family: "Noto Sans", sans-serif;
    justify-content: center;
}

.pol_lembaga_survey .pol_wrap_keteranagan {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px;
}

.pol_lembaga_survey .pol_keterangan {
    /* width: 100%;  */
    font-size: 14px;
}

.pol_lembaga_survey .pol_info_jumlah {
    font-size: 28px;
    color: #4CA3D8;
    font-weight: 600;
}

.pol_lembaga_survey img {
    width: 50%;
    height: 100%;
}

.pol_lembaga_survey .pol_wrap_date {
    width: 100%;
    text-align: center;
    font-size: 12px;
}

/* .pol_paslon {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #f9f9f9;
}

.pol_paslon img {
    width: 180px;
    height: 130px;
    object-fit: cover;
} */

/* .pol_paslon .pol_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
} */

.pol_kanal_pemilu {
    background-color: #37a2d6;
    padding: 10px;
    color: whitesmoke;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    width: 50%;
    place-self: center;
}

.pol_paslon_anies {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #E1EFFF
}

.pol_paslon_anies img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.pol_paslon_anies .pol_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.pol_paslon_prabowo {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #F0F8FD
}

.pol_paslon_prabowo img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.pol_paslon_prabowo .pol_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.pol_paslon_ganjar {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #FDF0F0
}

.pol_paslon_ganjar img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.pol_paslon_ganjar .pol_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

/* POLTRACKING CSS END */

/* CHARTA CSS */
.char_quick_count {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
    background-image: url(/img/bg_quickcnt.webp);
    display: none;
}

.char_wrap_qc {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.char_lembaga_survey {
    border: 2px solid #4CA3D8;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    background-color: #F9FDFF;
    font-family: "Noto Sans", sans-serif;
    justify-content: center;
}

.char_lembaga_survey .char_wrap_keteranagan {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px;
}

.char_lembaga_survey .char_keterangan {
    /* width: 100%;  */
    font-size: 14px;
}

.char_lembaga_survey .char_info_jumlah {
    font-size: 28px;
    color: #4CA3D8;
    font-weight: 600;
}

.char_lembaga_survey img {
    width: 50%;
    height: 100%;
}

.char_lembaga_survey .char_wrap_date {
    width: 100%;
    text-align: center;
    font-size: 12px;
}

/* .char_paslon {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #f9f9f9;
}

.char_paslon img {
    width: 180px;
    height: 130px;
    object-fit: cover;
} */

/* .char_paslon .char_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
} */

.char_kanal_pemilu {
    background-color: #37a2d6;
    padding: 10px;
    color: whitesmoke;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    width: 50%;
    place-self: center;
}

.char_paslon_anies {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #E1EFFF
}

.char_paslon_anies img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.char_paslon_anies .char_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.char_paslon_prabowo {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #F0F8FD
}

.char_paslon_prabowo img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.char_paslon_prabowo .char_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.char_paslon_ganjar {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #FDF0F0
}

.char_paslon_ganjar img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.char_paslon_ganjar .char_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

/* CHARTA CSS END */

/* CHYRUS CSS */
.chy_quick_count {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
    background-image: url(/img/bg_quickcnt.webp);
    display: none;
}

.chy_wrap_qc {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.chy_lembaga_survey {
    border: 2px solid #4CA3D8;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    background-color: #F9FDFF;
    font-family: "Noto Sans", sans-serif;
    justify-content: center;
}

.chy_lembaga_survey .chy_wrap_keteranagan {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px;
}

.chy_lembaga_survey .chy_keterangan {
    /* width: 100%;  */
    font-size: 14px;
}

.chy_lembaga_survey .chy_info_jumlah {
    font-size: 28px;
    color: #4CA3D8;
    font-weight: 600;
}

.chy_lembaga_survey img {
    width: 50%;
    height: 100%;
}

.chy_lembaga_survey .chy_wrap_date {
    width: 100%;
    text-align: center;
    font-size: 12px;
}

/* .chy_paslon {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #f9f9f9;
}

.chy_paslon img {
    width: 180px;
    height: 130px;
    object-fit: cover;
} */

/* .chy_paslon .chy_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
} */

.chy_kanal_pemilu {
    background-color: #37a2d6;
    padding: 10px;
    color: whitesmoke;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    width: 50%;
    place-self: center;
}

.chy_paslon_anies {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #E1EFFF
}

.chy_paslon_anies img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.chy_paslon_anies .chy_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.chy_paslon_prabowo {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #F0F8FD
}

.chy_paslon_prabowo img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.chy_paslon_prabowo .chy_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.chy_paslon_ganjar {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #FDF0F0
}

.chy_paslon_ganjar img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.chy_paslon_ganjar .chy_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}


/* CHYRUS CSS END */

/* LINGKARAN CSS */
.lingkaran_quick_count {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
    background-image: url(/img/bg_quickcnt.webp);
    display: none;
}

.lingkaran_wrap_qc {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.lingkaran_lembaga_survey {
    border: 2px solid #4CA3D8;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    background-color: #F9FDFF;
    font-family: "Noto Sans", sans-serif;
    justify-content: center;
}

.lingkaran_lembaga_survey .lingkaran_wrap_keteranagan {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px;
}

.lingkaran_lembaga_survey .lingkaran_keterangan {
    /* width: 100%;  */
    font-size: 14px;
}

.lingkaran_lembaga_survey .lingkaran_info_jumlah {
    font-size: 28px;
    color: #4CA3D8;
    font-weight: 600;
}

.lingkaran_lembaga_survey img {
    width: 50%;
    height: 100%;
}

.lingkaran_lembaga_survey .lingkaran_wrap_date {
    width: 100%;
    text-align: center;
    font-size: 12px;
}

/* .lingkaran_paslon {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #f9f9f9;
}

.lingkaran_paslon img {
    width: 180px;
    height: 130px;
    object-fit: cover;
} */

/* .lingkaran_paslon .lingkaran_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
} */

.lingkaran_kanal_pemilu {
    background-color: #37a2d6;
    padding: 10px;
    color: whitesmoke;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    width: 50%;
    place-self: center;
}

.lingkaran_paslon_anies {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #E1EFFF
}

.lingkaran_paslon_anies img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.lingkaran_paslon_anies .lingkaran_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.lingkaran_paslon_prabowo {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #F0F8FD
}

.lingkaran_paslon_prabowo img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.lingkaran_paslon_prabowo .lingkaran_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.lingkaran_paslon_ganjar {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #FDF0F0
}

.lingkaran_paslon_ganjar img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.lingkaran_paslon_ganjar .lingkaran_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

/* LINGKARAN CSS END */

/* INDIKATOR CSS */
.indi_quick_count {
    width: 100%;
    display: flex;
    flex-direction: column;
    margin-bottom: 40px;
    background-image: url(/img/bg_quickcnt.webp);
    display: none;
}

.indi_wrap_qc {
    padding: 20px;
    display: flex;
    flex-direction: column;
    gap: 10px;
    width: 100%;
}

.indi_lembaga_survey {
    border: 2px solid #4CA3D8;
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    padding: 10px;
    border-radius: 5px;
    background-color: #F9FDFF;
    font-family: "Noto Sans", sans-serif;
    justify-content: center;
}

.indi_lembaga_survey .indi_wrap_keteranagan {
    display: flex;
    width: 100%;
    align-items: center;
    justify-content: center;
    gap: 5px;
    padding: 5px;
}

.indi_lembaga_survey .lindi_keterangan {
    /* width: 100%;  */
    font-size: 14px;
}

.indi_lembaga_survey .indi_info_jumlah {
    font-size: 28px;
    color: #4CA3D8;
    font-weight: 600;
}

.indi_lembaga_survey img {
    width: 50%;
    height: 100%;
}

.indi_lembaga_survey .indi_wrap_date {
    width: 100%;
    text-align: center;
    font-size: 12px;
}

/* .indi_paslon {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #f9f9f9;
}

.indi_paslon img {
    width: 180px;
    height: 130px;
    object-fit: cover;
} */

/* .indi_paslon .indi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
} */

.indi_kanal_pemilu {
    background-color: #37a2d6;
    padding: 10px;
    color: whitesmoke;
    text-decoration: none;
    border-radius: 5px;
    text-align: center;
    width: 50%;
    place-self: center;
}

.indi_paslon_anies {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #E1EFFF
}

.indi_paslon_anies img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.indi_paslon_anies .indi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.indi_paslon_prabowo {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #F0F8FD
}

.indi_paslon_prabowo img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.indi_paslon_prabowo .indi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}

.indi_paslon_ganjar {
    display: flex;
    width: 100%;
    border-radius: 5px;
    align-items: center;
    background-color: #FDF0F0
}

.indi_paslon_ganjar img {
    width: 180px;
    height: 130px;
    object-fit: cover;
}

.indi_paslon_ganjar .indi_indeks_paslon {
    text-align: center;
    width: 50%;
    font-size: 26px;
    font-weight: 600;
    color: #3780B9;
}


/* INDIKATOR CSS END */

/* breakpoint */

/* mobile max */
@media (max-width: 576px) {}


/* tablet max */
@media (max-width: 988px) {
    .lsi_quick_count {
        display: block;
    }

    .pol_quick_count {
        display: block;
    }

    .char_quick_count {
        display: block;
    }

    .chy_quick_count {
        display: block;
    }

    .lingkaran_quick_count {
        display: block;
    }

    .indi_quick_count {
        display: block;
    }

    .qcp_filter {
        display: block;
    }
}