/* Tampilan Resolusi FHD */
@media screen and (min-width: 1920px) {

    #wrapper_body {
        position: relative;
        z-index: 1;
        /* background-color: #ebf9ff; */
        background-color: white;
        transform: translate(0%, -14vh);
    }

    #inner-header {
        position: relative;
        z-index: 2;
        padding: 0%;
        /* background-color: brown; */
        max-width: 43vw;
        margin: auto;
        /* margin-top: 1.5%; */
        text-align: center;
        transform: translate(0%, 16vh);
    }

    #logo_rembang {
        width: 70%;
    }

    #center {
        margin: auto;
        color: ivory;
        /* width: 70%; */
        /* border: 3px solid #73AD21; */
        /* padding: 10px; */
    }

    #header {
        padding: 1.5% 0 1% 0;
        overflow: auto;
        background-image: url('../images/header1.jpg');
        filter: brightness(50%);
        background-size: cover;
        background-position-y: 75vh;
        height: 23vh;
        margin: auto;
        position: relative;
        z-index: 1;
    }

    #judul1 {
        font-size: 1.8vw;
        font-family: 'Lexend Deca', sans-serif;
        z-index: 2;
        transform: translate(0%, 0%);
        text-transform: uppercase;
    }

    #judul2 {
        font-size: 3.1vw;
        font-family: 'Lexend Deca', sans-serif;
        z-index: 2;
        margin-top: -2vh;
        transform: translate(0%, 0%);
        text-transform: uppercase;
    }

    .container-tabel {
        /* border: 2px solid rgb(255, 190, 190); */
        overflow: hidden;
        background-color: rgb(255, 224, 224);
        height: 30vh;
        width: 90vw;
        position: absolute;
        /* background-size: cover; */
        /* background-position: 0px 650px; */
        top: 32vh;
        left: 5vw;
        z-index: 2;
        border-radius: 10px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
    }

    .container-bawah {
        /* border: 3px solid rgb(228, 228, 228); */
        height: 46vh;
        width: 90vw;
        /* background-color:aquamarine; */
        top: 65vh;
        left: 5vw;
        position: absolute;
        border-radius: 10px;
        /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1); */
    }

    /* .judul-con-bawah {
        text-transform: uppercase;
        text-align: center;
        font-size: 2rem;
        font-family: 'Lexend Deca', sans-serif;
        font-weight: 900;
        margin-top: 1vh;
    } */

    #con-bawah-kiri {
        /* background-color:red; */
        height: 46vh;
        width: 50vw;
        padding: 0 0.5vw 0 0;
    }

    #con-bawah-kanan {
        height: 37vh;
        /* background-color:coral; */
        width: 50vw;
        padding: 0 0 0 0.5vw;
    }

    .kiri-atas {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        width: 44.5vw;
        height: 22vh;
        border-radius: 10px;
        display: flex;
        padding: 10px;
    }

    .kiri-bawah {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        margin-top: 2vh;
        /* background-color: cadetblue; */
        width: 44.5vw;
        height: 22vh;
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .kanan-atas {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        width: 44.5vw;
        height: 22vh;
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .kanan-bawah {
        margin-top: 2vh;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        width: 44.5vw;
        height: 22vh;
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .foto {
        width: 9vw;
        height: 100%;
        background-color: #fff;
        border-radius: 5px;
        overflow: hidden;
    }

    .keterangan {
        margin-left: 0.5vw;
        width: 33vw;
        height: 100%;
        /* background-color: #fff; */
        border-radius: 5px;
        /* box-shadow: inset 0 0 5px #999999; */
        overflow: hidden;
    }

    .nama {
        /* background-color:red; */
        height: 4vh;
        font-size: 1.5rem;
        font-family: 'Lexend Deca', sans-serif;
        /* color:red; */
        /* text-transform: uppercase; */
        font-weight: 900;
        /* font-style: italic; */
        /* text-align: center; */
    }

    .isi-foto {
        width: 9vw;
        height: 20vh;
        background-color: white;
        border-radius: 5px;
        box-shadow: inset 0 0 5px #999999;
        overflow: hidden;
    }

    .container-tabel-kecil {
        /* border: 2px solid rgb(255, 190, 190); */
        overflow: hidden;
        background-color: #ffeeee;
        height: 100%;
        border-radius: 5px;
        box-shadow: inset 0 0 5px #999999;
    }

    table {
        border-collapse: collapse;
        width: 100%;
    }

    th {
        padding: 8px;
        text-align: center;
        border-bottom: 1px solid #ddd;
        text-transform: uppercase;
        background-color: rgb(255, 75, 75);
        color: #fff;
    }

    td {
        padding: 8px;
        text-align: left;
        border-bottom: 1px solid rgb(255, 179, 179);
        background-color:blue
    }

    tr:hover {
        background-color: #ffe8e8;
    }

    .marquee1 {
        height: 27vh;
    }

    .marquee2 {
        height: 16vh;
    }
}










































/* Tampilan Resolusi HD */
@media screen and (min-width: 1366px) and (max-width: 1919px) {

    #wrapper_body {
        position: relative;
        z-index: 1;
        /* background-color: #ebf9ff; */
        background-color: white;
        transform: translate(0%, -14vh);
    }

    #inner-header {
        position: relative;
        z-index: 2;
        padding: 0%;
        /* background-color: brown; */
        max-width: 43vw;
        margin: auto;
        /* margin-top: 1.5%; */
        text-align: center;
        transform: translate(0%, 16vh);
    }

    #logo_rembang {
        width: 70%;
    }

    #center {
        margin: auto;
        color: ivory;
    }

    #header {
        padding: 1.5% 0 1% 0;
        overflow: auto;
        background-image: url('../images/header1.jpg');
        filter: brightness(50%);
        background-size: cover;
        background-position-y: 75vh;
        height: 23vh;
        margin: auto;
        position: relative;
        z-index: 1;
    }

    #judul1 {
        font-size: 1.8vw;
        font-family: 'Lexend Deca', sans-serif;
        z-index: 2;
        transform: translate(0%, 0%);
        text-transform: uppercase;
    }

    #judul2 {
        font-size: 3.1vw;
        font-family: 'Lexend Deca', sans-serif;
        z-index: 2;
        margin-top: -2vh;
        transform: translate(0%, 0%);
        text-transform: uppercase;
    }

    .container-tabel {
        /* border: 2px solid rgb(255, 190, 190); */
        overflow: hidden;
        background-color: rgb(255, 224, 224);
        height: 30vh;
        width: 90vw;
        position: absolute;
        /* background-size: cover; */
        /* background-position: 0px 650px; */
        top: 32vh;
        left: 5vw;
        z-index: 2;
        border-radius: 10px;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
    }

    .container-bawah {
        /* border: 3px solid rgb(228, 228, 228); */
        height: 46vh;
        width: 90vw;
        /* background-color:aquamarine; */
        top: 65vh;
        left: 5vw;
        position: absolute;
        border-radius: 10px;
        /* box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1); */
    }

    /* .judul-con-bawah {
        text-transform: uppercase;
        text-align: center;
        font-size: 2rem;
        font-family: 'Lexend Deca', sans-serif;
        font-weight: 900;
        margin-top: 1vh;
    } */

    #con-bawah-kiri {
        /* background-color:red; */
        height: 46vh;
        width: 50vw;
        padding: 0 0.5vw 0 0;
    }

    #con-bawah-kanan {
        height: 37vh;
        /* background-color:coral; */
        width: 50vw;
        padding: 0 0 0 0.5vw;
    }

    .kiri-atas {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        width: 44.5vw;
        height: 22vh;
        border-radius: 10px;
        display: flex;
        padding: 10px;
    }

    .kiri-bawah {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        margin-top: 2vh;
        /* background-color: cadetblue; */
        width: 44.5vw;
        height: 22vh;
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .kanan-atas {
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        width: 44.5vw;
        height: 22vh;
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .kanan-bawah {
        margin-top: 2vh;
        box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.05), 0 6px 20px 0 rgba(0, 0, 0, 0.1);
        background-color: rgb(240, 240, 240);
        border: 3px solid rgb(236, 236, 236);
        width: 44.5vw;
        height: 22vh;
        display: flex;
        border-radius: 10px;
        padding: 10px;
    }

    .foto {
        width: 9vw;
        height: 100%;
        background-color: #fff;
        border-radius: 5px;
        overflow: hidden;
    }

    .keterangan {
        margin-left: 0.5vw;
        width: 33vw;
        height: 100%;
        /* background-color: #fff; */
        border-radius: 5px;
        /* box-shadow: inset 0 0 5px #999999; */
        overflow: hidden;
    }

    .nama {
        /* background-color:red; */
        height: 4vh;
        font-size: 1.3rem;
        font-family: 'Lexend Deca', sans-serif;
        /* color:red; */
        /* text-transform: uppercase; */
        font-weight: 900;
        /* font-style: italic; */
        /* text-align: center; */
    }

    .isi-foto {
        width: 9vw;
        height: 20vh;
        background-color: white;
        border-radius: 5px;
        box-shadow: inset 0 0 5px #999999;
        overflow: hidden;
    }

    .container-tabel-kecil {
        /* border: 2px solid rgb(255, 190, 190); */
        overflow: hidden;
        background-color: #ffeeee;
        height: 100%;
        border-radius: 5px;
        box-shadow: inset 0 0 5px #999999;
    }

    table {
        border-collapse: collapse;
        width: 100%;
    }

    th {
        padding: 8px;
        text-align: center;
        border-bottom: 1px solid #ddd;
        text-transform: uppercase;
        background-color: rgb(255, 75, 75);
        color: #fff;
    }

    td {
        padding: 8px;
        text-align: left;
        border-bottom: 1px solid rgb(255, 179, 179);
    }

    tr:hover {
        background-color: #ffe8e8;
    }

    .marquee1 {
        height: 26vh;
    }

    .marquee2 {
        height: 15vh;
    }

}