.logo {
    margin-top: 20px;
    margin-bottom: 20px;
  }

  .bar {
    margin: 0 auto;
    max-width: 575px;
    width: 90%;
    border-radius: 30px;
    border: 1px solid #dcdcdc;
    background-color: #dcdcdc;
  }

  .bar:hover {
    background-color: white;
  }

  .bar:focus-within {
    outline: none;
  }

  .icon {
    margin-right: 10px;
  }

  .searchBar {
    height: 45px;
    border: none;
    width: 80%;
    max-width: 500px;
    font-size: 16px;
    outline: none;
    background-color: #dcdcdc;
  }

  .searchBar:hover {
    background-color: white;
  }

  center{
    padding-bottom: 28px;
    padding-top: 190px;
  }

  /* Media Queries */
  @media (max-width: 768px) {
    .bar {
      max-width: 100%;
    }

    .searchbar {
      width: 80%;
      max-width: 80%;
    }
  }

  @media (max-width: 480px) {
    .searchbar {
      font-size: 14px;
    }
  }