@media (min-width:768px){
  .weather-search-form{
    flex-direction:row;
  }
  .search-input-wrapper{
    flex: 1;
  }

}

@media (min-width:768px) {
   .weather-info{
    flex-direction: row;
    justify-content: space-between;
    align-items: center;
    text-align: left;
   }
   .temperature-info{
    display: flex;
    align-items: flex-end;
    flex-direction: column;

   }  
}

@media (min-width:768px) {

  .weather-details{
    grid-template-columns:repeat(4,1fr);
  }
  
}