#lbp-container {
    text-align: center;
    margin: 20px;
}
.datalist-container{
  z-index: 11;
    margin-top: -13px;
  width: 95%;
}
ul{
  list-style-type: none;
}
#brandModels li{
  border-bottom: 1px solid gray;
    padding: 5px;
  
}
#brandModelInput {
   
    width: 400px !important;
  margin-left:auto;
  margin-right:auto;
      font-size: 14px;
}
.datalist-container ul {
    list-style: none; /* Remove default bullets */
    margin: 0;
    padding: 0;
    max-height: 200px; /* Set a height so the scrollbar is visible */
    overflow-y: auto; /* Enable vertical scroll if content exceeds height */
}


.datalist-container ul {
    scrollbar-width: thin; /* For Firefox */
    scrollbar-color: #ec861e white; /* Thumb and track colors for Firefox */
  background: #f4f5f7;
      border: 1px solid gray;
}

.datalist-container ul::-webkit-scrollbar {
    width: 6px; /* Width of the scrollbar */
}

.datalist-container ul::-webkit-scrollbar-thumb {
    background-color: #ec861e; /* Thumb color */
    border-radius: 10px; /* Rounded scrollbar thumb */
}

.datalist-container ul::-webkit-scrollbar-track {
    background-color: white; /* Scrollbar track color */
    border-radius: 10px; /* Rounded edges on track */
}


.datalist-container ul li {
    padding: 10px; /* Add some padding for better spacing */
    border-bottom: 1px solid #ddd; /* Divider between items */
    cursor: pointer;
  font-size: 12px;
    font-weight: 600;
    color: black;
}

.datalist-container ul li:hover {
    background-color: #f5f5f5; /* Highlight on hover */
}

#lbp-modal {
    display: none;
    position: fixed;
    z-index: 1;
    padding-top: 60px;
    left: 0;
    top: 0;
    width: 100%;
    height: 100%;
    overflow: auto;
    background-color: rgb(0,0,0);
    background-color: rgba(0,0,0,0.4);
}
.input-group-text {
    padding: 0 15px;
    height: 65px; /* Match the height of the input field */
    display: flex;
    align-items: center;
    justify-content: center;
}

.lbp-modal-content {
    background-color: #fefefe;
    margin: 5% auto;
    padding: 20px;
    border: 1px solid #888;
    width: 80%;
}

.lbp-close {
    color: #aaa;
    float: right;
    font-size: 28px;
    font-weight: bold;
}

.lbp-close:hover,
.lbp-close:focus {
    color: black;
    text-decoration: none;
    cursor: pointer;
}

@media only screen and (max-width: 600px) {
  input:not([type=checkbox]):not([type=submit]), textarea {
    
  }
  .fa-search{
    top: 70% !important;
  }
  #brandModelInput{
    width: 340px !important;
  }
  .fa-search{
    right: 2% !important;
}
}