.search,
.location {
   padding-left:10px !important;
}

.search::placeholder,
.location::placeholder {
   font-size: 13.3333px;
   font-weight: 400;
    color: #000 !important;
}

.pill-btn, .circle-btn {
    border-radius: 20px !important;
    background-color: #D7EDF5 !important;
    border: 1px solid #D7EDF5;
    margin-top: 0px !important;
    margin-bottom: 0px !important;
    text-transform: none;
    font-weight: 400 !important;
    font-family: karla, sans-serif;
    font-size: 14px;
    line-height: 21px;
    border-radius:.4rem;
    cursor:pointer;
    display:inline-block;
    font-weight:700;
    height:3.8rem;
    letter-spacing:.1rem;
    line-height:3.8rem;
    padding:0 3.0rem;
    text-align:center;
    text-decoration:none;
    text-transform:uppercase;
    white-space:nowrap
}

.circle-btn {
    padding: 0px 12px;
}

.circle-btn i {
   color: #000;
}

.search-bar-top {
   top: 70px;
   padding-top: 16px;
   padding-bottom: 16px;
   position: fixed;
   z-index: 100;
   background-color: #F5F6F5;
   width: 100%;
}

.input-group {
   float: left; 
   color:#000;
   max-width:40%;
   margin-right:20px;
}

.search-bar-top .input-group {
   margin-right: 10px !important;
}

#keyword, #location {
   border: 1px solid #8F9C9F;
   background-color: white;
   color: black;
   max-width: 100%;
   margin-bottom: 0px;
}

.location-nav {
   padding: 0px;
   border: 0px;
   margin-bottom: 20px;
   justify-content: flex-start;
}

@media only screen and (min-width: 768px) {
   .input-group {
      max-width:200px;
      margin-right:20px;
   }

   #keyword, #location {
      max-width: 200px;
      margin-bottom: 0px;
   }
   
   .location-nav {
      padding: 0px;
      border: 0px;
      margin-bottom: 20px;
      justify-content: flex-start;
   }
}