@media all and (max-width: 991px) {
	.stationItem {
		width: 40%;
	}
}

@media all and (max-width: 768px) {
	.busItem {
		width: 40%;
	}
	
	.appTitle {
		padding-top: 1%;
	}
	
	.busItem .busLineName h2 {
		font-size: 4vh;
		padding: 5px 0;
	}
	
	.busItem .busLineName.active h2 {
		font-size: 30px;
	}
	
	.startTimes .lineEnd, .startTimes .lineStart {
		padding: 5px 15px;
	}
	
	p.title {
		padding-bottom: 5px;
	}
	
	.stationItem .stationTitle h2 {
		font-size: 18px;
		padding: 12px;
	}

	.appTitle {
		padding-bottom: calc(50vh - 58px - 1vh - 130px);
	}
	
	.inside .appTitle {
		padding-bottom: 20px;
	}
}

@media all and (max-width: 600px) {
	.stationItem {
		width: 90%;
		max-width: 250px;
	}
	
	.stationItem.active {
		max-width: unset;
	}
	
	.busItem .busLineName.active h2 {
		font-size: 30px;
		padding: 5px 0;
	}
	
	.stationItem .stationTitle.active h2 {
		font-size: 30px;
		padding: 5px;
	}

	ul.tabs li {
		width: 80%;
		margin: 3vh;
		max-width: 250px;
    	max-height: 165px;
	}
}