.order-0{
    order: 0 !important;
}
.order-1{
    order: 1 !important;
}
/* Untuk layar desktop (min-width: 1024px) */
@media(max-width: 1024px) {

    .ly-gpr{
        display: flex;
        flex-direction: column;
        align-items: center;
        padding: 24px;
        gap: 24px;
        isolation: isolate;
        width: 100%;
        height: auto;
        background: #358AC4;
        border-radius: 8px;
        flex: none;
        order: 0;
        flex-grow: 0;
    }
    .ly1-gpr{
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0px 32px;
        gap: 16px;
        width: 100%;
        height: auto;
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
        z-index: 0;
    }
    .txt-gpr{
        /* GPR KOMDIGI */

        width: 92px;
        height: 48px;

        /* Plus Jakarta Sans/Headline/Headline 3

        Title for section
        */

        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 24px;
        /* or 120% */
        text-align: center;
        letter-spacing: 0.005em;

        /* Color/White */
        color: #FFFFFF;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 0;

    }
    .konten-gpr{
/* Frame 453 */

/* Auto layout */
display: flex;
flex-direction: row;
align-items: center;
padding: 0px;
gap: 12px;

width: 105%;
height: auto;


/* Inside auto layout */
flex: none;
order: 1;
flex-grow: 1;
z-index: 1;

}

    .ly-card-history {
        display: flex;
        flex-direction: row;
        align-items: center;
        width: 100%;
        height: auto;
        flex-wrap: wrap;

    }
    .ly-card-history-left {

        font-style: normal;
        font-weight: 600;
        font-size: 10px;
        line-height: 14px;
        display: flex;
        align-items: center;
        color: #055A9E;
        flex: none;
        flex-grow: 0;
    }
    .ly-card-history-center {

        font-style: normal;
        font-weight: 400;
        font-size: 10px;
        line-height: 14px;
        display: flex;
        align-items: center;
        color: #131313;
        flex: none;
        flex-grow: 0;
    }
    .ly-card-history-right {

        font-style: normal;
        font-weight: 400;
        font-size: 10px;
        line-height: 14px;
        display: flex;
        align-items: center;
        color: #6D6E71;
        flex: none;
        flex-grow: 0;
    }
    .ly-line-height {
        width: 1px;
        height: 10px;
        background-color: #6D6E71;
        margin: 0 8px;
        align-self: center;
        border: 1px solid #6D6E71;
    }
    .width-50{
        width: calc((100% - 18px)/2) !important;
    }
    .selengkapnya{
        padding: 0px;
        gap: 32px;
        flex: none;
        order: 0;
        flex-grow: 0;
        display: flex;
        width: 100%;
        flex-direction: row;
        justify-content: center;
    }

    .text-selengkap{
        text-align:center;
    }
    .w-200{
        width:200px !important;
    }
    .h-133{
        height:133px;
    }
    .v-desktop{
        display:none !important;
    }
    .v-mobile{
        display:block;
    }
    .ov-auto{
        overflow:auto;
    }
    .row-mobile{
        /* Frame 109 */

        /* Auto layout */
        display: flex;
        flex-direction: row !important;
        align-items: flex-start;
        padding: 0px;
        gap: 18px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;

    }
    .kemdikbud-carousel-container {
        position: relative;
        width: 100%;
        height: 60vh;
        overflow: hidden;
    }

    .kemdikbud-carousel {
        display: flex;
        transition: transform 0.5s ease-in-out;*/
        position: relative;
        overflow: hidden;
    }
    .hero-content h1{
        font-size:  var(--h3-size) !important;
        letter-spacing:  var(--h3-spacing) !important;
        line-height:  var(--h3-height) !important;
        font-weight:  var(--h3-weight) !important;
    }
    .title-hero {
        width: 100% !important;
    }
    .subtitle-hero {
        width: 100% !important;
        font-size: var(--s2-size);
        line-height: var(s2-height);
        font-weight: var(s2-weight);
    }
    .image-berita2{
        /* image 21 */

        width: 100%;
        height: 133px;


        border-radius: 10px;
        background-size: 168% !important;
        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }

    .image-berita3{
        /* image 21 */

        width: 100%;
        height: 210px;


        border-radius: 10px;
        background-size: 168% !important;
        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }
    .card-content2{
        /* Card Content */
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 6px;
        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 1;


    }
    .content-data2{
        /* Frame 277 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 0px;
        gap: 30px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        align-self: stretch;
        flex-grow: 0;
    }
    .hero-layout-kemdikbud-carousel {
        flex: 0 0 100%;
        height: 60vh;
        position: absolute;
        top: 0;
        left: 0;
        opacity: 0;
        overflow: hidden;
        opacity: 0;
        transform: translateX(100%); /* Posisi awal */
    }
    .judul2{
        text-align:left;/* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */

        font-style: normal;
        font-weight: var(--s2-bold);
        font-size: var(--s2-size);
        line-height: var(--s2-height);
        /* or 133% */

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
        text-decoration:none;

    }

    .hero-layout-kemdikbud-carousel.active:hover,
    .hero-layout-kemdikbud-carousel:hover {
        transform: scale(1.05); /* Membesarkan elemen 5% saat hover */
        opacity: 1; /* Tetap terlihat sepenuhnya */
        z-index: 2; /* Pastikan elemen aktif berada di atas */
        transition: transform 0.6s ease-in-out; /* Transisi lebih cepat untuk hover */
    }

    .hero-layout-kemdikbud-carousel.active {
        position: relative;
        opacity: 1;
        transform: scale(1.05); /* Elemen aktif sedikit lebih besar */
        overflow: hidden;
    }
    .hero-layout-kemdikbud-carousel:not(.active) {
    }
    .hero-content {
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        width: 95%;
        color: white;
        padding: 20px;
        border-radius: 10px;
        box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.3), 0px 8px 20px rgba(0, 0, 0, 0.2); /* Shadow berlapis */
        transition: transform 0.3s ease, box-shadow 0.3s ease; Animasi untuk perubahan shadow */
    }

    .hero-content:hover {
        transform: translateX(-50%) translateY(-5px); /* Geser sedikit ke atas untuk efek pop */
        box-shadow: 0px 6px 15px rgba(0, 0, 0, 0.4), 0px 12px 30px rgba(0, 0, 0, 0.3); /* Shadow lebih intens */
    }


    .kemdikbud-carousel-pagination {
        position: absolute;
        bottom: 20px;
        left: 50%;
        transform: translateX(-50%);
        display: flex;
        gap: 10px;
        z-index: 10;
    }

    .kemdikbud-carousel-pagination .dot {
        width: 12px;
        height: 12px;
        background-color: rgba(255, 255, 255, 0.5);
        border-radius: 50%;
        cursor: pointer;
        transition: background-color 0.3s ease, transform 0.3s ease;
    }

    .kemdikbud-carousel-pagination .dot.active {
        background-color: white;
        transform: scale(1.2);
        border-radius: 10px;
        width: 23px;
    }

    .kemdikbud-layout-pilihan{
        display: flex;
        align-items: center;
        flex-direction: column;
        padding: 5% 3%;
        width: 100%;
        gap: 24px;
        direction: ltr;
    }
    .layout-start{
        /* Frame 416 */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 32px;

        width:100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;
    }
    .layout-start2{
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap:32px;

        width:100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;
    }

    .data-berita2{
        /* Frame 426 */
        box-sizing: border-box;
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 16px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;



    }


    .kemdikbud-layout-pilihan .title-pilihan{
        display: flex;
        align-items: center;
        flex-direction: row;
        width: 100%;
        overflow:hidden;
    }
    .line-middle {
        flex-grow: 1; /* Biarkan garis mengambil ruang kosong */
        height: 1px; /* Tinggi garis */
        background-color: black; /* Warna garis */
        width: 20%;
        margin: auto 5%;
    }
    .kemdikbud-layout-pilihan .layout-box {
        display: flex;
        flex-direction: row;
        align-items: center;
        gap: 24px;
        justify-content: center;
        z-index:10;
        position: relative;
    }
    .kemdikbud-layout-pilihan .layout-box .box {
        position: relative;
        box-sizing: border-box;
        display: flex;
        justify-content: center;
        align-items: center;
        width: 16vw;
        height: 15vh;
        padding: 10px;
        border-radius: calc(1vw + 2px);;
        font-family: 'Plus Jakarta Sans', sans-serif;
        font-weight: bold;
        text-align: center;
        cursor: pointer;
    }

    .kemdikbud-layout-pilihan .layout-box .box-1 {
        background: #FFFFFF;
        border: 2.5px solid #580116;
        color: #580116;
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    }

    .kemdikbud-layout-pilihan .layout-box .box-2 {
        background: #FFFFFF;
        border: 2.5px solid #015804;
        color: #015804;
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    }

    .kemdikbud-layout-pilihan .layout-box .box-3 {
        background: #FFFFFF;
        border: 2.5px solid #BA5B03;
        color: #BA5B03;
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    }

    .kemdikbud-layout-pilihan .layout-box .box-4 {
        background: #FFFFFF;
        border: 2.5px solid  #055A9E;
        color: #055A9E;
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
    }

    .kemdikbud-layout-pilihan .layout-box .box-1:hover {
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
        background: #580116;
        color: #FFFFFF;
        transform: scale(1.1); /* Membesarkan elemen 10% */
        transition: transform 0.3s ease, background 0.3s ease; /* Animasi halus */
    }

    .kemdikbud-layout-pilihan .layout-box .box-2:hover {
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
        background: #015804;
        color: #FFFFFF;
        transform: scale(1.1);
        transition: transform 0.3s ease, background 0.3s ease;
    }

    .kemdikbud-layout-pilihan .layout-box .box-3:hover {
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
        background: #BA5B03;
        color: #FFFFFF;
        transform: scale(1.1);
        transition: transform 0.3s ease, background 0.3s ease;
    }

    .kemdikbud-layout-pilihan .layout-box .box-4:hover {
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
        background: #055A9E;
        color: #FFFFFF;
        transform: scale(1.1);
        transition: transform 0.3s ease, background 0.3s ease;
    }
    .kemdikbud-layout-pilihan .layout-box .dropdown {
        visibility: hidden; /* Default tersembunyi */
        opacity: 0; /* Tidak terlihat */
        position: absolute;
        display: block;
        top: 100%;
        left: 0;
        background-color: #ffffff;
        box-shadow: 0px 8px 16px rgba(0, 0, 0, 0.2);
        padding: 10px;
        margin-top: 2px;
        border-radius: 8px;
        min-width: 100%;
        transform: translateY(-10px); /* Geser ke atas */
        transition: opacity 0.3s ease, transform 0.3s ease, visibility 0.3s; /* Tambahkan animasi visibility */
    }

    .kemdikbud-layout-pilihan .layout-box .dropdown div {
        padding: 8px;
        text-align: left;
        border-bottom: 1px solid #f0f0f0;
        cursor: pointer;
        color: black;
    }

    .kemdikbud-layout-pilihan .layout-box .dropdown div:last-child {
        border-bottom: none;

    }

    .kemdikbud-layout-pilihan .layout-box .dropdown div:hover {
        background-color: #f5f5f5;

    }

    /* Saat dropdown aktif (ditampilkan) */
    .kemdikbud-layout-pilihan .layout-box .dropdown.active {
        visibility: visible; /* Tampilkan elemen */
        opacity: 1; /* Sepenuhnya terlihat */
        transform: translateY(0); /* Kembali ke posisi aslinya */

    }

    /* Berita Terbaru */
    .news-berita{
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 24px;

        /* Gunakan persentase untuk lebar */
        width: 100%; /* Atur persentase sesuai kebutuhan (misalnya 70% dari kontainer) */
        height: auto; /* Biarkan tinggi menyesuaikan dengan konten */

        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }
    .midle-height{
        border-bottom: 1px solid black;
        height: 1px;
        width: 100%;
        order: 1;

    }
    .vertical-height{
        border-right: 1px solid black;
        height: 100vh;
        width: 1px;

    }

    .news-berita .title{
        /* Frame 108 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 0px;
        gap: 12px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
    }
    .news-berita .title .top-title{
        /* Berita Terbaru */



        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 24px;
        /* identical to box height, or 120% */
        text-align: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 0;

    }
    .news-berita .title .midle-height{
        border-bottom: 1px solid black;
        height: 1px;
        width: 100%;
        order: 2;

    }
    .news-berita .content{
        /* Frame 109 */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 18px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;

    }
    .content{
        /* Frame 109 */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 18px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;

    }
    .news-berita .content .content-item{
        /* Content Item Tile */

        box-sizing: border-box;

        /* Auto layout */
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 10px;
        gap: 16px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;


    }

    .content-item{
        /* Content Item Tile */

        box-sizing: border-box;

        /* Auto layout */
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 10px;
        gap: 16px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;


    }
    .news-berita .content .content-item .data-berita{
        /* Frame 426 */
        box-sizing: border-box;
        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 10px;
        gap: 16px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;



    }
    .data-berita{
        /* Frame 426 */
        box-sizing: border-box;
        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 0px;
        gap: 16px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;



    }
    .news-berita .content .content-item .data-berita .image-berita{
        /* image 21 */

        width: 100px;
        height: 100px;


        border-radius: 10px;
        background-size: 168% !important;
        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }
    .image-berita{
        /* image 21 */

        width: 100px;
        height: 100px;


        border-radius: 10px;
        background-size: 168% !important;
        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }
    .no-image-berita{
        /* image 21 */

        width: 100px;
        height: 100px;


        border-radius: 10px;
        background-size: 95% !important;
        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }
    .news-berita .content .content-item .data-berita .card-content{
        /* Card Content */
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 6px;
        width: 75%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 1;


    }
    .card-content{
        /* Card Content */
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px 10px  0px 0px;
        gap: 6px;
        width: 70%;
        height: auto;
        flex-flow:wrap;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 1;


    }
    .news-berita .content .content-item .data-berita .card-content .content-data{
        width: 100%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px 10px 0px 0px;
        gap: 6px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;



    }
    .content-data{
        width: 100%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px 10px 0px 0px;
        gap: 6px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;



    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417{
        width: 100%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 4px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;

    }
    .frame-417{
        width: 100%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 4px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;

    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218{
        width: 100%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 4px;

        height: auto;
        width: 100%;

        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;


    }.frame-218{
        width: 100%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 4px;

        height: auto;
        width: 100%;

        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;


    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .judul{
        width: 90%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */

        font-style: normal;
        font-weight: 700;
        font-size: 14px;
        line-height: 16px;
        /* or 133% */

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
        text-decoration:none;

    }.judul{
        width: 90%; /* Batasi lebar div */
        max-width: 100%; /* Hindari elemen melebihi batas kontainer */
        overflow: hidden; /* Sembunyikan bagian konten yang keluar */
        position: relative; /* Dibutuhkan untuk overflow */

        font-style: normal;
        font-weight: 700;
        font-size: 14px;
        line-height: 16px;
        /* or 133% */

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
        text-decoration:none;

    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .isi-berita{

        display:none;

        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 18px;
        /* or 129% */

        /* Text/Primary */
        color: #131313;

        text-decoration:none;

        /* Inside auto layout */
        flex: none;
        align-self: stretch;
        flex-grow: 0;




    }.isi-berita{

        display:none;

        font-style: normal;
        font-weight: 400;
        font-size: 14px;
        line-height: 18px;
        /* or 129% */

        /* Text/Primary */
        color: #131313;

        text-decoration:none;

        /* Inside auto layout */
        flex: none;
        align-self: stretch;
        flex-grow: 0;




    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .isi-berita-mobile{


        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 16px;
        width: 90%;
        /* or 129% */

        /* Text/Primary */
        color: #131313;

        text-decoration:none;

        /* Inside auto layout */
        flex: none;
        align-self: stretch;
        flex-grow: 0;




    }
    .isi-berita-mobile{


            font-style: normal;
            font-weight: 400;
            font-size: 12px;
            line-height: 16px;
            width: 90%;
            /* or 129% */

            /* Text/Primary */
            color: #131313;

            text-decoration:none;

            /* Inside auto layout */
            flex: none;
            align-self: stretch;
            flex-grow: 0;




        }

    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .berita-history{
        display: flex;
        flex-direction: row; /* Elemen dalam satu baris */
        align-items: center; /* Pusatkan elemen secara vertikal */
        width: 100%;
        height: auto;
    }
    .berita-history{
        display: flex;
        flex-direction: row; /* Elemen dalam satu baris */
        align-items: center; /* Pusatkan elemen secara vertikal */
        width: 100%;
        gap: 4px;
        height: auto;
        flex-flow: wrap;
    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .berita-history .left-berita{
        /* Berita */


        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Color/Primary */
        color: #055A9E;

        /* Inside auto layout */
        flex: none;
        flex-grow: 0;

    }
    .left-berita{
        /* Berita */


        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Color/Primary */
        color: #055A9E;

        /* Inside auto layout */
        flex: none;
        flex-grow: 0;

    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .berita-history .middle-berita{
        /* 19 September 2022 */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;


    }
    .middle-berita{
        /* 19 September 2022 */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;


    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .berita-history .right-berita{
        /* (dilihat 600 kali) */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Secondary */
        color: #6D6E71;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;



    }
    .right-berita{
        /* (dilihat 600 kali) */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Secondary */
        color: #6D6E71;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;



    }
    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .berita-history .line-height {
        width: 1px; /* Lebar garis vertikal */
        height: 10px; /* Sesuaikan tinggi garis dengan parent */
        background-color: #6D6E71; /* Warna garis */
        margin: 0 8px; /* Jarak horizontal dengan elemen lain */
        align-self: center; /* Pastikan garis berada di tengah */
    }

    .news-berita .content .content-item .data-berita .card-content .content-data .frame-417 .frame-218 .berita-tag{
        /* Tag */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        align-content: flex-start;
        padding: 0px;
        gap: 4px;

        width: 90%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;

    }
    .berita-tag{
        /* Tag */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        flex-wrap: wrap;
        align-items: flex-start;
        align-content: flex-start;
        padding: 0px;
        gap: 4px;
        justify-content: flex-start;

        width: auto;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;

    }
    .content-column {
        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 24px;

        /* Gunakan persentase untuk lebar */
        height: auto; /* Biarkan tinggi menyesuaikan dengan konten */

        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }

    .data-tag{
            /* Tag */

            /* Auto layout */
            display: flex;
            flex-direction: row;
            flex-wrap: wrap;
            align-items: flex-start;
            align-content: flex-start;
            padding: 0px;
            gap: 12px;

            width: 100%;
            height: auto;


            /* Inside auto layout */
            flex: none;
            order: 1;
            align-self: stretch;
            flex-grow: 0;

        }

    .title{
        /* Frame 108 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 0px;
        gap: 12px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
    }

    .top-title{
        /* Berita Terbaru */



        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 24px;
        /* identical to box height, or 120% */
        text-align: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 0;

    }

    /* GPR Info*/
    .gpr-komdigi-layout{
        /* Frame 380 */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 16px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 2;
        flex-grow: 0;

    }
    .gpr-komdigi-layout .title{
        /* Frame 108 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 0px;
        gap: 12px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
    }
    .gpr-komdigi-layout .title .top-title{
        /* Berita Terbaru */



        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 24px;
        /* identical to box height, or 120% */
        text-align: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }
    .gpr-komdigi-layout .layout-gpr{
        /* Frame 419 */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 80px 8px 24px;
        gap: 12px;

        width: 100%;
        height: auto;

        /* Color/Primary */
        background: #055A9E;
        border-radius: 8px;

        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;

    }
    .gpr-komdigi-layout .layout-gpr #gpr-kominfo-widget-header{
        display:none;
    }
    .button-tag {
        display: inline-flex;
        align-items: center; /* Sejajarkan elemen secara vertikal */
        gap: 2px; /* Jarak antara ikon dan teks */
        border: none; /* Hilangkan border */
        background-color: transparent; /* Transparan agar sederhana */
        font-size: 9px;
        color: #333; /* Warna teks */
        cursor: pointer;
        transition: background-color 0.3s ease;
        text-align: center; /* Pastikan teks berada di tengah */
        line-height: 1; /* Pastikan tinggi baris sesuai dengan teks */
    }
    .button-tag span:hover {
        color: #BA5B03; /* Ubah warna teks saat hover */
        text-decoration:none;

    }
    .button-tag span{

        font-style: normal;
        font-weight: 400;
        font-size: 8px;
        line-height: 12px;
        display: flex;
        align-items: center;
        color: #131313;
        flex: none;
        flex-grow: 0;
        text-decoration:none;
    }

    .button-tag img {
        width: 10px; /* Ukuran ikon */
        height: 10px;
        object-fit: contain; /* Pastikan gambar tetap menjaga aspek rasio */
        display: inline-block;
        vertical-align: middle; /* Selaraskan gambar secara vertikal */
        margin-top: 2px; /* Sesuaikan posisi gambar */
    }

    .layout-66{
            /* Frame 55 */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 24px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 1;
    }
    .layout-33{
            /* Frame 55 */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 24px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 1;
    }

    .layout-66 .title{
        /* Frame 108 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 0px;
        gap: 12px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
    }
    .layout-66 .content-data{
        /* Frame 277 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 0px;
        gap: 30px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        align-self: stretch;
        flex-grow: 0;
        padding-right: 10px;
    }
    .layout-66 .content-data .siaran-pers-layout{
        /* Item Layout */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 18px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;

    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers{
        /* Content Item Tile */

        box-sizing: border-box;

        /* Auto layout */
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;


    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers{
        /* Frame 426 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 0px;
        gap: 16px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;

    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .img-siaran-pers{
        /* image 21 */

        width: 100px;
        height: 100px;

        border-radius: 10px;

        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;

    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content{
        /* Card Content */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 6px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 1;


    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content .title-siaran{
        /* Content */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 4px;

        width: 70%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;


    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content .title-siaran .judul{
        /* Anugerah Kihajar 2024: Semangat Berkobar (Berkolaborasi dan Berbagi) untuk Indonesia Kuat */



        font-style: normal;
        font-weight: 700;
        font-size: 14px;
        line-height: 16px;
        /* or 133% */

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;



    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content .title-siaran .tanggal-siaran{
        /* Frame 221 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 0px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;



    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content .title-siaran .tanggal-siaran .left-siaran{
        /* Siaran Pers */


        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        color: #580116;


        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;




    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content .title-siaran .tanggal-siaran .line-height {
        width: 1px; /* Lebar garis vertikal */
        height: 10px; /* Sesuaikan tinggi garis dengan parent */
        background-color: #6D6E71; /* Warna garis */
        margin: 0 8px; /* Jarak horizontal dengan elemen lain */
        align-self: center; /* Pastikan garis berada di tengah */
    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content .title-siaran .tanggal-siaran .middle-berita{
        /* 19 September 2022 */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;


    }
    .layout-66 .content-data .siaran-pers-layout .data-siaran-pers .card-siaran-pers .card-content .title-siaran .tanggal-siaran .right-berita{
        /* (dilihat 600 kali) */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Secondary */
        color: #6D6E71;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;



    }

    .title .top-title{
        /* Berita Terbaru */



        font-style: normal;
        font-weight: 700;
        font-size: 20px;
        line-height: 24px;
        /* identical to box height, or 120% */
        text-align: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 1;
        flex-grow: 0;

    }
    .title .midle-height{
        border-bottom: 1px solid black;
        height: 1px;
        width: 100%;
        order: 2;

    }
    .layout-33 .title{
        /* Frame 108 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: center;
        padding: 0px;
        gap: 12px;

        width: 100%;
        height: auto;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;
    }
    .layout-33 .content-data .pengumuman-layout{
        /* Item Layout */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 18px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;

    }
    .layout-33 .content-data .pengumuman-layout .filter-pengumuman {
      display: flex;
      flex-wrap: wrap;
      gap: 12px;
    }
    .layout-33 .content-data .pengumuman-layout .filter-pengumuman .tab-action {
      display: flex;
      justify-content: center;
      align-items: center;
      padding: 12px 16px;
      background: #F5F5F5;
      box-shadow: 0px 4px 8px rgba(0, 0, 0, 0.04), 0px 0px 4px rgba(0, 0, 0, 0.08);
      border-radius: 8px;
      cursor: pointer;
    }
    .layout-33 .content-data .pengumuman-layout .filter-pengumuman .tab-action.active {
      background: #055A9E;
      color: #FFFFFF;
    }
    .layout-33 .content-data .pengumuman-layout .filter-pengumuman .tab-action .text-filter {
      font-family: 'Plus Jakarta Sans', sans-serif;
      font-size: 16px;
      font-weight: 700;
    }
    .layout-33 .content-data .pengumuman-layout .filter-pengumuman .tab-action:hover{
        color:#BA5B03;

    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman {
        /* Frame 277 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 0px;
        gap: 30px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 1;

    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman{
        /* Item Layout */

        /* Auto layout */
        display: flex;
        flex-direction: column;
        align-items: flex-start;
        padding: 0px;
        gap: 18px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 1;

    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman{
        /* Content Item Tile */

        box-sizing: border-box;

        /* Auto layout */
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0px;
        gap: 16px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;

    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman .card-pengumuman{
        /* Content Item Tile */

        box-sizing: border-box;

        /* Auto layout */
        display: flex;
        flex-direction: column;
        justify-content: center;
        align-items: center;
        padding: 0px;
        gap: 16px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;

    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman .card-pengumuman .judul{
        /* Anugerah Kihajar 2024: Semangat Berkobar (Berkolaborasi dan Berbagi) untuk Indonesia Kuat */



        font-style: normal;
        font-weight: 700;
        font-size: 18px;
        line-height: 24px;
        /* or 133% */

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        order: 0;
        align-self: stretch;
        flex-grow: 0;


    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman .card-pengumuman .tanggal-siaran{
        /* Frame 221 */

        /* Auto layout */
        display: flex;
        flex-direction: row;
        align-items: flex-start;
        padding: 0px;

        width: 100%;
        height: 100%;


        /* Inside auto layout */
        flex: none;
        order: 1;
        align-self: stretch;
        flex-grow: 0;



    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman .card-pengumuman .tanggal-siaran .left-siaran{
        /* Siaran Pers */


        font-style: normal;
        font-weight: 600;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        color: #BA5B03;


        /* Inside auto layout */
        flex: none;
        order: 0;
        flex-grow: 0;




    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman .card-pengumuman .tanggal-siaran .line-height {
        width: 1px; /* Lebar garis vertikal */
        height: 10px; /* Sesuaikan tinggi garis dengan parent */
        background-color: #6D6E71; /* Warna garis */
        margin: 0 8px; /* Jarak horizontal dengan elemen lain */
        align-self: center; /* Pastikan garis berada di tengah */
    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman .card-pengumuman .tanggal-siaran .middle-berita{
        /* 19 September 2022 */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Primary */
        color: #131313;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;


    }
    .layout-33 .content-data .pengumuman-layout .data-pengumuman .item-pengumuman .content-pengumuman .card-pengumuman .tanggal-siaran .right-berita{
        /* (dilihat 600 kali) */



        font-style: normal;
        font-weight: 400;
        font-size: 12px;
        line-height: 14px;
        /* identical to box height, or 117% */
        display: flex;
        align-items: center;

        /* Text/Secondary */
        color: #6D6E71;


        /* Inside auto layout */
        flex: none;
        flex-grow: 0;



    }
}

@keyframes slideUpFade {
    from {
        opacity: 0;
        transform: translateX(-50%) translateY(20px); /* Muncul dari bawah */
    }
    to {
        opacity: 1;
        transform: translateX(-50%) translateY(0); /* Ke posisi normal */
    }
}


@keyframes slideIn {
    0% {
        transform: translateX(100%);
        opacity: 0;
    }
    50% {
        transform: translateX(10%);
        opacity: 0.5;
    }
    100% {
        transform: translateX(0);
        opacity: 1;
    }
}

@keyframes slideOut {
    0% {
        transform: translateX(0);
        opacity: 1;
    }
    100% {
        transform: translateX(-100%);
        opacity: 0;
    }
}