
@media screen and  (min-width: 1250px) {
    .gubwagub-baru {
        width: 892px;
        height: 630px;        
    }
    .jaring2 {          
          width: 450px;
          height: 450px;
        }
}
@media  screen and (max-width: 1249px) {
    .gubwagub-baru {
        width: 714px;
        height: 513px;
    }
    .jaring2 {
          padding-top: 50px;
          width: 300px;
          height: 300px;
        }
}

@media  screen and (max-width: 991px) {
    .gubwagub-baru {
        width: 500px;
        height: 360px;
    }
    .jaring2 {
          padding-top: 50px;
          width: 300px;
          height: 300px;
        }
}
@media  screen and (max-width: 500px) {
    .gubwagub-baru {
        width: 350px;
        height: 252px;
    }
    .jaring2 {
          padding-top: 50px;
          width: 300px;
          height: 300px;
        }
}



.pelangi-aja {
    color: transparent;    
    background: linear-gradient(to top right,rgb(250, 46, 46),rgb(151, 1, 1));
    background-clip: text;
}
.difable-position {
    position: fixed;
    margin-top: 50vh;
    z-index: 1000;
}

.difable-image:hover {
    box-shadow: 0px 0px 10px rgb(63, 207, 255);
    transition-duration: 0.5s;
    cursor: pointer;
    transform: scale(1.1);
}

.card-urusan {
    min-width: 250px;
    max-width: 250px;
    background: linear-gradient(to bottom,rgb(255, 229, 196),white);
    border:1px solid lightcoral;
    padding:10px;
    border-radius: 10px;
    transition-duration: 0.5s;
    margin:10px;
    min-height: 250px;
    max-height: 250px;
    cursor: pointer;
}

.card-urusan:hover {
    transform: translateY(-5px);
    box-shadow: 0px 0px 20px lightcoral;
    transition-duration: 0.5s;
    background-color: white;
    color:red;
}


.difable-image {
    border-radius: 50%;
    transition-duration: 0.5s;
    border: 1px solid lightblue;
}

.card-terbaru {
    min-width: 450px;
    max-width: 450px;
    padding-left: 20px;
    padding-right: 20px;
    padding-top:40px;
    padding-bottom: 40px;
    border-radius: 10px;
    background-color: rgb(29, 53, 87);
    min-height: 500px;
    max-height: 500px;
    transition-duration: 0.5s;
    margin: 10px;
    color:white;
}

.card-terbaru:hover {
    transform: translateY(-5px);
    
}

.pilih-terbaru:focus {
    box-shadow: 0 0 5px white;
    transition-duration: 0.5s;
}

.pilih-terbaru:hover {
    box-shadow: 0 0 5px lightyellow;
}

@media (max-width: 768px) {    
    .pilih-terbaru {
        height: 35px;
        font-size: 15px;
        margin-top:-1px;
        font-weight: bold;
        color:rgb(29, 53, 87);
        transition-duration: 0.5s;
    }

    .urusan-pelangi {
        color: transparent;
        font-size: 27px;
        font-weight: bold;
        background: linear-gradient(to bottom,yellow,red);
        background-clip: text;
    }

    .dataset-putih {
        color: white;
        font-size: 27px;
        font-weight: bold;   
        margin-left: 15px;     
    }

    .urusan-biasa {
        color: white;
        font-size: 27px;
        font-weight: bold;        
    }

    .urusan-search {
        width: 350px;
        margin-left: 5px;
    }

    .card-terbaru {
        min-width: 350px;
        max-width: 350px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(29, 53, 87);
        min-height: 500px;
        max-height: 500px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }
    .card-terbaru-infografik {
        min-width: 350px;
        max-width: 350px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(29, 87, 51);
        min-height: 500px;
        max-height: 500px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }
    .card-terbaru-artikel {
        min-width: 350px;
        max-width: 350px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(59, 29, 87);
        min-height: 500px;
        max-height: 500px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }
    .card-terbaru-regulasi {
        min-width: 350px;
        max-width: 350px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(87, 29, 72);
        min-height: 500px;
        max-height: 500px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }
    .jaring-background {
        position: absolute;
        opacity: 5%;
        z-index: -1;
        width: 350px;
        height: 350px;
        margin-left: auto;
        margin-right: auto;
        left:0;
        right:0;
        text-align: center;
    }
}

@media (min-width: 769px) {
    .urusan-pelangi {
        color: transparent;
        font-size: 40px;
        font-weight: bold;
        background: linear-gradient(to bottom,yellow,red);
        background-clip: text;
    }

    .dataset-putih {
        color: white;
        font-size: 40px;
        font-weight: bold;        
        margin-left: 15px;
    }

    .urusan-biasa {
        color: white;
        font-size: 40px;
        font-weight: bold;        
    }

    .urusan-search {
        width: 500px;
    }

    .pilih-terbaru {
        height: 40px;
        font-weight: bold;
        color:rgb(29, 53, 87);
        transition-duration: 0.5s;
    }

    .card-terbaru {
        min-width: 450px;
        max-width: 450px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(29, 53, 87);
        min-height: 400px;
        max-height: 400px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }

    .card-terbaru-infografik {
        min-width: 450px;
        max-width: 450px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(29, 87, 51);
        min-height: 400px;
        max-height: 400px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }
    .card-terbaru-artikel {
        min-width: 450px;
        max-width: 450px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(59, 29, 87);
        min-height: 400px;
        max-height: 400px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }
    .card-terbaru-regulasi {
        min-width: 450px;
        max-width: 450px;
        padding-left: 20px;
        padding-right: 20px;
        padding-top:40px;
        padding-bottom: 40px;
        border-radius: 10px;
        background-color: rgb(87, 78, 29);
        min-height: 400px;
        max-height: 400px;
        transition-duration: 0.5s;
        margin: 10px;
        color:white;
    }

    .jaring-background {
        position: absolute;
        opacity: 5%;
        z-index: -1;
        width: 1000px;
        height: 1000px;
    }
}
