@media screen and (max-width: 768px) {
  * {
    box-sizing: border-box;
  }
  
  body {
    margin: 0;
    padding: 0;
    height: 100vh;
  }

  /* html, body {
    width: 100%;
    overflow-x: auto;
  } */

  .obavjestenja-info{
    width: 80%;
  }

  .filteri {
    flex-wrap: wrap;
    width: 80%;
  }

  form {
    margin: 0;
    margin-top: 5%;
  }

  .modal-content {
    max-height: 75vh !important;
    max-width: 85vw;
  }

  .modal-body::-webkit-scrollbar {
    display: none;
  }

  #statusChangeModal .modal-content {
    margin: auto;
    margin-top: 30%;
  }

  /* COUNTER */
  .countdown-overlay {
    bottom: 25%;
  }

  .card-body {
    padding: 20px !important
  }

  .card-body #days, .card-body #hours, .card-body #minutes, .card-body #seconds{
    font-size: 4em;
  }

  .card-body .d-flex {
    flex-wrap: wrap; 
  }

  .card-body .d-flex > div {
    width: 45%;
    margin: 10px 0;
    padding: 0 !important;
    margin-left: 0 !important;
    margin-right: 0 !important;
  }

  #naslov-content > div {
    flex-direction: column;
  }

  .naslov-desktop {
    display: none;
  }

  .naslov-mobile {
    display: block;
  }

  .search-input {
    width: 50%;
  }
  
  .header-buttons {
    flex-direction: row;
    align-items: baseline;
    justify-content: center;
  }

  .header-right-buttons {
    text-align: end;
    padding: 0;
    padding-right: 15px;
  }

  .refresh_button {
    margin-top: -58px;
  }

}

/* @media screen and (max-width: 1380px) {
    html, body {
    width: 100%;
    overflow-x: auto;
  }
} */