<!– STARTER CSS
WRAP it all in a
background page color is #FBFCFC
–>
div#content.article .graphic-wrapper h2,
.graphic-wrapper img {max-width:100%}
a.credit{font-style:italic}
.graphic-wrapper p{font-weight:normal;}
/* Put a
on your charts*/
.graphic-wrapper .legend p{font-family:’Arial’, sans-serif; font-size:14px; color:#000;line-height:1.3em;margin:0;padding:0;}
ul.key li{display: inline;margin-right: 28px;font-family: ‘Arial’,sans-serif;color: #000;font-size: 13px;}
/* A will draw a colored box for use in a color key. You will need to write a second class to set the color so it matches the chart/map/etc. */
.box{display: inline-block;background-color: #000;height: 10px;width: 10px;margin: 0 5px 0 0px;}
.clearfix{clear:both}
/* REMOVE HEIGHT and WIDTH attributes from fusion tables and replace with class=’fusion-table’ */
.fusion-table{width:100%;height:400px;margin:15px 0;}
/* USE AN
in “.graphic-wrapper” for chart labels */
.graphic-wrapper h4{color:#000;font-family:’Arial’, sans-serif;font-weight:bold;font-size:16px}
/* USE AN inside the
for normal-weight italic type */
.graphic-wrapper h4 em{font-weight:normal;}
/* TABLE STYLES — just be sure
is in “.graphic-wrapper” */
.graphic-wrapper table {width:100%;margin:15px 0;border-collapse:collapse;}
.graphic-wrapper table thead tr {background-color:#12182d;color:#fff;}
.graphic-wrapper table tbody tr {vertical-align: top;}
.graphic-wrapper table td,.graphic-wrapper table th{font-size:14px; font-family:’Arial’, sans-serif;}
.graphic-wrapper table td {padding:7px;}
.graphic-wrapper table tbody tr:first-child td {padding-top:12px;}
.graphic-wrapper table th {padding:10px;border-right: 1px solid white;
text-align: left;}
.graphic-wrapper table tr:last-child{ border-bottom: 2px solid #12182d;}
.graphic-wrapper table tr:last-child td{ padding-top: 10px; padding-bottom:10px;}
/* TABLE ZEBRA STRIPES — use
*/
.graphic-wrapper table.zebra td {padding:10px 7px;}
.graphic-wrapper table.zebra tr:nth-child(even) {background: #d3deea}
.show-phone{display:none;}
/* YOUR NEW STYLES HERE */
@media all and (max-width: 700px) {
.show-phone{display:initial;}
.hide-phone{display:none;}
/* THIS IS WHERE PHONE-SPECIFIC STYLES GO */
}
Compared to 19 major metropolitan areas in the United States, Canada and Europe, Chicago’s transit system — including the Chicago Transit Authority, Metra and Pace — provides very few riders per capita, according to a December 2013 report based on transit data.
DAILY TRANSIT RIDES FOR EVERY 100 RESIDENTS During an average weekday in each metropolitan area in 2012
Source: Metropolitan Planning Council
@ChiTribGraphics
