/* CSS untuk Masonry Columns */
    .grid {
      display: flex;
      flex-wrap: wrap;
      margin: 20px;
      display: grid;
      grid-template-columns: repeat(auto-fill, minmax(200px,1fr));
    }
    .grid-item:hover{
      box-shadow: 0px 0px 3px #061ab3;
    }
    .price{
      top: 10px;
      left: 10px;
      background-color: #0d6efd;
      border-color: #0d6efd;
  color: #fff;
  font-size: 12px;
  padding: 2px;
  margin:0px;
  width:100%;
        }
    .div_price{
      position: relative;
    }

    .grid-item {
      margin: 5px;
      padding: 5px;
      flex: 1 0 150px;
      border-style: solid;
      border-width: 0.1em;
      border-color: #d3d1d1;
      background-color: #e7efff66;
    }
    h2 {
    display: block;
    font-size: 12px !important;
    margin-block-start: 0.83em;
    margin-block-end: 0.83em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
}
    .grid-item img {
      width: 100%;
    }

    /* CSS responsif */
    @media screen and (max-width: 455px) {
        .grid-item {
          flex: 1 0 100px;
        }
        .grid {
          grid-template-columns: repeat(2,1fr);
        }
        .price {
          font-size: 7px;
      } .tittle {
          font-size: 7px;
      }
    }
 
@media print{
   .noprint{
       display:none;
   }
   body {
    zoom: 60%;
    -webkit-print-color-adjust: exact !important;
    -webkit-print-color-adjust:exact !important;
    print-color-adjust:exact !important;
  }
  select{
    appearance: none;
  }
}