.Transporte {
  width: 90%;
  min-height: 80vh;
  display: flex;
  flex-direction: column;
  align-items: flex-start;
  justify-content: flex-start;
  padding: 1rem;
  padding-bottom: 10rem;
  background-image: url(../../../assets/TransporteGreen.png);
  background-repeat: no-repeat;
  background-size: 70% auto;
  background-position: center bottom;
}

.TransporteList, .TaxiList {
  margin: .4rem 0;
  padding: 0;
  padding-inline-start: 0;
}

.ListItemTransporte {
  display: grid;
  grid-template-columns: auto 1fr;
  grid-template-rows: repeat(2, auto);
  align-content: center;
  justify-content: start;    
  align-items: center;
  margin-bottom: .4rem;
  list-style: none;
}

.ListItemTransporte .dot{
  grid-column: 1 / 2;
  grid-row: 1 / 2;
  height: .8rem;
  width: .8rem;
  margin-top: .3rem;
  margin-right: .6rem;
  border-radius: 50%;
  background-color: #d0dfca;
  border: 1px solid #ffffff;
  box-shadow: 3px 6px 20px -1px #33333373;  
}

.ListItemTransporte .hour {
  grid-column: 2 / 3;
  grid-row: 1 / 2;
  margin: .4rem 0;
  font-size: 1.1remrem;
  font-family: "Cormorant";
  font-weight: 600;    
}

.ListItemTransporte .location {
  grid-column: 2 / 3;
  grid-row: 2 / 3;
  font-size: 1.2rem;
  font-family: "Cormorant";
  font-weight: 500;  
}

.TaxiListItem {
  display: flex;
  flex-direction: column;
  align-content: flex-start;
  align-items: flex-start;
  margin-bottom: 1rem;
  list-style: none;
  justify-content: center;
}

@media (min-width: 768px) {
  .Transporte {
    background-size: 44% auto;
  }
}

@media (min-width: 1200px) {
  .Transporte {
    width: 70%;
    margin: 0 auto;
    background-size: 20% auto;
  }
}