/* General */
html, body { height: 100%; }
#not-footer { min-height: 100%; }

#container { width: 960px; position: relative; margin: 0 auto; padding: 0 0 35px 0; overflow:auto; }

footer { width: 960px; position: relative; margin: -35px auto 0 auto; height: 35px; clear:both; background-color: #ccc; }
footer .credits { width: 100%; padding-top: 7px; padding-left: 7px; }

/* Content */
header h1 { font-size: 42px; padding-top: 20px; cursor: pointer; }
header hr { margin-bottom: 20px; }

.page { display: none; }

li { margin: 0; padding: 10px 0 10px 5px; }
li.even { background-color: #eee; }

#home .button { width: 274px; font-size: 20px; margin-bottom: 10px; text-align: center; padding: 8px 12px; }

#lines .line { font-size: 18px; cursor: pointer; }

#stops .stop,
#favorites .stop { font-size: 18px; cursor: pointer; }
#stops .stop .transfer,
#favorites .stop .line-name { font-size: 13px; color: #999; }

#detail .contents { padding-bottom: 10px; }
#detail .line { font-size: 20px; color: #999; font-family: "Georgia", "Times New Roman", Helvetica, Arial, sans-serif; }
#detail .date { font-size: 20px; color: #999; font-family: "Georgia", "Times New Roman", Helvetica, Arial, sans-serif; }
#detail .subhead { line-height: 40px; }
#detail .departures li { padding: 5px 0 5px 5px; }
#detail .departures .next { background-color: #feffaf; }
#detail .asterisk { font-size: 12px; margin-top:-10px; }
#detail .buttons { padding-top: 15px; }

/* iPad Portrait/Browser */
@media only screen and (min-width: 768px) and (max-width: 991px) {
    #container { width: 960px; }
    footer { width: 960px; }
}

/* Mobile/Browser */
@media only screen and (max-width: 767px) {
    #container { width: 300px; }
    footer { width: 300px; }
}

/* Mobile Landscape/Browser */
@media only screen and (min-width: 480px) and (max-width: 767px) {
    #container { width: 420px; }
    footer { width: 420px; }
}

/* Anything smaller than standard 960 */
@media only screen and (max-width: 959px) {}

/* iPad Portrait Only */
@media only screen and (min-width: 768px) and (max-width: 991px) and (max-device-width: 1000px) {}

/* Mobile Only */
@media only screen and (max-width: 767px) and (max-device-width: 1000px) {}

/* Mobile Landscape Only */
@media only screen and (min-width: 480px) and (max-width: 767px) and (max-device-width: 1000px) {}