.kiri {
    display: table-cell;
    box-sizing: border-box;
    vertical-align: top;
    width: 25vw;
}

.wdh-flt {
    box-sizing: border-box;
    width: 23.5vw;
    border: .1vw solid var(--wrn-grs);
    border-radius: 5px;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

.jdl-flt {
    display: block;
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-weight: bold;
    padding: 0 .5vw;
    border: 1px solid rgb(200, 200, 200);
    background-color: rgb(200, 200, 200);
    border-top-right-radius: 5px;
    border-top-left-radius: 5px;
}

.flt {
    border-bottom: 1px solid rgb(200, 200, 200);
}

.flt:nth-of-type(n+3) {
    border: none;
}

.jns-flt {
    box-sizing: border-box;
    width: 100%;
    height: 30px;
    line-height: 30px;
    font-weight: bold;
    padding: 0 .5vw;
    background-color: rgba(0, 0, 0, 0);
    font-size: 14px;
    margin-bottom: 5px;
    display: block;
}

.flt:not(.urt) .plh {
    position: relative;
    width: 20.5vw;
    display: block;
    margin: 0 15px 15px 15px;
    font-size: 15px;
}

.flt:not(.urt) .plh-tmb {
    border-bottom: 1px solid var(--wrn-grs);
    height: 39px;
    cursor: pointer;
}

.flt:not(.urt) .plh-isi:first-of-type {
    width: calc(100% - 39px);
    padding-right: 1.4vw;
}

.flt:not(.urt) .plh-tmb:hover {
    color: var(--wrn-utm);
}

.flt:not(.urt) .plh-isi:first-of-type.trp {
    border-left: none;
    padding-left: 1.4vw;
    font-weight: bold;
}

.isn-hrg {
    display: block;
    margin: 0 15px 15px 15px;
    width: 20.5vw;
}

.isn-hrg:focus {
    outline: none;
    border-color: #ee4d2d;
}

.flt label {
    display: inline-block;
    box-sizing: border-box;
    width: 7vw;
    margin: 0 20px 15px 20px;
    cursor: pointer;
    user-select: none;
}

.kanan {
    position: relative;
    display: table-cell;
    box-sizing: border-box;
    width: 71vw;
}

.shortcut-urutan{
    margin-bottom: 20px;
    position: relative;
    height: 40px;
    line-height: 40px;
}

.shortcut{
    width: 51.5vw;
}

.urutan {
    position: absolute;
    right: 0;
    top: 0;
    box-sizing: border-box;
    height: 40px;
    width: 19vw;
    text-align: left;
    user-select: none;
    z-index: 2;
}

.urutan .plh-isi{
    text-align: left;
}

.urutan .jns-flt {
    display: inline-block;
    width: max-content;
    height: 40px;
    line-height: 40px;
    vertical-align: top;
    font-weight: bold;
}

.urutan .plh{
    position: absolute;
    right: 0;
    top: 0;
}

.wdh-brg {
    margin-bottom: 50px;
    font-size: 0;
}

.brg {
    background-color: white;
    position: relative;
    display: inline-block;
    vertical-align: top;
    box-sizing: border-box;
    width: 23vw;
    height: max-content;
    overflow: hidden;
    padding: 1vw;
    font-size: 16px;
    margin-bottom: 2vw;
    border-radius: 5px;
    box-shadow: 0 0 2px .5px rgba(100, 100, 100, .3);
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

.brg:nth-of-type(3n+2) {
    margin: 0 1vw 2vw 1vw;
}

.bar {
    position: absolute;
    right: -3.4vw;
    top: 2.5vw;
    transform: rotate(45deg);
    box-sizing: content-box;
    width: 15vw;
    height: 20px;
    line-height: 20px;
    text-align: center;
    padding: 5px 0;
    font-size: 14px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}

.diskon {
    position: absolute;
    right: -5.5vw;
    top: 2.5vw;
    transform: rotate(45deg);
    box-sizing: content-box;
    width: 20vw;
    height: 35px;
    line-height: 35px;
    text-align: center;
    padding: 5px 0;
    font-weight: bold;
    font-size: 18px;
    -webkit-transform: rotate(45deg);
    -moz-transform: rotate(45deg);
    -ms-transform: rotate(45deg);
    -o-transform: rotate(45deg);
}

.bar {
    background-color: #ee4d2d;
    color: rgb(250, 250, 250);
}

.diskon {
    background-color: rgb(255, 212, 36);
    color: #ee4d2d;
    font-weight: bold;
}

.brg-frm-fot {
    display: flex;
    justify-content: center;
    align-items: center;
    box-sizing: border-box;
    width: 21vw;
    height: 21vw;
    border-radius: 5px;
    overflow: hidden;
    -webkit-border-radius: 5px;
    -moz-border-radius: 5px;
    -ms-border-radius: 5px;
    -o-border-radius: 5px;
}

.brg-frm-fot img.kot {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
}

.brg-frm-fot img.dow {
    box-sizing: border-box;
    height: 100%;
}

.brg-frm-fot img.dhu {
    box-sizing: border-box;
    width: 100%;
}

.brg-frm-fot .brg-tnp-fot {
    box-sizing: border-box;
    width: 100%;
    height: 100%;
    text-align: center;
    font-weight: bold;
    font-size: 18px;
    line-height: 21vw;
    border: 5px solid rgb(150, 150, 150);
    color: rgb(150, 150, 150);
    background-color: rgb(200, 200, 200);
}

.brg-nam {
    display: block;
    box-sizing: border-box;
    width: 21vw;
    font-weight: bold;
    margin: 10px 0;
}

.brg-hrg {
    box-sizing: border-box;
    width: 21vw;
    font-weight: bold;
    color: #ee4d2d;
}

.harga-awal span {
    display: inline-block;
    padding: 2px;
    font-size: 12px;
}

.harga-awal span:first-of-type {
    color: #F94D63;
    background-color: #FFDBE2;
    text-decoration: none;
    padding: 2px 4px;
    border-radius: 2px;
    -webkit-border-radius: 2px;
    -moz-border-radius: 2px;
    -ms-border-radius: 2px;
    -o-border-radius: 2px;
}

.harga-awal span:nth-of-type(2) {
    margin-top: 5px;
    text-decoration: line-through;
    color: rgb(100, 100, 100);
}

.wdh-brg .brg:hover {
    color: inherit;
}

.wdh-hlm {
    position: absolute;
    bottom: 0;
    left: 10px;
    right: 0;
    box-sizing: border-box;
    height: 50px;
    text-align: right;
}

.wdh-hlm .tmb {
    margin: 5px 5px 0 0;
}

.wdh-hlm .hlm {
    cursor: default;
    background-color: #ee4d2d;
    color: white;
}

.wdh-hlm .ttk {
    background-color: white;
    cursor: default;
}

.wdh-hlm .hlm:hover {
    color: white;
}

.wdh-hlm .ttk:hover {
    color: rgb(80, 80, 80);
}