@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@100;200;300;400;500;600;700;800;900&display=swap');
@import url('https://fonts.googleapis.com/css2?family=Roboto:wght@300;400;500;700&display=swap');

:root{
    --warna-menu:#6B7D5D;
    --warna-menu-teks:#ADB7A5;
    --warna-menu-teks-pilih:#fff;
}

*{
    margin:0;
    padding:0;
    box-sizing: border-box;
}

a, a:hover{
    text-decoration:none;
    color:#000;
}

.tutup{
    font-family: 'Roboto', sans-serif;
}

header{
    min-height:75px;
    background:#fff;
}

.tutup_header{
    width:70vw;
    min-height:75px;
    margin:0 auto;
    display:flex;
    align-items:center;
    justify-content: space-between;
}

header .gambar_header{
    height:40px;
}

.tutup_menu ul {
  list-style-type: none;
  margin: 0;
  padding: 0;
  overflow: hidden;
}

.tutup_menu li {
  float: left;
}

.tutup_menu li a {
  display: block;
  color: white;
  text-align: center;
  padding: 14px 20px;
  text-decoration: none;
  background-color: #fff;
  opacity:0.7;
  color:#000;
  transition:all 0.3s ease;
  font-weight:500;
  font-size:15px;
  letter-spacing:0.2px;
}

.tutup_menu li a:hover {
  opacity:1;
}


.tutup_main{
    min-height:50vh;
    background:#F4F6FA;
    padding-bottom:30px;
}





.tutup_dokumen_cari{
    min-height:210px;
    background:grey;
    background-image: url("https://jdih.natunakab.go.id/dokumen-hukum/aset/img/bg-judul.webp");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    display:flex;
    align-items:center;
}

.kotak_cari{
    width:830px;
    max-width:90%;
    margin:30px auto;
    background:#fff;
    border-radius:15px;
    padding:20px;
}

.kotak_cari_atas{
    display:flex;
    flex-wrap: wrap;
    justify-content: space-between;
    width:100%;
}

.kotak_cari_form_ful, .kotak_cari_form{
    /*border:1px solid black;*/
    margin:10px 0;
}

.kotak_cari_form{
    width:calc(50% - 10px);
}

.kotak_cari p{
    font-size:17px;
    font-weight:500;
    letter-spacing:.2px;
}

.kotak_cari select, .kotak_cari input{
    width:100%;
    padding:10px;
    border-radius:5px;
    border-color:#E6E8EB;
    background:#F9F9F9;
    font-size:16px;
    letter-spacing:.2px;
}

.kotak_cari input{
    border:1px solid #E6E8EB;
}

.kotak_cari select option{
    font-size:17px;
    line-height:20px;
    /*padding:10px !important;*/
    /*zoom:1.2;*/
}

.kotak_cari_form_ful{
    width:100%;
    display:flex;
    justify-content: space-between;
    margin-top:20px;
}

.input_cari{
    position:relative;
    width:calc(100% - 150px);
}

.input_cari i{
    position:absolute;
    top: 50%;
    transform: translateY(-50%);
    left:10px;
    font-size:21px;
    color:#A1A5B7;
}

.input_cari input{
    padding-left:38px;
    background:#F9F9F9;
    /*border-color:#F9F9F9;*/
    transition:all 0.3s ease;

}

.input_cari input:focus{
    background:#F4F4F4;
    outline: none;
}

.input_cari input::placeholder {
  color: #A1A5BD;
}

.kotak_cari .tombol_submit{
    background:#0A2647;
    transition:all 0.3s ease;
    color:#fff;
    border-radius:10px;
    border:none;
    width:130px;
}

.kotak_cari .tombol_submit:hover{
    background:#2884EF;
}



.tutup_dokumen{
    width:70vw;
    margin:20px auto;
    background:#fff;
    padding:30px 20px;
    border-radius:15px;
}

.tabel_dokumen th{
    background:#F1F4FF;
}

.tabel_dokumen .td_judul{
    min-width:400px;
}












.tutup_judul{
    min-height:210px;
    background:grey;
    background-image: url("https://jdih.natunakab.go.id/dokumen-hukum/aset/img/bg-judul.webp");
    background-position: top center;
    background-repeat: no-repeat;
    background-size: cover;
    /*backdrop-filter: blur(8px);*/
    display:flex;
    align-items:center;
}

.kotak_judul{
    width:70vw;
    margin:auto;
}

.kotak_judul p{
    color:#fff;
}

.kotak_judul p:first-child{
    color:#fff;
    opacity:0.5;
    margin-bottom:25px;
    font-size:18px;
    font-weight:500;
    letter-spacing:.2px;
}

.kotak_judul p:last-child{
    font-size:23px;
    font-weight:600;
    letter-spacing:.2px;
}

.tutup_detail{
    /*padding:30px 15vw;*/
    width:70vw;
    margin:30px auto;
    display:flex;
    justify-content: space-between;
}

.detail_kiri{
    width:65%;
}

.detail_kanan{
    width:calc(35% - 30px);
    
}

.kotak_detail{
    min-height:130px;
    background:#fff;
    border:1px solid #F4F4F4;
    margin-bottom:25px;
    border-radius:15px;
}

.kotak_detail_label{
    border-bottom:1px solid #E1E3EA;
    height:65px;
    display:flex;
    align-items:center;
    padding-left:20px;
}

.kotak_detail_label i{
    color:#0A2647;
    font-size:26px;
    margin-right:14px;
}

.kotak_detail_label p{
    font-weight:500;
    color:#0A2647;
    letter-spacing:.2px;
}


.kotak_detail_isi{
    padding:20px;
    font-size:15px;
}

.abstrak{
    line-height:22px;
    font-weight:300;
    letter-spacing:.2px;
}

.tabel_detail{
    width:100%;
    border-collapse: collapse;
    margin-bottom:30px;
}

.tabel_detail tr:nth-child(odd) {
    background-color: #F1F4FF;
    
}

.tabel_detail td{
    padding:17px;
    letter-spacing:.2px;
}

.tabel_detail td:first-child{
    font-weight:500;
    width:210px;
}

.kotak_detail_file{
    display:flex;
    justify-content: space-between;
    margin:12px 0 20px 0;
}

.kotak_detail_file button, .kotak_detail_file a{
    background:#0A2647;
    color:#fff;
    display:flex;
    align-items:center;
    justify-content:center;
    width:calc(50% - 14px);
    height:35px;
    border-radius:8px;
    font-size:14px;
    /*font-weight:500;*/
    border:none;
    transition:all 0.5s ease;
    cursor:pointer;
}

.kotak_detail_file button:hover, .kotak_detail_file a:hover{
    background:#2884EF;
}

.kotak_detail_file i{
    margin-right:7px;
    font-size:18px;
}

.detail_status{
    background:#F1F4FF;
    padding:12px 20px;
}

.p_status{
    line-height:24px;
    margin:12px 0 15px 20px;
    
}

.p_status a{
    color:#F1416C;
}

.kotak_detail_isi .belum{
    color:#F1416C;
}



.tutup_pdf{
    width:100%;
    height:100vh;
    position:fixed;
    top:0;
    left:0;
    z-index:100;
    background:rgba(0,0,0,0.5);
    opacity:0;
    visibility:hidden;
    transition:all 0.5 ease;
}

.tutup_pdf.bukapdf{
    opacity:1;
    visibility:visible;
}

.kotak_pdf{
    width:70.7vh;
    height:calc(100vh - 60px);
    margin:30px auto;
    background:#fff;
    border-radius:10px;
    z-index:101;
    padding:15px;
}

.kotak_pdf object{
    width:calc(70.7vh - 30px);
    height:calc(100vh - 60px - 30px);
}








footer{
    background:#0A2647;
    width:100%;
    /*padding:0 16vw;*/
}

footer h3{
    color:#fff;
    opacity:0.5;
    margin-bottom:10px;
}

footer a, footer p{
    color:#fff;
    font-size:14px;
}

footer a:hover{
    color:#fff;
}

.footer_atas{
    display:flex;
    width:70vw;
    margin:0 auto;
    padding:30px 0;
}

.footer-box{
    width:25%;
    padding:10px;
}

.footer_bawah{
    border-top:1px solid rgba(255,255,255,0.2);
    height:40px;
}

.copyright{
    color:#fff;
    opacity:0.5;
    font-size:13px;
    line-height:40px;
}




@media only screen and (max-width: 720px) {
.tutup_dokumen{
    width:calc(99vw - 20px);
    /*margin:20px auto;*/
    /*padding:30px 20px;*/
}

.tutup_detail{
    width:calc(99vw - 20px);
    flex-direction: column;
}
    
.detail_kiri, .detail_kanan{
    width:100%;
}

.footer_atas{
    flex-wrap: wrap;
    width:calc(99vw - 10px);
}

.footer-box{
    width:50%;
}

.tabel_detail td:first-child{
    width:100px;
}

}