html, body {
  font-family: Arial, Helvetica, sans-serif;
  height: 100%;
  margin: 0;
}


/* id box_menu */
#box-menu {
  width: 150px;
  float:left;  
  padding: 0px 10px; 
  display: block;
}

div.box-menu {
  width: 150px;
  float:left;  
  padding: 0px 10px; 
  display: block;
}

img.mainmenu-img {
  width: 100px; 
  height: 100px
}

#tabel_transaksi td:hover {
  cursor: pointer;
}


@media print {
            body {
                padding-top: 0;
            }

            #action-area {
                display: none;
            }
        }

        @media screen and (min-width: 1025px) {
            .btn-download {
                display: none !important;
            }

            .btn-back {
                display: none !important;
            }
        }

        @media screen and (max-width: 1024px) {
            .content-area>div {
                width: auto !important;
            }

            .btn-print {
                display: none !important;
            }
        }

        @media screen and (max-width: 720px) {
            .content-area>div {
                width: auto !important;
            }
        }

        @media screen and (max-width: 420px) {
            .content-area>div {
                width: 790px !important;
            }
        }

        @media screen and (max-width: 430px) {
            .content-area {
                transform: scale(0.59) translate(-35%, -35%)
            }

            .content-area>div {
                width: 720px !important;
            }

            .btn-print {
                display: none !important;
            }
        }

        @media screen and (max-width: 380px) {
            .content-area {
                transform: scale(0.45) translate(-58%, -62%);
            }

            .content-area>div {
                width: 790px !important;
            }

            .btn-print {
                display: none !important;
            }
        }

        @media screen and (max-width: 320px) {
            .content-area>div {
                width: 700px !important;
            }
        }



    .col-span-2, .col-span-8{
      float:left;
      min-height:1px;
    }
    .col-span-2{
      width:20%;
    }
    .col-span-8{
      width:60%;
    }
    .sticky-container{
      
      height:100%;
      position:relative;
      
    }
    .sticky-box{
      position: -webkit-sticky;
      position: sticky;
      /*the following is how far from the top of the screen you want your element to stick if you change it to 20px it will start to stick 20px from the top of the screen*/
      top: 55px;
    }

    .fixed_header tbody{
      display:block;
      overflow:auto;
      height:200px;
      width:100%;
    }
    .fixed_header thead tr{
      display:block;
    }border-collapse: 

    .sticky {
      position: fixed;
      top: 55;
      /*width: 100%;*/
    }

    .sticky + .content {
      padding-top: 50px;
    }

    th {
      background: white;
      position: sticky;
      top: 0;
      box-shadow: 0 2px 2px -1px rgba(0, 0, 0, 0.4);
    }

.card-header {
    padding: 5px 10px 10px 10px;
} 

/*
#tabel_transaksi tr:hover {
    background-color: #ccc;
}
*/