#trafficList { height: 100%; margin-top: 40px; padding-bottom: 40px; background: white; } .trafficEntry { display: flex; flex-direction: column; justify-content: space-evenly; align-items: center; width: 100vw; padding: 8vw 0; background: white; font-size: 3.5vw; } .trafficEntry div { width: 90%; display: flex; flex-direction: row; justify-content: space-evenly; margin-bottom: 2vh; } .trafficEntry div:only-child { margin-bottom: 0; } .trafficEntry div:only-child > .timeColumn, .trafficEntry div:only-child > .lineColumn { margin-bottom: 0; } .trafficEntry div:only-child > .timeColumn { justify-content: center !important; } .trafficEntry div p { text-align: left; padding: 3vh 0 0 0; } .trafficEntry div div { display: flex; flex-direction: column; } .trafficEntry div div div { display: flex; flex-direction: row; justify-content: flex-start; align-items: flex-end; } .timeColumn { flex-basis: 15%; justify-content: space-between !important; align-items: center; } .timeColumn div { align-items: center !important; } .timeColumn img { width: 3.5vw; } .lineColumn { flex-basis: 75%; max-width: 75%; } .lineColumn div { margin-bottom: 0px; } .lineColumn img { width: 7.5vw; margin-right: 10px; } .infoWrapper p { text-overflow: ellipsis; overflow: hidden; flex-basis: 75%; flex-grow: 1; display: block; white-space: nowrap; max-height: 4.5vw; } .infoWrapper span { flex-basis: 25%; } .expanded { white-space: normal !important; max-height: none !important; } .lineName { background: var(--colorLine); color: white; font-size: 6vw; font-weight: 100; margin-right: 10px; padding: 1vw 4vw; } .destination { text-align: left; } .trafficEntry a { width: 90%; font-size: 4vw; font-weight: bold; color: var(--colorVT1); padding: 4vw 0; border-radius: var(--borderRadius); box-shadow: var(--boxShadow); text-decoration: none; }