/* @font-face {
    font-family: "Proxima Nova";
    src: url("Proxima-Nova-Regular.woff") format('woff');
} */

body {
    background: #ffffff;
    font-family: 'Roboto', sans-serif;
    font-weight: 400;
    font-size: 14px !important;
    text-align: left;
}

.header {
    max-height: 150px;
}

.img-header {
    margin-top: 0px;
}

.gambar {
    border-top: 5px solid #ebac24;
    width: 100%;
    margin-bottom: 12px;
}

.img-footer {
    width: 98px;
    height: 30px;
    margin-top: 15px;
    margin-top: 15px;
    /* border-radius: 100px; */
}

.card {
    background-color: transparent;
    margin-bottom: -10px;
    border: 0px;
    position: inherit;
    margin-top: 0px;
}

.nav-head {
    background-color: #ebac24;
    font-weight: 900;
    text-transform: uppercase;
    /* height: 35px; */
    padding-top: 10px;
    padding-bottom: 10px;
    margin-bottom: 0px;
}

.nav-bar {
    position: fixed;
    background: white;
    border-bottom: 1px solid #ebac24;
    width: 100%;
    margin-top: -86px;
    z-index: 1;
}

.text-left {
    margin: 6px 0 0px 0;
}

.img-header .img-right {
    margin-right: 50px;
}

.img-left {
    margin-top: 15px;
}

.bg-img {
    /* Working method */
    margin-top: 1px;
    background: white;
    border: 0;
}

h2.text-center {
    font-size: 24px;
}

.bg-img .bg-body {
    width: 470px;
    margin-top: auto;
    margin-bottom: auto;
}

.bg-bottom {
    /* Working method */
    margin-top: 1px;
    background-color: white;
    /* For browsers that do not support gradients */
    /* background-image: radial-gradient(white 1%, gray 15%, #02075C 60%); */
    /* Standard syntax (must be last) */
    background: -webkit-radial-gradient(0% 153px, black 0%, white 0%, #2b354e 0%);
    /* background: 
       /* top, transparent red, faked with gradient */
    /* linear-gradient( rgba(255, 254, 254, 0.884), rgba(12, 6, 39, 0.815)); */
    /* background-position: right; */
    background-size: 100%;
    background-repeat: repeat-y;
    height: auto;
    /*    text-align: left;*/
    color: #ffffff;
    border: 0;
}

.bg-bottom .bg-body {
    width: 500px;
    margin-top: auto;
    margin-bottom: auto;
}

.bg-bottom .bg-body .bg-cards {
    /* margin: 5px 5px 5px 0px; */
    width: 10%;
}

.bg-bottom .bg-body .bg-cards .bg-img {
    width: 90%;
    margin-left: auto;
    margin-right: auto;
    display: inherit;
}

img.img-carousel {
    width: 100%;
}

.btn-download {
    background-image: url(../img/MM%20Download%20Button_x2.png);
    /* #007bff; */
    /* Green */
    border: none;
    background-color: #ffffff00;
    background-size: 250px;
    /*    text-align: center;*/
    /* text-decoration: none; */
    display: inline-block;
    /*    font-size: 16px;*/
    /* margin: 4px 02px; */
    cursor: pointer;
    /* border-radius: 42px; */
    /* border: 1px #ffffff; */
    width: 250px;
    height: 65px;
    /* background-position: center; */
    /* background-size: 240px; */
    background-repeat: no-repeat;
    /* margin-left: auto; */
}

.btn-massage {
    background-image: url(../img/MM%20Message%20Button_x2.png);
    /* #007bff; */
    /* Green */
    border: none;
    background-color: #ffffff00;
    background-size: 250px;
    /*    text-align: center;*/
    /* text-decoration: none; */
    display: inline-block;
    /*    font-size: 16px;*/
    /* margin: 4px 02px; */
    cursor: pointer;
    /* border-radius: 42px; */
    /* border: 1px #ffffff; */
    width: 250px;
    height: 65px;
    /* background-position: center; */
    /* background-size: 240px; */
    background-repeat: no-repeat;
    /* margin-bottom: 10px; */
}

.bg-grey {
    background-color: #f1f1f3;
    margin-top: -20px;
}

.bg-grey .bg-body {
    width: 540px;
    margin-left: 0px;
    margin-right: 0px;
    margin-top: 17px;
    margin-bottom: 15px;
}

.bg-approve {
    background-color: #ffffff;
    border-radius: 5px;
    border: 1px solid #ebac24;
    height: fit-content;
    margin-top: 10px;
}

.img-carosel {
    margin-top: 10px;
    margin-bottom: 10px;
    margin-left: 0px;
}

.img-logo {
    /* margin-left: -6%; */
    /* margin-right: auto; */
    /* display: block; */
    width: 50%;
    /* margin-bottom: 37px; */
    padding: 0px 0px 40px 0;
}

.img-logo-mm {
    display: block;
    margin-top: -95px;
    width: 9%;
    margin-left: 81%;
    padding-bottom: 10px;
}

.text-product {
    font-weight: 400;
    /*    text-align: left;*/
    /* width: 100%; */
    /* margin-top: 10px; */
    margin-bottom: 10px;
    /*    font-size: 15px;*/
}

.list-product {
    width: 265px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 10px;
    margin-bottom: 10px;
    /* height: 400px; */
}

.item-note {
    width: 100%;
    font-size: 12px;
    font-weight: 500;
    /*    text-align: left;*/
}

.container.carouselSilde {
    height: auto;
    /* border-bottom: 1px solid salmon; */
    margin-bottom: 20px;
    margin-top: 10px;
    position: inherit;
    z-index: 0;
}

.product-head {
    /*    text-align: left;*/
    font-weight: bold;
    /*    font-size: 15px;*/
    margin-bottom: 10px;
}

.footer-image {
    width: 95px;
    height: 60px;
    /* margin-left: auto; */
    margin-right: auto;
    /* margin-bottom: auto; */
    /* margin-top: auto; */
}

.footer-image.image-center {
    margin-bottom: 0px;
    height: 0px;
}

.footer-image.img-bottom {
    padding-top: 27px;
}

.footer-bg {
    background: #ebac24;
    height: 21px;
    margin-top: 0px;
}

.carousel-browser {
    width: 277px;
    margin-left: auto;
    margin-right: auto;
    height: 100%;
    margin-bottom: 0px;
}

.container.carouselBanner {
    display: none;
}

li.btn-prymary {
    background: grey;
    height: 7px;
    border-radius: 100px;
    width: 10px;
}

li.btn-prymary.active {
    background: #000000;
    height: 7px;
}

.carousel-item.text-center {
    /*    font-size: 30px;*/
}

ul.carousel-indicators {
    z-index: 0;
    top: 100%;
}

.footer-col {
    width: 362px;
    margin-top: 10px;
    margin-left: auto;
    margin-right: auto;
}

.product-none {
    background-color: #eeeeee;
    width: 100%;
    border: 1px solid;
    text-align: center;
    padding-top: 50px;
    padding-bottom: 50px;
}

.addres-footer {
    font-weight: 100;
}

.row-img {
    width: 49%;
    margin-right: 7px;
    margin-bottom: 10px;
}

.row.title {
    margin-left: auto;
    margin-bottom: 10px;
    font-size: 14px;
}

.row-col-1 {
    margin-right: 10px;
}

.row-col-2 {
    margin-right: 10px;
}


/*.row.img-caroselBrochure img {
    width: 100%;
    height: 100%;
}*/

h4.head-title {
    font-weight: bold;
    margin-top: 15px;
}

.container.text-center {
    margin-top: 30px;
    margin-bottom: 30px;
    font-size: 35px;
    font-weight: bold;
}

.row.title2 {
    display: none;
}

.nav-address {
    margin: 85px auto auto auto;
    border-bottom: 1px solid #ebac24;
    padding: 5px;
}

.text-download {
    /* width: 350px; */
    margin-top: 10px;
}

.text-banner {
    width: 394px;
    font-size: 2rem;
    font-weight: 500;
    /* margin-bottom: .5rem; */
    line-height: 2rem;
}

.text-carosel {
    font-size: 39px;
    font-weight: 900;
    /* text-align: left; */
    padding-top: 20px;
}

.btn-center {
    background-position: center;
    display: inherit;
    margin-left: auto;
    margin-right: auto;
}

img.img-size {
    width: 110%;
}

.carousel-item-next,
.carousel-item-prev,
.carousel-item.active {
    height: auto;
}

.card-body.bg-body {
    width: 50px;
    height: auto;
    margin-top: auto;
    margin-bottom: auto;
}

.card-body.bg-body.float-left.divBanner.bottomBanner {
    width: 100%;
}

input[type=text],
select,
textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    margin-top: 6px;
    margin-bottom: 16px;
    resize: vertical;
}

input[type=email],
select,
textarea {
    width: 100%;
    padding: 12px;
    border: 1px solid #ccc;
    border-radius: 4px;
    box-sizing: border-box;
    margin-top: 6px;
    margin-bottom: 16px;
    resize: vertical;
}

input[type=submit] {
    background-color: #4CAF50;
    color: white;
    padding: 12px 20px;
    border: none;
    border-radius: 4px;
    cursor: pointer;
    width: 100px;
}

input[type=submit]:hover {
    background-color: #45a049;
}

.sidebar {
    position: -webkit-sticky;
    position: sticky;
    top: 0px;
    background: white;
}

.sidebar-search {
    top: 60px;
    position: sticky;
    position: -webkit-sticky;
}

.sidebar-table {
    position: -webkit-sticky;
    position: sticky;
    top: 450px !important;
}

.sidebar-thead {
    position: -webkit-sticky;
    position: sticky;
    top: 115px;
}

.sidebar-tbody {
    position: -webkit-sticky;
    position: sticky;
    top: 150px;
}

.style-table {
    background-color: transparent;
    width: auto;
    margin-bottom: 0px;
    top: 267px;
}

.style-input {
    padding-top: 15px;
    background-color: white;
}

.col-ref {
    width: 150px;
}

.input-search {
    background-image: url('../img/svg/close.svg'), url('../img/svg/Search.svg');
    background-position: right, left;
    background-repeat: no-repeat, no-repeat;
    padding: 5px 40px;
    background-position: -100px, -30px;
    background-size: 15px, 15px;
    background-origin: content-box;
}


/* .input-search {
    background-image: url('../img/svg/Search.svg'), url('../img/svg/close.svg');
} */

.input-search.x {
    background-position: right -30px center, left -30px center;
}

.input-search.onX {
    cursor: pointer;
}

.input-search::-ms-clear {
    display: none;
    width: 0;
    height: 0;
}

.sidebar-Top {
    position: -webkit-sticky;
    position: sticky;
    /* top: 550px; */
    margin-left: 1109px;
}

#img {
    object-fit: contain;
    width: 570px;
}

table#demo1 tr:hover {
    background-color: #2b354e;
}

.dv-note {
    margin-left: 10px !important;
}

@media only screen and (max-width: 1199px) {
    @media (min) {}
    .header {
        max-height: 150px;
    }
    .gambar {
        border-top: 5px solid ffeb7f;
        width: 100%;
    }
    .img-footer {
        width: 98px;
        height: 30px;
        margin-top: 15px;
        margin-top: 15px;
        /* border-radius: 100px; */
    }
    .card {
        background-color: transparent;
    }
    /*.nav-head {
        background-color: #ebac24;*/
    /*        font-family: 'Proxima Nova', sans-serif;*/
    /*font-weight: bold;
        text-transform: uppercase;
    }*/
    .nav-bar {
        position: fixed;
        background: white;
        border-bottom: 1px solid #ebac24;
        width: 100%;
        margin-top: -192px;
        z-index: 1;
    }
    .text-left {
        margin: 6px 0 0px 0;
    }
    /* .img-header { */
    /* size: 10px; */
    /* margin-top: 19px; */
    /* margin-bottom: 4px; */
    /* margin-left: 25px; */
    /* } */
    .img-header .img-right {
        margin-right: 50px;
    }
    .img-left {
        margin-top: 15px;
    }
    .bg-img {
        /* Working method */
        margin-top: 1px;
        background: white;
        /* top, transparent red, faked with gradient */
        /* linear-gradient(to right, rgba(255, 254, 254, 0), rgba(255, 255, 255, 0)),url('../img/MM Groupshot.jpg') no-repeat; */
        /* background-position: right; */
        /* background-size: 60%;  */
        /* height: 250px; */
        /*        text-align: left;*/
        border: 0;
    }
    .bg-img .bg-body {
        width: 470px;
    }
    .bg-bottom {
        /* Working method */
        margin-top: 1px;
        background-color: white;
        /* For browsers that do not support gradients */
        /* background-image: radial-gradient(white 1%, gray 15%, #02075C 60%); */
        /* Standard syntax (must be last) */
        background: -webkit-radial-gradient(0% 153px, black 0%, white 0%, #2b354e 0%);
        /* background: 
           /* top, transparent red, faked with gradient */
        /* linear-gradient( rgba(255, 254, 254, 0.884), rgba(12, 6, 39, 0.815)); */
        /* background-position: right; */
        background-size: 100%;
        background-repeat: repeat-y;
        height: auto;
        /*        text-align: left;*/
        color: #ffffff;
        border: 0;
    }
    .bg-bottom .bg-body {
        width: 50%;
        margin-bottom: auto;
        margin-top: auto;
    }
    .bg-bottom .bg-body .bg-cards {
        margin: 0px 0px 0px 0px;
        width: 20%;
    }
    .bg-bottom .bg-body .bg-cards .bg-img {
        background-color: #0000;
        /* padding-left: 0px; */
        /* padding-right: 23px; */
        /* margin-right: 450px; */
        /* border: 1px solid #000000; */
    }
    .btn-download {
        /* background-image: url(../img/MM-Download-Button.png); */
        /* #007bff; */
        /* Green */
        /* border: none; */
        /* background-color: #ffffff00; */
        /* padding: 5px; */
        /*        text-align: center;*/
        /* text-decoration: none; */
        /* display: inline-block; */
        /*        font-size: 16px;*/
        /* margin: 4px 02px; */
        /* cursor: pointer; */
        /* border-radius: 42px; */
        /* border: 1px #ffffff; */
        /* width: 50%; */
        height: 15%;
        /* background-position: center; */
        /* background-size: 240px; */
    }
    .bg-grey .bg-body {
        width: 425px;
        /*        font-size: 9px;*/
        /*        text-align: left;*/
        margin-top: 17px;
    }
    .bg-approve {
        background-color: #ffffff;
        border-radius: 5px;
        border: 1px solid #ebac24;
        height: fit-content;
        margin-top: 10px;
    }
    .img-carosel {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 10px;
    }
    .img-logo {
        /* margin-left: -6%; */
        /* margin-right: auto; */
        /* display: block; */
        width: 539px;
        margin-top: -16px;
        /* padding: 35px 0 0 0; */
    }
    .img-logo-mm {
        display: block;
        margin-top: -69px;
        width: 12%;
        margin-left: 81%;
        padding-bottom: 12px;
    }
    .text-product {
        font-weight: 100;
        /*        text-align: justify;*/
        width: 100%;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .list-product {
        width: 300px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .item-note {
        width: 100%;
        /*        font-size: 14px;*/
        font-weight: 500;
        /*        text-align: left;*/
    }
    /* .container.carouselSilde { */
    /* height: 300; */
    /* border-bottom: 0px solid salmon; */
    /* margin-bottom: 10%; */
    /* } */
    .product-head {
        /*        text-align: left;*/
        font-weight: bold;
        /*        font-size: 13px;*/
    }
    .footer-image {
        width: 95px;
        height: 60px;
        /* margin-left: auto; */
        margin-right: auto;
        /* margin-bottom: auto; */
        /* margin-top: auto; */
    }
    .footer-image.img-bottom {
        padding-top: 27px;
    }
    .footer-bg {
        background: #ebac24;
        height: 21px;
        /* margin-top: 10px; */
    }
    .container.carouselBanner {
        display: none;
    }
    ul.carousel-indicators {
        /* position: absolute; */
        top: 100%;
    }
    .carousel-item.text-center {
        /*        font-size: 30px;*/
    }
    .footer-col {
        width: 290px;
        margin-left: 10px;
        margin-left: auto;
        margin-right: auto;
    }
    .addres-footer {
        font-weight: 500;
        /*        font-size: 14px;*/
    }
    .row.title2 {
        display: none;
    }
    .nav-address {
        margin: 190px auto 10px auto;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 90px;
        background: white;
    }
    .sidebar-search {
        top: 370px;
        position: sticky;
        position: -webkit-sticky;
    }
    .sidebar-table {
        position: -webkit-sticky;
        position: sticky;
        top: 210px;
    }
    .sidebar-thead {
        position: -webkit-sticky;
        position: sticky;
        top: 115px;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 163px;
    }
    .sidebar.style-input {
        padding-top: 15px;
        padding-bottom: 15px;
        background-color: white;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 50px; */
        margin-left: 109px;
    }
    #img {
        object-fit: contain;
        width: 570px;
    }
}

@media only screen and (max-width: 1024px) {
    .header {
        max-height: 150px;
    }
    .gambar {
        border-top: 6px solid #ffeb7f;
        width: 100%;
    }
    .img-footer {
        width: 98px;
        height: 30px;
        margin-top: 15px;
        margin-top: 15px;
        /* border-radius: 100px; */
    }
    .card {
        background-color: transparent;
    }
    .card-body.bg-body {
        width: 50px;
        height: auto;
    }
    .nav-head {
        /*        background-color: #ebac24;*/
        /*font-family: 'Proxima Nova', sans-serif;*/
        font-weight: bold;
        font-size: 13px;
    }
    .btn-massage {
        background-image: url(../img/MM%20Message%20Button_x2.png);
        border: none;
        background-color: #ffffff00;
        background-size: 200px;
        /* text-align: center; */
        /* text-decoration: none; */
        display: inline-block;
        /* font-size: 16px; */
        /* margin: 4px 02px; */
        cursor: pointer;
        /* border-radius: 42px; */
        /* border: 1px #ffffff; */
        width: 250px;
        height: 65px;
        /* background-position: center; */
        /* background-size: 240px; */
        background-repeat: no-repeat;
        /* margin-bottom: 10px; */
    }
    .nav-bar {
        position: fixed;
        background: white;
        border-bottom: 1px solid #ebac24;
        width: 100%;
        margin-top: -85px;
        z-index: 1;
    }
    .text-left {
        margin: 6px 0 0px 0;
    }
    /* .img-header { */
    /* size: 10px; */
    /* margin-top: 19px; */
    /* margin-bottom: 4px; */
    /* margin-left: 25px; */
    /* } */
    .img-header .img-right {
        margin-right: 50px;
    }
    .img-left {
        margin-top: 15px;
    }
    .bg-img {
        /* Working method */
        margin-top: 1px;
        background: white;
        /* top, transparent red, faked with gradient */
        /* linear-gradient(to right, rgba(255, 254, 254, 0), rgba(255, 255, 255, 0)),url('../img/MM Groupshot.jpg') no-repeat; */
        /* background-position: right; */
        /* background-size: 60%;  */
        /* height: 250px; */
        /*        text-align: left;*/
        border: 0;
    }
    .bg-img .bg-body {
        width: 480px;
        padding: 0px;
        margin-top: 10px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: auto;
    }
    .bg-bottom {
        /* Working method */
        margin-top: 1px;
        background-color: white;
        /* For browsers that do not support gradients */
        /* background-image: radial-gradient(white 1%, gray 15%, #02075C 60%); */
        /* Standard syntax (must be last) */
        background: -webkit-radial-gradient(0% 153px, black 0%, white 0%, #2b354e 0%);
        /* background: 
           /* top, transparent red, faked with gradient */
        /* linear-gradient( rgba(255, 254, 254, 0.884), rgba(12, 6, 39, 0.815)); */
        /* background-position: right; */
        background-size: 100%;
        background-repeat: repeat-y;
        height: auto;
        /*        text-align: left;*/
        color: #ffffff;
        border: 0;
    }
    .bg-bottom .bg-body {
        width: 50%;
        margin-bottom: auto;
        margin-top: auto;
    }
    .bg-bottom .bg-body .bg-cards {
        /* margin: 0px 0px 0px 0px; */
        /* width: 25%; */
    }
    .bg-bottom .bg-body .bg-cards .bg-img {
        width: 90%;
        margin-left: auto;
        margin-right: auto;
        display: inherit;
    }
    .btn-download {
        /* background-image: url(../img/MM-Download-Button.png); */
        /* #007bff; */
        /* Green */
        /* border: none; */
        background-color: transparent;
        background-size: 200px;
        /*        text-align: center;*/
        /* text-decoration: none; */
        display: inline-block;
        /*        font-size: 16px;*/
        margin: 0px 0px;
        /* cursor: pointer; */
        /* border-radius: 42px; */
        /* border: 1px #ffffff; */
        width: 100%;
        height: 62px;
        /* background-position: center; */
        /* background-size: 240px; */
    }
    .bg-grey .bg-body {
        width: 450px;
        /*        font-size: 14px;*/
        /*        text-align: left;*/
        margin-top: 17px;
    }
    .bg-approve {
        background-color: #ffffff;
        border-radius: 5px;
        border: 2px solid #ebac24;
        height: fit-content;
        padding-left: 10px;
    }
    .img-carosel {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 10px;
    }
    .img-logo {
        margin-left: auto;
        /* margin-right: auto; */
        /* display: block; */
        width: 50%;
        margin-top: -16px;
        padding: 0px 0 0px 0;
    }
    .img-logo-mm {
        display: block;
        margin-top: -50px;
        width: 10%;
        margin-left: auto;
        padding-bottom: 15px;
    }
    .text-product {
        font-weight: 400;
        /*        text-align: left;*/
        width: 100%;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .list-product {
        width: 300px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .item-note {
        width: 100%;
        font-size: 12px;
        font-weight: 500;
        /*        text-align: left;*/
    }
    /* .container.carouselSilde { */
    /* height: 300; */
    /* border-bottom: 0px solid salmon; */
    /* margin-bottom: 10%; */
    /* } */
    .product-head {
        /*        text-align: left;*/
        font-weight: bold;
        /*        font-size: 15px;*/
    }
    .footer-image {
        width: 95px;
        height: 60px;
        /* margin-left: auto; */
        margin-right: auto;
        /* margin-bottom: auto; */
        /* margin-top: auto; */
    }
    .footer-image.img-bottom {
        padding-top: 27px;
    }
    .footer-bg {
        background: #ffeb7f;
        height: 21px;
        margin-top: 0px;
    }
    .container.carouselBanner {
        display: none;
    }
    ul.carousel-indicators {
        /* position: absolute; */
        top: 100%;
    }
    .carousel-item.text-center {
        font-size: 30px;
    }
    .footer-col {
        width: 290px;
        margin-left: 10px;
        margin-left: auto;
        margin-right: auto;
    }
    .addres-footer {
        font-weight: 500;
        font-size: 12px;
    }
    .nav-address {
        margin: 90px auto 0px auto;
        width: 100%;
        padding: 5px;
    }
    .btn-center {
        background-position: center;
        width: 100%;
    }
    img.img-size {
        width: 106%;
    }
    table#myTable tr td,
    th {
        padding: .3rem;
    }
    table#myTable tr th {
        /* position: fixed; */
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 80px;
        background: white;
    }
    .sidebar-search {
        top: 89px;
        position: sticky;
        position: -webkit-sticky;
    }
    .sidebar-table {
        position: -webkit-sticky;
        position: sticky;
        top: 210px;
    }
    .sidebar-thead {
        position: -webkit-sticky;
        position: sticky;
        top: 115px;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 163px;
    }
    .sidebar.style-input {
        padding-top: 15px;
        padding-bottom: 15px;
        background-color: white;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 645px; */
        margin-left: 924px;
    }
    #img {
        object-fit: contain;
        width: 570px;
    }
}

@media only screen and (max-width: 984px) {
    .nav-address {
        margin: 133px auto 10px auto;
        width: 100%;
        padding-left: 15px;
    }
    .nav-bar {
        position: fixed;
        background: white;
        border-bottom: 1px solid #ebac24;
        width: 100%;
        margin-top: -133px;
        z-index: 1;
    }
    .card-body.bg-body {
        width: auto;
        height: auto;
    }
    table#myTable tr td,
    th {
        padding: .3rem;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 90px;
        background: white;
    }
    .sidebar-table {
        position: -webkit-sticky;
        position: sticky;
        top: 210px;
    }
    .sidebar-thead {
        position: -webkit-sticky;
        position: sticky;
        top: 81px;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 165px;
    }
    .sidebar.style-input {
        padding-top: 15px;
        padding-bottom: 15px;
        background-color: white;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 473px; */
        margin-left: 678px;
    }
    #img {
        object-fit: contain;
        width: 570px;
    }
}

@media only screen and (max-width: 769px) {
    .header {
        max-height: 150px;
    }
    .gambar {
        border-top: 5px solid salmon;
        width: 100%;
    }
    .img-footer {
        width: 98px;
        height: 30px;
        margin-top: 15px;
        margin-top: 15px;
        /* border-radius: 100px; */
    }
    .card {
        background-color: transparent;
    }
    .card-body.bg-body {
        width: 100%;
        height: auto;
        margin: 0px 0px 0px 0px;
    }
    /*.nav-head {
        background-color: #ebac24;*/
    /*font-family: 'Proxima Nova', sans-serif;*/
    /*font-weight: bold;
        text-transform: uppercase;
    }*/
    .nav-bar {
        position: fixed;
        background: white;
        border-bottom: 1px solid #ebac24;
        width: 100%;
        margin-top: -88px;
        z-index: 1;
    }
    .text-left {
        margin: 6px 0 0px 0;
    }
    /* .img-header { */
    /* size: 10px; */
    /* margin-top: 19px; */
    /* margin-bottom: 4px; */
    /* margin-left: 25px; */
    /* } */
    .img-header .img-right {
        margin-right: 50px;
    }
    .img-left {
        margin-top: 15px;
    }
    .bg-img {
        /* Working method */
        margin-top: 1px;
        background: white;
        /* top, transparent red, faked with gradient */
        /* linear-gradient(to right, rgba(255, 254, 254, 0), rgba(255, 255, 255, 0)),url('../img/MM Groupshot.jpg') no-repeat; */
        width: 100%;
        margin-left: auto;
        /*! height: 100%; */
        margin-right: auto;
        border: 0;
        height: 100%;
    }
    .bg-img .bg-body {
        width: 470px;
    }
    .bg-bottom {
        /* Working method */
        margin-top: 1px;
        background-color: white;
        /* For browsers that do not support gradients */
        background-image: radial-gradient(white 1%, gray 15%, #02075C 60%);
        /* Standard syntax (must be last) */
        background: -webkit-radial-gradient(70% 153px, black 0%, white 0%, #2b354e 0%);
        /* background: 
           /* top, transparent red, faked with gradient */
        /* linear-gradient( rgba(255, 254, 254, 0.884), rgba(12, 6, 39, 0.815)); */
        /* background-position: right; */
        background-size: 100%;
        background-repeat: repeat-y;
        height: auto;
        /*        text-align: left;*/
        color: #ffffff;
        border: 0;
    }
    .bg-bottom .bg-body {
        width: 500px;
        height: auto;
    }
    .bg-bottom .bg-body .bg-cards {
        margin: 0px 10px 10px 10px;
        width: 100px;
    }
    .bg-bottom .bg-body .bg-cards .bg-img {
        width: 254px;
    }
    .btn-download {
        /* background-image: url(../img/MM-Download-Button.png); */
        /* #007bff; */
        /* Green */
        /* border: none; */
        /* background-color: #ffffff00; */
        /* padding: 5px; */
        /*        text-align: center;*/
        /* text-decoration: none; */
        display: inline-block;
        /*        font-size: 16px;*/
        /* margin: 4px 02px; */
        /* cursor: pointer; */
        /* border-radius: 42px; */
        /* border: 1px #ffffff; */
        width: 100%;
        height: 60px;
        /* background-position: center; */
        /* background-size: 240px; */
        margin: 0px auto;
    }
    .bg-grey .bg-body {
        width: 700px;
        /*        font-size: 15px;*/
        /*        text-align: left;*/
        margin-top: 17px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
        font-weight: 100;
    }
    .bg-approve {
        background-color: #ffffff00;
        border-style: solid;
        border-left-width: 0px;
        border-top-width: 3px;
        border-right-width: 0px;
        border-bottom-width: 0px;
        border-radius: 0px;
        border-color: #ebac24;
        height: fit-content;
        border: 0 0 0 0;
    }
    .img-carosel {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 10px;
    }
    .img-logo {
        display: block;
        margin-top: -70px;
        width: 70%;
        margin-left: auto;
        padding-bottom: 0px;
        margin-right: auto;
        padding-top: 50px;
        /* margin-top: 10px; */
    }
    .img-logo-mm {
        display: block;
        margin-top: -82px;
        width: 12%;
        margin-left: auto;
        padding-bottom: 44px;
        margin-right: auto;
    }
    .text-product {
        font-weight: 400;
        /*        text-align: justify;*/
        width: 100%;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .list-product {
        width: 265px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .item-note {
        width: 100%;
        /*        font-size: 12px;*/
        font-weight: 500;
        margin-left: -5px;
    }
    /* .container.carouselSilde { */
    /* height: 300; */
    /* border-bottom: 0px solid salmon; */
    /* margin-bottom: 10%; */
    /* } */
    .product-head {
        /*        text-align: left;*/
        font-weight: bold;
        /*        font-size: 15px;*/
    }
    .footer-image {
        width: 95px;
        height: 60px;
        /* margin-left: auto; */
        margin-right: auto;
        /* margin-bottom: auto; */
        /* margin-top: auto; */
    }
    .footer-image.image-center {
        margin-bottom: 10px;
        height: auto;
        margin-right: 450px;
    }
    .footer-image.img-bottom {
        padding-top: 27px;
    }
    .footer-bg {
        background: #ebac24;
        height: 21px;
        margin-top: 0px;
    }
    .container.list-prduct {
        display: none;
    }
    .card-body.bg-body.float-left.divBanner {
        display: none;
    }
    .container.carouselBanner {
        display: block;
        margin-top: 15px;
        margin-bottom: 20px;
    }
    ul.carousel-indicators {
        /* position: absolute; */
        top: 100%;
    }
    .footer-col {
        width: 600px;
        margin-left: 10px;
        margin-top: 10px;
    }
    .carousel-item.text-center {
        font-size: 30px;
    }
    .addres-footer {
        font-weight: 300;
    }
    .text-banner {
        width: 80%;
    }
    .row-img {
        width: 48%;
        margin-right: 7px;
        margin-bottom: 10px;
    }
    .row-col-1 {
        margin-right: 10px;
    }
    .row-col-2 {
        margin-right: 10px;
    }
    .row.title2 {
        display: none;
    }
    .row.title2 {
        display: block;
        /*        text-align: left;*/
        /*        font-size: 12px;*/
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    .row.title {
        display: none;
    }
    nav-address {
        margin: 10px 0px 10px 0px;
    }
    .btn-center {
        background-position: center;
        width: 100%;
        /* display: inline-block; */
    }
    img.img-size {
        width: 100%;
        margin-top: 0%;
    }
    .bg-approve .container {
        margin-left: -10px;
    }
    .bahasa {
        display: -webkit-inline-box;
        height: 12px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .nav-address {
        margin: 85px auto 0px auto;
        width: 100%;
        padding-left: 15px;
        padding: 5px 0px;
    }
    #img {
        object-fit: contain;
        width: 600px;
    }
    table#myTable tr td,
    th {
        padding: .3rem;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 5px;
    }
    .sidebar-search {
        top: 60px;
        position: sticky;
        position: -webkit-sticky;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 473px; */
        margin-left: 678px;
    }
}

@media only screen and (max-width: 672px) {
    .header {
        max-height: 150px;
    }
    .gambar {
        border-top: 5px solid salmon;
        width: 100%;
    }
    .img-footer {
        width: 98px;
        height: 30px;
        margin-top: 15px;
        margin-top: 15px;
        /* border-radius: 100px; */
    }
    .card {
        background-color: transparent;
    }
    /*.nav-head {
        background-color: #ebac24;*/
    /*font-family: 'Proxima Nova', sans-serif;*/
    /*font-weight: bold;
        text-transform: uppercase;
    }*/
    .nav-bar {
        /*        font-size: 15px;*/
        /*        text-align: left;*/
        border-bottom: 1px solid #ebac24;
        MARGIN-TOP: 86px;
    }
    .text-left {
        margin: 6px 0 0px 0;
    }
    /* .img-header { */
    /* size: 10px; */
    /* margin-top: 19px; */
    /* margin-bottom: 4px; */
    /* margin-left: 25px; */
    /* } */
    .img-header .img-right {
        margin-right: 50px;
    }
    .img-left {
        margin-top: 15px;
    }
    .bg-img {
        /* Working method */
        margin-top: 1px;
        background: white;
        /* top, transparent red, faked with gradient */
        /* linear-gradient(to right, rgba(255, 254, 254, 0), rgba(255, 255, 255, 0)),url('../img/MM Groupshot.jpg') no-repeat; */
        /* background-position: right; */
        /* background-size: 60%;  */
        /* height: 250px; */
        /*        text-align: left;*/
        border: 0;
    }
    .bg-img .bg-body {
        width: 470px;
    }
    .bg-bottom {
        /* Working method */
        margin-top: 1px;
        background-color: white;
        /* For browsers that do not support gradients */
        background-image: radial-gradient(white 1%, gray 15%, #02075C 60%);
        /* Standard syntax (must be last) */
        background: -webkit-radial-gradient(70% 153px, black 0%, white 0%, #2b354e 0%);
        /* background: 
           /* top, transparent red, faked with gradient */
        /* linear-gradient( rgba(255, 254, 254, 0.884), rgba(12, 6, 39, 0.815)); */
        /* background-position: right; */
        background-size: 100%;
        background-repeat: repeat-y;
        height: auto;
        /*        text-align: left;*/
        color: #ffffff;
        border: 0;
    }
    .bg-bottom .bg-body {
        width: 500px;
        height: auto;
    }
    .bg-bottom .bg-body .bg-cards {
        margin: 0px 10px 10px 10px;
        width: 100px;
    }
    .bg-bottom .bg-body .bg-cards .bg-img {
        width: 254px;
    }
    .btn-download {
        background-image: url(../img/MM%20Download%20Button_x2.png);
        /* #007bff; */
        /* Green */
        border: none;
        background-color: #ffffff00;
        background-size: 250px;
        padding: 5px;
        /*        text-align: center;*/
        text-decoration: none;
        display: inline-block;
        /*        font-size: 16px;*/
        /* margin: 4px 02px; */
        cursor: pointer;
        border-radius: 42px;
        border: 1px #ffffff;
        width: 50%;
        height: 60px;
        background-position: center;
        background-size: 240px;
    }
    .bg-grey .bg-body {
        width: 700px;
        /*        font-size: 15px;*/
        /*        text-align: left;*/
        margin-top: 17px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
        font-weight: 100;
    }
    .bg-approve {
        background-color: #ffffff00;
        border-style: solid;
        border-left-width: 0px;
        border-top-width: 3px;
        border-right-width: 0px;
        border-bottom-width: 0px;
        border-radius: 0px;
        border-color: #ebac24;
        height: fit-content;
        border: 0 0 0 0;
    }
    .img-carosel {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 10px;
    }
    .img-logo {
        display: block;
        margin-top: -69px;
        width: 100%;
        margin-left: auto;
        padding-bottom: 0px;
        margin-right: auto;
        padding-top: 45px;
    }
    .img-logo-mm {
        display: block;
        margin-top: -85px;
        width: 12%;
        margin-left: auto;
        padding-bottom: 60px;
        margin-right: auto;
    }
    .text-product {
        font-weight: 100;
        /*        text-align: justify;*/
        width: 100%;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .list-product {
        width: 265px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .item-note {
        width: 100%;
        /*        font-size: 12px;*/
        font-weight: 500;
        /*        text-align: left;*/
    }
    /* .container.carouselSilde { */
    /* height: 300; */
    /* border-bottom: 0px solid salmon; */
    /* margin-bottom: 10%; */
    /* } */
    .product-head {
        /*        text-align: left;*/
        font-weight: bold;
        /*        font-size: 15px;*/
    }
    .footer-image {
        width: 95px;
        height: 60px;
        /* margin-left: auto; */
        margin-right: auto;
        /* margin-bottom: auto; */
        /* margin-top: auto; */
    }
    .footer-image.image-center {
        margin-bottom: 10px;
        height: auto;
        margin-right: 300px;
    }
    .footer-image.img-bottom {
        padding-top: 27px;
    }
    .footer-bg {
        background: #ebac24;
        height: 21px;
        margin-top: 0px;
    }
    .container.list-prduct {
        display: none;
    }
    .card-body.bg-body.float-left.divBanner {
        display: none;
    }
    .container.carouselBanner {
        display: block;
        margin-top: 15px;
        margin-bottom: 20px;
    }
    ul.carousel-indicators {
        /* position: absolute; */
        top: 100%;
    }
    .footer-col {
        width: 600px;
        margin-left: 10px;
        margin-top: 10px;
    }
    .carousel-item.text-center {
        /*        font-size: 30px;*/
    }
    .addres-footer {
        font-weight: 300;
    }
    .text-banner {
        width: 100%;
    }
    .row-img {
        width: 48%;
        margin-right: 7px;
        margin-bottom: 10px;
    }
    .row-col-1 {
        margin-right: 10px;
    }
    .row-col-2 {
        margin-right: 10px;
    }
    .row.title2 {
        display: none;
    }
    .row.title2 {
        display: block;
        /*        text-align: left;*/
        /*        font-size: 12px;*/
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    .row.title {
        display: none;
    }
    .nav-address {
        margin: 0px auto 0px auto;
        width: auto;
        padding: 15px;
    }
    .container.text-carosel {
        font-size: 20px;
        font-weight: 900;
        /* text-align: left; */
    }
    .btn-center {
        background-position: center;
        width: 100%;
    }
    .bg-approve .container {
        margin-left: -10px;
    }
    .bahasa {
        display: -webkit-inline-box;
        height: 50px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    table#myTable tr td,
    th {
        padding: .3rem;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 100px;
    }
    .sidebar-search {
        top: 370px;
        position: sticky;
        position: -webkit-sticky;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 200px;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 473px; */
        margin-left: 678px;
    }
}

@media only screen and (max-width: 633px) {
    .nav-address {
        margin: 170px auto 0px auto;
        width: auto;
        padding: 15px;
    }
    .nav-bar {
        /* font-size: 15px; */
        /* text-align: left; */
        border-bottom: 1px solid #ebac24;
        MARGIN-TOP: -170px;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: 160px;
    }
    .sidebar-search {
        top: 370px;
        position: sticky;
        position: -webkit-sticky;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 230px;
    }
}

@media only screen and (max-width: 426px) {
    body {
        background: #ffffff;
        font-family: 'Proxima Nova';
        font-weight: 400;
        font-size: 10px !important;
        text-align: left;
    }
    .header {
        max-height: 150px;
    }
    h2.text-center {
        display: inherit;
    }
    .card.banner-header.bg-bottom .container {
        display: block;
    }
    .card-body.bg-body.float-right.bottomBanner {
        width: 100%;
        display: block;
        margin-top: -15px;
    }
    .gambar {
        border-top: 5px solid salmon;
        width: 100%;
    }
    .img-footer {
        width: 98px;
        height: 30px;
        margin-top: 15px;
        margin-top: 15px;
        /* border-radius: 100px; */
    }
    #img {
        object-fit: contain;
        width: 250px;
        margin-top: 10px;
    }
    .card {
        background-color: transparent;
        border: 0px;
    }
    .nav-bar {
        /*        font-size: 15px;*/
        /*        text-align: left;*/
        border-bottom: 1px solid #ebac24;
        MARGIN-TOP: -94px;
    }
    .text-left {
        margin: 6px 0 0px 0;
    }
    .img-header .img-right {
        margin-right: 50px;
    }
    .img-left {
        margin-top: 15px;
    }
    .bg-img {
        /* Working method */
        margin-top: 1px;
        background: white;
        /* top, transparent red, faked with gradient */
        /* linear-gradient(to right, rgba(255, 254, 254, 0), rgba(255, 255, 255, 0)),url('../img/MM Groupshot.jpg') no-repeat; */
        width: 100%;
        margin-left: auto;
        /*! height: 100%; */
        margin-right: auto;
        border: 0;
        height: 90%;
    }
    .bg-img .bg-body {
        width: 470px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 10px;
        padding-right: 10px;
    }
    .bg-bottom {
        /* Working method */
        margin-top: 1px;
        background-color: white;
        /* For browsers that do not support gradients */
        display: block;
        /* Standard syntax (must be last) */
        background: -webkit-radial-gradient(70% 153px, black 0%, white 0%, #2b354e 0%);
        /* background: 
           /* top, transparent red, faked with gradient */
        /* linear-gradient( rgba(255, 254, 254, 0.884), rgba(12, 6, 39, 0.815)); */
        background-position: right;
        background-size: 100%;
        background-repeat: repeat-y;
        height: auto;
        width: auto;
        color: #ffffff;
        border: 0;
        border-radius: 0px;
        position: inherit;
        /* margin-bottom: -17px; */
    }
    .bg-bottom .bg-body {
        width: 300px;
        margin-bottom: 0px;
    }
    .bg-bottom .bg-body .bg-cards {
        margin: 0px 10px 10px 10px;
        width: 100px;
    }
    .bg-bottom .bg-body .bg-cards .bg-img {
        width: 254px;
    }
    .btn-download {
        /* background-image: url(../img/MM-Download-Button.png); */
        /* #007bff; */
        /* Green */
        /* border: none; */
        /* background-color: #ffffff00; */
        /* padding: 5px; */
        /* text-align: center; */
        /* text-decoration: none; */
        display: inline-block;
        /* font-size: 16px; */
        /* margin: 4px 02px; */
        /* cursor: pointer; */
        /* border-radius: 42px; */
        /* border: 1px #ffffff; */
        width: 240px;
        height: 100px;
        /* background-position: left; */
        /* background-size: 240px; */
        background-color: transparent;
        margin-top: -20px;
        margin-bottom: -60px;
        margin-left: 0px;
        margin-right: 0px;
        padding: 0px 0px 0px 0px;
    }
    .bg-grey .bg-body {
        width: 100%;
        /*        font-size: 14px;*/
        /*        text-align: left;*/
        margin-top: 10px;
        margin-left: auto;
        margin-right: auto;
        margin-bottom: 10px;
        font-weight: 400;
        background: transparent;
    }
    .bg-approve {
        background-color: #ffffff00;
        border-style: solid;
        border-left-width: 0px;
        border-top-width: 3px;
        border-right-width: 0px;
        border-bottom-width: 0px;
        border-radius: 0px;
        border-color: #ebac24;
        height: fit-content;
        border: 0 0 0 0;
    }
    .img-carosel {
        margin-top: 10px;
        margin-bottom: 10px;
        margin-left: 0px;
    }
    .img-logo {
        display: block;
        margin-top: -70px;
        width: 90%;
        margin-left: auto;
        padding-bottom: 15px;
        margin-right: auto;
        padding-top: 36px;
    }
    .img-logo-mm {
        display: block;
        margin-top: -70px;
        width: 15%;
        margin-left: auto;
        padding-bottom: 36px;
        margin-right: auto;
    }
    .text-product {
        font-weight: 400;
        /*        text-align: justify;*/
        width: 100%;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .list-product {
        width: 265px;
        margin-left: 10px;
        margin-right: 10px;
    }
    .item-note {
        width: 100%;
        /*        font-size: 14px;*/
        font-weight: 400;
        margin-bottom: -10px;
    }
    .product-head {
        /*        text-align: left;*/
        font-weight: bold;
        /*        font-size: 16px;*/
    }
    .footer-image {
        width: 113px;
        height: 60px;
        /* margin-left: auto; */
        margin-right: auto;
        /* margin-bottom: auto; */
        /* margin-top: auto; */
    }
    .footer-image.image-center {
        margin-bottom: 10px;
        height: auto;
        margin-right: 0px;
        margin-bottom: 10px;
    }
    .footer-image.image-center {
        margin-bottom: 10px;
        height: auto;
        margin-right: 200px;
    }
    .footer-image.img-bottom {
        padding-top: 27px;
    }
    .footer-image.image-center {
        margin-top: 0px;
    }
    .footer-bg {
        background: #ebac24;
        height: 10px;
    }
    .container.list-prduct {
        display: none;
    }
    .card-body.bg-body.float-left.divBanner {
        display: none;
    }
    .container.carouselBanner {
        display: block;
        margin-top: 20px;
        margin-bottom: 0px;
        /* height: auto; */
    }
    ul.carousel-indicators {
        /* position: absolute; */
        top: 100%;
        margin-top: -5px;
        margin-bottom: 0px;
    }
    .footer-col {
        width: 100%;
        margin-left: 0px;
        margin-top: 0px;
    }
    .carousel-item.text-center {
        /*        font-size: 12px;*/
    }
    .addres-footer {
        font-weight: 400;
        /*        font-size: 14px;*/
    }
    .row-img {
        width: 100%;
        margin-bottom: 10px;
    }
    .text-banner {
        width: 100%;
        font-weight: 900;
        font-size: 2.1rem;
    }
    .row.title2 {
        display: block;
        font-weight: 400;
    }
    .nav-address {
        margin: 92px 0px 0px 0px;
        width: 100%;
        padding-left: 15px;
        padding: 5px 0px;
    }
    .text-carosel {
        font-size: 20px;
        font-weight: 900;
        /* text-align: left; */
        padding-top: 20px;
    }
    .btn-center {
        background-position: center;
        width: 100%;
        margin-bottom: 4px;
    }
    .bg-approve .container {
        margin-left: -10px;
        margin-bottom: 5px;
    }
    .footer-col.row {
        padding-top: 10px;
        margin-bottom: -10px;
    }
    .btn-massage {
        background-image: url(../img/MM%20Message%20Button_x2.png);
        border: none;
        background-color: #ffffff00;
        background-size: 240px;
        /* text-align: center; */
        /* text-decoration: none; */
        display: inline-block;
        /* font-size: 16px; */
        margin: 45px 0px;
        cursor: pointer;
        /* border-radius: 42px; */
        /* border: 1px #ffffff; */
        width: 100%;
        height: 65px;
        /* background-position: center; */
        /* background-size: 240px; */
        background-repeat: no-repeat;
        margin-bottom: 10px;
        /* background-position: center; */
    }
    .bahasa {
        display: -webkit-inline-box;
        height: 15px;
        margin-top: 10px;
        margin-bottom: 10px;
    }
    .nav-head {
        font-weight: bold;
        font-size: 10px;
        padding-left: 0px;
    }
    table#myTable {
        font-size: 14px;
    }
    table#myTable tr td,
    th {
        padding: .3rem;
    }
    .col-ref {
        width: 10% !important;
    }
    .col-Repair {
        width: 700px !important;
        position: static !important;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: -100px;
    }
    .sidebar-search {
        position: -webkit-sticky;
        position: sticky;
        top: 75px;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .sidebar.style-input {
        padding-top: 15px;
        padding-bottom: 15px;
        background-color: white;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 220px;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 481px; */
        margin-left: 347px;
    }
    .dv-note {
        margin-left: 0px !important;
    }
}

@media only screen and (max-width: 376px) {
    body {
        background: #ffffff;
        font-family: 'Proxima Nova';
        font-weight: 400;
        font-size: 11px !important;
        text-align: left;
    }
    .row-col-1 {
        margin-right: auto;
    }
    .row-col-2 {
        margin-right: auto;
    }
    .row-col-3 {
        margin-left: auto;
    }
    .row.title2 {
        display: block;
        margin-left: auto;
        margin-right: auto;
        width: 100%;
    }
    .row.title {
        display: none;
    }
    .text-carosel {
        font-size: 20px;
        font-weight: 900;
        /* text-align: left; */
        padding-top: 20px;
    }
    .btn-center {
        background-position: center;
        width: 100%;
        margin-bottom: 0px;
    }
    .bg-bottom {
        margin-top: 1px;
        background-color: white;
        /* background-image: radial-gradient(white 1%, gray 15%, #02075C 60%); */
        background: -webkit-radial-gradient(70% 153px, black 0%, white 0%, #2b354e 0%);
        /* background-position: right; */
        background-size: 100%;
        background-repeat: repeat-y;
        height: auto;
        width: auto;
        color: #ffffff;
        border: 0;
        border-radius: 0px;
        position: inherit;
        margin-bottom: 0px;
    }
    .nav-address {
        margin: 84px 0px 0px 0px;
        width: 100%;
        padding-left: 15px;
        padding: 0px;
    }
    .bg-img .bg-body {
        width: 470px;
        margin-left: auto;
        margin-right: auto;
        padding-left: 10px;
        padding-right: 10px;
        margin-top: 10px;
    }
    .bg-approve .container {
        margin-left: -10px;
    }
    .nav-bar {
        /* font-size: 15px; */
        /* text-align: left; */
        border-bottom: 1px solid #ebac24;
        MARGIN-TOP: -84px;
    }
    table#myTable {
        font-size: 12px;
    }
    table#myTable tr td,
    th {
        padding: .3rem;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: -50px;
    }
    .sidebar-search {
        position: -webkit-sticky;
        position: sticky;
        top: 60px;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 200px;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 473px; */
        margin-left: 280px;
    }
    #img {
        object-fit: contain;
        width: 200px;
        margin-top: 10px;
    }
}

@media only screen and (max-width: 320px) {
    .nav-address {
        margin: 75px 0px 0px 0px;
        width: 320px;
        padding-left: 0px;
        padding: 5px 0px;
    }
    .bg-bottom {
        margin-top: 1px;
        background-color: white;
        /* background-image: radial-gradient(white 1%, gray 15%, #02075C 60%); */
        background: -webkit-radial-gradient(70% 153px, black 0%, white 0%, #2b354e 0%);
        /* background-position: right; */
        background-size: 100%;
        background-repeat: repeat-y;
        height: auto;
        width: auto;
        color: #ffffff;
        border: 0;
        border-radius: 0px;
        position: inherit;
        /* margin-bottom: -17px; */
    }
    .bg-approve .container {
        margin-left: -10px;
    }
    body {
        background: #ffffff;
        font-family: 'Proxima Nova';
        font-weight: 400;
        font-size: 10px !important;
        text-align: left;
    }
    table#myTable {
        font-size: 10px;
    }
    table#myTable tr td,
    th {
        padding: .3rem;
    }
    .sidebar {
        position: -webkit-sticky;
        position: sticky;
        top: -40px;
    }
    .sidebar-search {
        position: -webkit-sticky;
        position: sticky;
        top: 60px;
    }
    .sidebar-tbody {
        position: -webkit-sticky;
        position: sticky;
        top: 150px;
    }
    .style-table {
        background-color: transparent;
        width: auto;
        margin-bottom: 0px;
        top: 200px;
    }
    .sidebar-Top {
        position: -webkit-sticky;
        position: sticky;
        /* top: 473px; */
        margin-left: 230px;
    }
}


/* in html */

.cf:before,
.cf:after {
    content: " ";
    /* 1 */
    display: table;
    /* 2 */
}

.cf:after {
    clear: both;
}


/**
* For IE 6/7 only
* Include this rule to trigger hasLayout and contain floats.
*/


/* The sticky */

tr.accordion-row::selection {
    background-color: teal;
}

.col-ref {
    width: 4% !important;
}

.col-Repair {
    width: 477px !important;
    position: static !important;
}

.col-Product {
    width: 666px !important;
    position: static !important;
}

.col-Download {
    width: 10% !important;
}

.style-table-item {
    margin-top: 0px;
}

@media only screen and (max-width: 768px) {
    tbody#demo1 {
        margin-top: 44px;
        display: block;
    }
    .col-ref {
        width: 100px;
    }
    .col-Repair {
        width: 150px;
    }
    .col-Product {
        width: 150px;
    }
    .col-Download {
        width: 15% !important;
    }
    .style-table-item {
        margin-top: -45px;
    }
}

@media only screen and (max-width: 425px) {
    tbody#demo1 {
        margin-top: 0px;
        display: block;
    }
    .col-Download {
        width: 22% !important;
    }
    .style-table-item {
        margin-top: 0px;
    }
}

a.bahasa {
    letter-spacing: 2px;
}