html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, font, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption{margin:0; padding:0; border:0; outline:0; font-size:100%; vertical-align:baseline; background:transparent; } body{line-height:1;} ul{list-style:none;} blockquote, q{quotes:none;} :focus{outline:0;} ins{text-decoration:none;} del{text-decoration:line-through;} table{border-collapse:collapse; border-spacing:0; } ol{list-style-position:inside;} .clearfix:after{ content:"."; display:block; height:0; clear:both; visibility:hidden; } /* CSS Document */ /*----------------------------------------------------------------------------common colours---------------------------------------------------------------------------*/ /*----- dark red:#5a0000 -----*/ /*------- teal:#325254 -------*/ /*---- light teal:#7e9a9d ----*/ /*--------------------------------------------------------------------------end common colours-------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------layout styles----------------------------------------------------------------------------*/ body { font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; background:#c0c0c0; color:#666; font-size:10px; } #wrapper { width:1152px; border:1px solid #000; margin:0 auto 0 auto; } #content { background:url(/images/contentBG.jpg) no-repeat bottom left #FFF; overflow:hidden; } .clear { clear:both; overflow:hidden; height:0px; width: 172px; } ul, #wrapper ul {margin:0;} #leftColumn { width:254px; float:left; display:inline; padding:0; } #main { width:558px; float:left; display:inline; margin:15px 0 20px 18px; } #main ul, #longColumn ul { margin:0 0 12px 15px; } #longColumn { width:770px; float:left; display:inline; margin:15px 0 5px 18px; } #rightColumn { float:left; width:218px; display:inline; margin:13px 0 5px 27px; } #rightColumn p { line-height:1.2em !important; } #skipToContent { height:0px; font-size:0px; text-indent:-9999px; } #leftCol img { margin:0 10px 10px 0; } .headerBG { background:#c7dddf; padding:0 20px; margin:20px 0; } #longColumn .headerBG { background:#c7dddf; padding:0 20px; margin:15px 0; } .headerBG h1, .headerBG h2, .headerBG h3, .headerBG h4, .headerBG h5, .headerBG h6 {margin:0;} .headerBG h2 {color:#666;} .headerBG h3 { color:#666; padding:5px 0; } .threeColumn { width:30%; padding:0 3% 0 0; float:left; } #main .threeColumnMargins { width:177px; margin:0 10px 0 0; float:left; } .listBox { margin:0 0 25px 0; } .streetcar { padding:0 0 0 80px; background:url(/images/streetcar.gif) no-repeat top left; } .twoColumn { float:left; display:inline; width:50%; } .formColumn { width:248px; margin:0 5px; overflow:hidden; } #main img { margin:0 10px 10px 0; display:inline; } #main .twoColumn img {margin-top:3px;} .noMargin { margin:0 !important; } .noPadding { padding:0 !important; } .relative {position:relative;} .mainContainer { background:url(/images/calloutGradientTall.jpg) repeat-x #fbfbfb; padding:18px; border:2px solid #FFF; margin:0 0 10px 0; } #main .templateOne { padding:5px; border:1px solid #e0e0e0 !important; } .templateOne h3.threeColHeader { margin:9px 0 0 12px; } #main .templateOne .threeColCallout { width:152px; border:none; background:none; margin:0 2px; } .mainContainer h3 {color:#336666;} .teal h2, .teal h3, .teal h4, .teal h5 {color:#325254;} .updateTable {margin-bottom:40px;} .block { display:block; float:none; clear:both; } #sendFormWrapper {display:none;} #main table {background:none;} #main form table {background:none;} /*--------------------------------------------------------------------------end layout styles--------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------header styles----------------------------------------------------------------------------*/ #header { font-size:11px; line-height:15px; } #topNavWrapper { background:url(/images/topNav.gif) top left repeat-y; width:100%; } #dateTime { float:left; display:inline; width:235px; padding:2px 0 3px 0; margin-left: 22px; color:#e9e9e9; text-align:right; } #topNav { float:right; margin:0; text-align:right; padding:2px 10px 3px 10px; background:#161616; } /* removed width:390px; */ #topNav li { display:inline; padding:2px; } #topNav li, #topNav li a { color:#999; text-decoration:none; } #topNav li a { padding: 2px 0; } #topNav li a:hover {color:#f0f0f0;} #banner { height:133px; background:url(/images/banner1.jpg) no-repeat top left; } #logoWrapper { width:248px; float:left; padding:20px 1px 0 68px; height:113px; overflow:hidden; } #logoWrapper h1 { margin:0; padding:0; } a#logo { width:248px; height:113px; display:block; background:url(/images/logo.jpg) no-repeat 0px 0px; text-indent:-9999px; } #discover #banner { background:url(/images/banner2.jpg) no-repeat top left; } #home #banner { background:url(/images/banner3.jpg) no-repeat top left; } #community #banner { background:url(/images/banner4.jpg) no-repeat top left; } #routes #banner { background:url(/images/banner5.jpg) no-repeat top left; } #tickets #banner { background:url(/images/banner6.jpg) no-repeat top left; } #updates #banner { background:url(/images/banner7.jpg) no-repeat top left; } /*--------------------------------------------------------------------------end header styles--------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------global navigation----------------------------------------------------------------------------*/ #mainNav { padding:89px 0 0 0; } #mainNav li {float:left;} #mainNav li a { display:block; float:left; text-indent:-9999px; height:44px; } #mainNav #mainNavUpdates { background-position:-74px 0px; } #mainNav #mainNavTicketsPasses { background-position:-173px 0px; } #mainNav #mainNavRoutesMaps { background-position:-287px 0px; } #mainNav #mainNavDiscoverOttawa { background-position:-393px 0px; } #mainNav #mainNavCommunity { background-position:-527px 0px; } #mainNav #mainNavTravelTips { background-position:-633px 0px; } #mainNav #mainNavAbout { background-position:-729px 0px; } /*-----main nav hover states-----*/ #mainNav a:hover#mainNavHome, #home #mainNavHome { background-position:0px -44px; } #mainNav a:hover#mainNavUpdates, #updates #mainNavUpdates { background-position:-74px -44px; } #mainNav a:hover#mainNavTicketsPasses, #tickets #mainNavTicketsPasses { background-position:-173px -44px; } #mainNav a:hover#mainNavRoutesMaps, #routes #mainNavRoutesMaps { background-position:-287px -44px; } #mainNav a:hover#mainNavDiscoverOttawa, #discover #mainNavDiscoverOttawa { background-position:-393px -44px; } #mainNav a:hover#mainNavCommunity, #community #mainNavCommunity { background-position:-527px -44px; } #mainNav a:hover#mainNavTravelTips, #travelTips #mainNavTravelTips { background-position:-633px -44px; } #mainNav a:hover#mainNavAbout, #about #mainNavAbout { background-position:-729px -44px; } /*----------------------------------------------------------------------------end global navigation----------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------------left navigation-------------------------------------------------------------------------------*/ #leftNavBar {overflow:hidden;} #leftNavBar #mapsButton, #leftNavBar #scheduleButton, #leftNavBar #quickPlanner { display:block; height:29px; background:url(/images/leftNavButtons.jpg) no-repeat; float:left; text-indent:-9999px; line-height:0px; font-size:0px; overflow:hidden; } #leftNavBar #mapsButton {width:61px;} #leftNavBar #scheduleButton { width:78px; background-position:-61px 0px; } #leftNavBar #quickPlanner { width:114px; background-position:-139px 0px; } #leftNavBar a:hover#mapsButton { background-position:0px -29px; } #leftNavBar a:hover#scheduleButton { background-position:-61px -29px; } #leftNavBar a:hover#quickPlanner { background-position:-139px -29px; } #content #leftNavWrapper { width:253px; padding:0 0 100px 0; overflow:hidden; } #content #leftNav { margin:0; width:253px; border-bottom:1px solid #fff; } #content #leftNav #sectionNav li { } #content #leftNav #sectionNav li a { background-color: #fff; background-position: -389px 0; padding:8px 0 7px 41px; font-size:0.9em; overflow:hidden; border-top: 1px solid #edeae1; } #content #leftNav #sectionNav li a:hover { background-position: -37px 0; background-color: #fff; color:#910101; text-decoration:underline; } #content #leftNavCap { height:14px; width:253px; background:url(/images/leftNavCap.png); overflow:hidden; } #content #leftNav li {font-size:1.1em;} #content #leftNav li a { background: url(/images/leftNavArrowBG.gif) -408px 0 no-repeat; display:block; color:#333; padding:7px 0 7px 21px; overflow:hidden; border-top: 1px solid #fff; } #content #leftNav li a:hover { background-color: #f6f5f0; background-position: -56px 0; } #content #leftNav li a.current { background-color: #fff; background-position: -56px 0; color:#910101; text-decoration:underline; border-top:1px solid #fff; } #content #leftNav #sectionNav li a.current { background-position: -37px 0; } /*----- New styles for left nav - April 22, 2009 ----*/ #leftNavBar a.active#mapsButton { background-position:0px -29px; } #leftNavBar a.active#scheduleButton { background-position:-61px -29px; } #leftNavBar a.active#quickPlanner { background-position:-139px -29px; } .leftNavBack { background:#c1bbaa; padding:10px 18px; text-align:right; margin:0 0 10px 1px; } .leftNavBack a { color:#990000; font-size:1.1em; padding-right:12px; background:url(/images/leftNavArrow.gif) no-repeat center right; } .leftNavBack a:hover {text-decoration:underline;} .leftNavBox h5 {color:#a2211f; padding:10px 0 1px 0; } .leftNavBox h5 a {color:#a2211f;} h5.teal {color:#325254;} input#addressOrigin, input#destination{padding:2px 2px; color: #666; } #selectDepartureDay { margin-top: 8px; } .linksnl { line-height: 1.5em; margin-top: 15px; } #tabDepartureAddress.panel { width:234px ; height:10px; padding: 0px;} /*-----------------------------------------------------------------------------end left navigation-----------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------rounded-corner style----------------------------------------------------------------------------*/ .container {background:#f1eee7; color:#000; margin:0 15px;} .rtop, .rbottom { display:block; background:#fff;} .rtop *, .rbottom *{display: block; height: 1px; overflow: hidden; background:#f1eee7; } .r1{margin: 0 5px;} .r2{margin: 0 3px;} .r3{margin: 0 2px;} .r4{margin: 0 1px; height: 2px;} /*-----------------------------------------------------------------------------end rounded-corner style-----------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------footer styles----------------------------------------------------------------------------*/ #footerMain { color:#666; background:url(/images/footerBG.jpg) no-repeat top left; padding:5px 0px 0px 77px; } #footer, #footer a, #footerNav li {color:#666;} #footer a:hover {color:#b3b0b0;} #footerNavWrapper { background:url(/images/footerNavBG.jpg) no-repeat top left #1a1a1a; overflow:hidden; padding:11px 62px 40px 32px; font-size:1.1em; } #footer #footerNav { margin:0 0 11px 0; } #footerNav li {display:inline;} #searchBox { width:185px; margin:19px 18px 8px 2px; background:url(/images/search.gif) no-repeat left #fff; border:1px solid #dcdcdc; padding:5px 5px 5px 30px; color:#999; float:left; display:inline; } /*--------------------------------------footer logos--------------------------------------*/ #logoOttawa { display:block; float:left; width:96px; height:55px; background:url(/images/logoOttawa.jpg) no-repeat; text-indent:-9999px; } #logoMobi { display:block; float:left; width:129px; height:55px; background:url(/images/logoMobi.jpg) no-repeat; text-indent:-9999px; } #logoPara { display:block; float:left; width:91px; height:55px; background:url(/images/logoParaTranspo.jpg) no-repeat; text-indent:-9999px; } #logoTransitWay { display:block; float:left; width:116px; height:55px; background:url(/images/logoTransitWay.jpg) no-repeat; text-indent:-9999px; } #logoBrowsealoud { display:block; float:left; width:129px; height:55px; background:url(/images/logoBrowsealoud.jpg) no-repeat; text-indent:-9999px; } #logoAccess { display:block; float:left; width:107px; height:55px; background:url(/images/logoAccessOC.jpg) no-repeat; text-indent:-9999px; } /*--------------------------------------------------------------------------end footer styles--------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------print / text resize boxes----------------------------------------------------------------------------*/ #print { margin:0; width:103px; float:right; overflow:hidden; position:relative; left:10px; display:inline; } #longColumn #print { margin:0 6px 0 0; } a#defaultTextSize { display:block; background:url(/images/printIcons.gif) no-repeat; height:16px; width:13px; text-indent:-9999px; float:left; font-size:0px; } a#bigTextSize { display:block; background:url(/images/printIcons.gif) no-repeat -12px 0px; height:16px; width:13px; text-indent:-9999px; float:left; font-size:0px; } a#biggerTextSize { display:block; background:url(/images/printIcons.gif) no-repeat -24px 0px; height:16px; width:13px; text-indent:-9999px; float:left; font-size:0px; } a#printPage { display:block; background:url(/images/printIcons.gif) no-repeat -37px 0px; height:16px; width:31px; text-indent:-9999px; float:left; font-size:0px; } a#sendPage { display:block; background:url(/images/printIcons.gif) no-repeat -67px 0px; height:16px; width:28px; text-indent:-9999px; float:left; font-size:0px; } a:hover#defaultTextSize { background-position:0px -16px; } a:hover#bigTextSize { background-position:-12px -16px; } a:hover#biggerTextSize { background-position:-24px -16px; } a:hover#printPage { background-position:-37px -16px; } a:hover#sendPage { background-position:-67px -16px; } #sendPageBox { padding:15px; margin:0; background:url(/images/lightWindowGradient.jpg) top left repeat-x; } #sendPageBox input, #sendPageBox textarea { display:block; margin:0 0 10px 0; font-family:"Trebuchet MS", Arial, Helvetica, sans-serif; } #sendPageBox .textField, #sendPageBox textarea {width:95%;} textarea { overflow-y:auto !important; } #main ul.bulletList li { margin:0px; padding:0 0 0 10px; background:url(/images/ulArrow.gif) no-repeat center left; } #sendPageBox #sendPageSubmit {width:70px;} /*--------------------------------------------------------------------------end print / text resize boxes--------------------------------------------------------------------------*/ /*----------------------------------------------------------------------------typography----------------------------------------------------------------------------*/ a { color:#000; text-decoration:none; outline: none;} /* 325254 */ a:hover {color:#900;} /* 7e9a9d */ h1, h2, h3, h4, h5, h6 { font-weight:normal; margin-bottom:5px; clear: both; } h1 { font-size:2.3em; color:#336666; } h2 { font-size:1.6em; color:#333; line-height:24px; margin-bottom:0; margin-top: 1em; } h3, h3 a{ font-size:13px; color:#666; line-height: 1.18em; color: #5A8D8D; } h3 label {font-size:14px;} h3 a {color:#000;} h3 a:hover {color:#900;} /* h3 a {color:#7e9a9d;} h3 a:hover {color:#325254;} */ h4 {font-size:1.4em;} h5 {font-size:1.3em;} h6 {font-size:1.1em;} h4, h5, h6 {color:#336666;} blockquote, code {color:#7e9a9d;} pre, blockquote {margin:1em;} #tabContainer h3 { font-size:1.3em; color:#336666; text-transform:none; } #main p, #rightColumn p, #longColumn p, ol, #main ul, #rightColumn ul, #longColumn ul { margin-bottom:1em; font-size:1.1em; line-height:1.5em; } p {text-align:justify;} .bullets { list-style:inside; color:#336666; font-size:13px; margin-left:10px; } .bullets li {margin-bottom:1em;} #leftCol p, #oneCol p {line-height:1.8em;} .yourName, hr, .sendFormTop { border-top:none; border-left:none; border-right:none; border-bottom:1px solid #c7dddf; margin:0 0 7px 0; } .textField { padding:8px 5px; } p strong { font-weight:normal; color:#333; } span.largerText { font-size: 150%; } .centered, .centered span { text-align: center !important; } span.asterisk { font-size: 185%; font-family: Courier; vertical-align:baseline !Important; position: relative; top: 4px; } .whiteBg { background-color: #fff; } a.arrowLink{ margin: 0; display: block; padding: 0 0 0 10px; background: url(/images/ulArrow.gif) no-repeat 0 6px; } /*--------------------------------------------------------------------------end typography--------------------------------------------------------------------------*/ /*------------------------------------------------------------------------inside page styles------------------------------------------------------------------------*/ #discoverOttawaWrapper { border:2px solid #d6d6d6; width:533px; position:relative; top:-5px; } #discoverOttawa { border:1px solid #edeae1; background: url(/images/discoverOttawaGradient.jpg) repeat-x bottom #edeae1; padding:10px; } #discoverOttawa ul { margin:0; padding:0; } #discoverOttawa li { color:#325254; font-size:13px; padding:0 0 0 10px; margin:0; } #discoverOttawa li a { display: block; padding-bottom: 5px; } .discoverOttawaLeft, .discoverOttawaRight { float:left; width:48%; margin:0; padding:0; } .discoverOttawaRight ul{ margin:0 0 0 5px; } .discoverOttawaThumbnail { width:98px; float:left; } .discover hr { clear: both; } .mainColThumbnailWrapper { clear: both; margin:18px 0; } .mainColThumbnailWrapper h4 { clear: none; } div.mainColThumbnailWrapper:last-child hr{ display: none !important; } .eventListingLeft, .eventListingRight { float:left; width:48%; margin:0; padding:0; } .eventListingRight ul{ margin:0 0 0 5px; } .eventListingThumbnail { width:98px; float:left; } .eventListingWrapper { margin:18px 0; } input.formField, #sendPageBox input, textarea { background:#fff; border:1px solid #dcdcdc; padding:5px; color:#999; width:85%; margin:0 0 5px 0; display:inline; font-size:11px; overflow:hidden;} .twoColumn .formField {width:93%;} .noMargin .formField, #templateForm label .formField {width:90%;} .contactSelectTypeWrapper {height:23px;} .contactSelectType { width:100%; color:#999; background:#FFF; } .descriptionField { width:95%; height:63px; margin-top:9px; font-size:11px !important; padding:9px; } #submit { border:none; background:url(/images/findOutMoreArrow.gif) no-repeat center right; padding:0 20px 0 0; float:right; text-decoration:underline; color:#336666; text-align:right; } #submit:hover {color:#7e9a9d;} #main #fleetTable td, #main #fleetTable th { border: 1px solid #aaa; border-collapse: collapse; padding: 10px; } #main #fleetTable th { font-size: 131%; } #main #fleetTable td { padding: 3px 10px; } #main #fleetTable td.borderLR { border-width: 0 1px !important; border-bottom-color: #fff; } #main #fleetTable td.borderNone { border: none !important; padding: 6px 0; } #main #fleetTable img { margin:10px 0 10px 0 !important; } .calloutFooterLinks { padding-left:5px; margin-left: 0; } #routes .calloutFooterLinks li a {padding-left:20px;} #routes .calloutWrapperWhite {margin:0px;} #routes a.preview { float: left; margin: 7px 0 12px 12px; } #routes a.preview img { width:43px; padding: 2px 4px 4px 4px; } .formWrapper p {width:90%;} .formWrapper hr { width:90% !important; } a.inPageButton { background:url(/images/calloutButton.jpg) center right no-repeat #8ba4a7; padding:4px 30px 4px 20px; color:#FFF; text-transform:uppercase; font-size:1.1em; border:1px solid #FFF; margin:5px 10px; float:left; display:inline; } a:hover.inPageButton { background:url(/images/calloutButton2.jpg) center right no-repeat #6e878b; color:#FFF; } a.inPageButtonBack { background:url(/images/calloutButtonBack.gif) center left no-repeat #8ba4a7; padding:4px 20px 4px 30px; color:#FFF; text-transform:uppercase; font-size:1.1em; border:1px solid #FFF; margin:5px 10px; float:left; display:inline; } a:hover.inPageButtonBack { background:url(/images/calloutButtonBack2.gif) center left no-repeat #6e878b; color:#FFF; } img.wheelchairIcon { margin:-5px 0 !important; } /*----------------------------------------------------------------------end inside page styles----------------------------------------------------------------------*/ /*-----------------------------------------------------------------------------callouts-----------------------------------------------------------------------------*/ .insideCallout { width:160px; padding:10px; background:url(/images/calloutGradient.jpg) repeat-x #fbfbfb; border:1px solid #e0e0e0; float:right; margin:0 0 15px 0; } .calloutWrapperWhite a, .calloutWrapperGrey a, .insideCallout a { color: #325254; } .calloutWrapperWhite a:hover, .calloutWrapperGrey a:hover, .insideCallout a:hover { color: #7e9a9d; } .twoColCallout { width:251px; padding:10px; background:url(/images/calloutGradient.jpg) repeat-x #fbfbfb; border:1px solid #e0e0e0; float:left; margin:0 10px 15px 0; } #updates .twoColCallout { width:230px; float:right; } .threeColCallout { width:158px; padding:10px 10px 10px 8px; background:url(/images/calloutGradient.jpg) repeat-x #fbfbfb; border:1px solid #e0e0e0; float:left; margin:0 11px 15px 0; display:inline; } .threeColCallout img { margin:0 !important; } .calloutWrapperGrey .threeColCallout {margin:0px;} #main .calloutWrapperGrey { border:1px solid #FFF; } .insideSubLeft { width:309px; float:left; } .findOutMore { font-size:1.2em; float:right; padding:0 22px 0 0; background:url(/images/findOutMoreArrow.gif) no-repeat center right; } .calloutLink { font-size:1.2em; padding:0 22px 0 0; background:url(/images/findOutMoreArrow.gif) no-repeat center right; line-height:18px; } .calloutLinkLeft { font-size:1.1em; color:#336666; padding:0 0 0 22px; background:url(/images/findOutMoreArrow.gif) no-repeat center left; display:block; line-height:1.6em; } .PDF { background:url(/images/PDF.gif) no-repeat 0 3px; } #rightColumn p {margin-top:5px;} .calloutWrapperWhite, .calloutWrapperGrey { margin: 0 0 8px 0; background:#e6e6e6; } .calloutWrapperWhite { border:1px solid #FFF; } .calloutWrapperGrey { border:1px solid #e6e6e6; } .calloutFooter {padding:10px;} .calloutGrey { border:1px solid #e6e6e6; background:url(/images/calloutGradient.jpg) repeat-x #fcfcfc; padding:12px; } #main .calloutGrey img {margin:0;} #main .calloutGrey {padding:7px;} .calloutTall { border:1px solid #FFF; background:url(/images/calloutGradientTall.jpg) repeat-x #fcfcfc; padding:12px; } a.calloutButton { background:url(/images/calloutButton.jpg) center right no-repeat #8ba4a7; padding:4px 30px 4px 20px; color:#FFF; text-transform:uppercase; font-size:1.1em; border:1px solid #FFF; margin:5px 10px; float:right; display:inline; } a:hover.calloutButton { background:url(/images/calloutButton2.jpg) center right no-repeat #6e878b; color:#FFF; } .paraCalloutLogo { margin:10px 0px 5px 50px; } #rightColumn .headerBG { background:#c7dddf; padding:5px 10px; margin:0 0 3px 0; text-align:left; font-size:10px; } #rightColumn .headerBG p {margin:0;} .accessCalloutLink { margin:5px 5px 7px 5px; } #paraTranspoCalloutBanner { background:url(/images/files/callout_images/paraTranspo.jpg) no-repeat top left; display:block; width:190px; w\idth:170px; height:184px; he\ight: 50px; padding: 114px 10px 30px; overflow:hidden; color: #fff; font-size: 12px; font-style: italic; } #videoLink { display: block; } #videoLink span { display: block; } #videoLink span img { width: 172px; } /*---------------------------------------------------------------------------end callouts---------------------------------------------------------------------------*/ /*---------------------------------------------------------------------------routes styles--------------------------------------------------------------------------*/ #routesFormWrapper { padding:0 10px; width: 465px; } .routesTable { border-collapse: separate; } .routesTable { width:740px; background:url(/images/routesBG.gif) top left no-repeat; margin:0 0 3px 0;} .routesTable .th {font-size:11px;} .routesTable tr {background:#FFF;} .routesTable td { padding:3px 2px !important; text-align: center !important; } .routesTable td.routesTableCorner img{ float: left; } .routesTable .beige{ background:#f1eee7; border:1px solid #f1eee7; } #routes #tabContainer .row { padding-top: 3px; height: 18px; } a.blackRoutes, a.greenRoutes, a.redRoutes, a.schoolRoutes, a.otrainRoutes, a.blueRoutes { display:block; padding:4px 10px; color:#FFF; font-size:1.1em; margin:0 0 3px 0; } #updates a.blackRoutes, #updates a.greenRoutes, #updates a.redRoutes, #updates a.schoolRoutes, #updates a.otrainRoutes, #updates a.blueRoutes { width:120px; float:left; } .updates { margin:0 0 0 7px; color:#000; } .updatesHeader { background:url(/images/transitUpdates.gif) no-repeat left; color:#325254; margin-bottom:12px; } .updatesHeader h2 { margin:0 5px 0 5px; color:#325254; } .majorDelays {color:#c00;} .minorDelays {color:#666;} .updateTime { float:right; padding:5px 12px; } #updates .twoColumn {margin-right:10px;} a.blackRoutes { display:block; background:url(/images/routeArrow.gif) no-repeat center right #000; } a.greenRoutes { display:block; background:url(/images/routeArrow.gif) no-repeat center right #393; } a.redRoutes { display:block; background:url(/images/routeArrow.gif) no-repeat center right #F00; } a.schoolRoutes { display:block; background:url(/images/routeArrow.gif) no-repeat center right #b31e1e; } a.otrainRoutes { display:block; background:url(/images/routeArrow.gif) no-repeat center right #600; } a.blueRoutes { display:block; background:url(/images/routeArrow.gif) no-repeat center right #3399cc; } a:hover.blackRoutes { background:url(/images/routeArrow.gif) no-repeat center right #404040; } a:hover.greenRoutes { background:url(/images/routeArrow.gif) no-repeat center right #67b367; } a:hover.redRoutes { background:url(/images/routeArrow.gif) no-repeat center right #ff4040; } a:hover.schoolRoutes { background:url(/images/routeArrow.gif) no-repeat center right #c75757; } a:hover.otrainRoutes { background:url(/images/routeArrow.gif) no-repeat center right #8d4040; } a:hover.blueRoutes { background:url(/images/routeArrow.gif) no-repeat center right #67b3d9; } #routes #vertical_container.selectRouteType .accordion_content ul { list-style-type: none !important; float: left; } #routes #vertical_container.selectRouteType .accordion_content li { list-style-type: none; margin:0 !important; float: left; clear: both; width: 99%; } #routes #vertical_container.selectRouteType .accordion_content a { float: left; border-bottom: 1px solid #fff; clear:both; } #routes #main option { color:#325254 !important; } #routes #main select, #routes #main input, #routes #main label { margin:0 0 5px 0; } #routes #main label { margin:0 0 5px 0; line-height:18px; font-size:12px; color:#325254; } #routes .twoColumn { margin:0 0 5px 0; } #selectRoute {width:135px;} #selectRouteTimetable {width:160px;} .routesTable .th { padding:9px 0; } .routesTable .topRow { background-color: transparent; border:none; } a#routeHelp { background:url(/images/speechBubble.gif) no-repeat bottom left; padding:5px 0 0 15px; margin:0 0 10px 8px; text-decoration:underline; clear:both; } #or { position:absolute; right:25px; top:68px; font-size:14px; color:#325254; } #routes h3 {color:#325254;} #routesFormWrapper .button { position:relative; top:10px; } #routes.wide .routesMain #main { width: 685px; } #routes.wide #print { float: left; margin-left: 375px; } #routes.wide #routesFormWrapper { float: left; margin-bottom: 10px; } #routes.wide #routesFormWrapper hr { margin-left: -10px; width: 105%; } #routes.wide #tabContainer ul#tabsRoutes { width: auto; margin-left:0; } #routes.wide .stopNames { float: left; background-color:#C7DDDF; width: 666px; margin-bottom: 10px; } #routes.wide .stopNames div { float: left; text-align: center; color:#336666; font-weight:bold; padding-top:7px; height:58px; font-size: 1em; line-height: 1.2em; } #routes.wide .stopTimes { clear:both; float: left; width:682px; height: 400px; overflow: scroll; overflow-x: hidden; overflow-y: auto; } #routes.wide .row {clear:both;width:664px;height:18px;} #routes.wide .beige {background-color:#f1eee7; border:1px solid #f1eee7; } #routes.wide .row div {float:left;text-align:center;padding:2px 0px;} #routes.wide .topRowAfter .routesTableCorner img{ float: left;} #routes.wide .direction { float: right; position: relative; top:0; left: 18px; width: 18px; text-indent: -9999px; } #routes.wide .direction:hover { background-color: #92b6b9 !important; } #routes.wide .calloutWrapperWhite { float: right; width: 183px; background-color: #f3f3f3; } #routes.wide .calloutWrapperWhite img { margin: 5px; } #routes.wide #main ul.calloutFooterLinks { float: left; width: 95px; padding-left: 5px; margin-left: 0; } #routes.wide #main ul.calloutFooterLinks li { list-style-type: none; margin-left: 0; margin-bottom: 0; } #routes.wide .viewRouteMap { display:block; background: url(/images/view-map-button.gif) 0 0 no-repeat; height:52px; width:167px; text-indent:-9999px; margin:4px 0 0 7px; } .francais .viewRouteMap { background-image: url(/images/view-map-button-fr.gif); } #routes.wide .viewRouteMap:hover { background-position: 0 -51px; } #routes.wide .calloutWrapperWhite h3 { font-weight: bold; margin: 10px 0 0 12px; } #routes.wide #tabsRoutes li.first { margin-left: 3px; } #routes .directionLink { position: absolute;} #routes .directionLink a { position: relative; left: 592px; top: 16px; font-size: 110%; } #routes .timetable h2 { display: none; } /*-------------------------------------------------------------------------end routes styles------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------accordion styles------------------------------------------------------------------------*/ /* .accordion_toggle { display: block; height: 14px; background:#c7dddf; padding: 0 10px 0 10px; font-weight: normal; line-height: 30px; text-decoration: none; outline: none; cursor: pointer; margin: 0 0 0 0; color:#336666; margin:0 0 3px 0; }*/ .accordion_header { display: block; height: auto; background:#c7dddf; padding: 0 10px 0 10px; line-height: 20px; font-weight: normal; text-decoration: none; outline: none; cursor: pointer; margin: 0 0 0 0; color:#336666; margin:0 0 3px 0; } /*-- accordion headers (all) --*/ .accordion_toggle:hover {color:#FFF;} /*-- accordion F2 states --*/ .accordion_content { clear:both; overflow: hidden; line-height:1.2em; } /*-- accordion content --*/ .accordion_content h2 { margin: 15px 0 5px 10px; color: #0099FF; } #routesFormWrapper .accordion_content { padding-bottom: 6px; } #routesFormWrapper .accordion_content a { display: block; margin-left: 4px; margin-bottom: 0; padding: 2px 0 2px 18px; text-indent: -20px; } #routesFormWrapper .accordion_content br { display: none; } .accordion_toggle .indicator { float: right; display: block; width: 12px; height: 12px; background-image: url(/images/accordion-arrow.gif); margin: 7px 0 0 6px; overflow: hidden; } .accordion_toggle:hover .indicator { background-position: 0 -12px; } .accordion_toggle_active .indicator { background-position: 1px -25px; } .accordion_toggle_active:hover .indicator { background-position: 1px -40px; } /*-----------------------------------------------------------------------end accordion styles----------------------------------------------------------------------*/ /*----------------------------------------------------------------------form validation styles---------------------------------------------------------------------*/ .validation-advice { color:#820101; padding:3px 0; font-weight:bold; } /*--------------------------------------------------------------------end form validation styles-------------------------------------------------------------------*/ /*---------------------------------------------------------------------------form styles---------------------------------------------------------------------------*/ #main label { line-height:16px; margin-bottom:5px; display:block; } .formColumn { width:248px; margin:0 10px 0 0; overflow:hidden; } .twoColumn select {margin-left:5px;} form .twoColumn { padding:0 !important; } .checkBoxTwoLine { margin:3px 5px 5px 0; float:left; display:inline; } label {font-size:11px;} .checkBox { margin:0 8px 0 3px; } .formWrapper { margin-bottom:5px !important; padding-left:25px; padding-right:0px; } .formWrapper label {width:480px;} .formWrapper textarea {width:492px;} .formWrapper .twoColumn label {width:245px;} .formWrapper h3 {font-size:14px;} .formWrapper hr {width:507px;} #submitBTN { float:right; display:inline; margin-right:22px; } /*-------------------------------------------------------------------------end form styles-------------------------------------------------------------------------*/ /*-------------------------------------------------------------------------Travel Planner Style-------------------------------------------------------------------------*/ #TripPlanDetailsTable td {width:120px;padding:5px;border:0px;} #TripPlanDetailsTable td.selected {background-color: #666;color:#fff;} #TripPlanDetailsTable table {margin-bottom:20px;} #TripPlanDetailsTable li.step {padding: 5px 0 0 5px;} #TripPlanDetailsTable li.walknote {margin: 2px 20px 5px 20px; padding:5px; background-color:#DAE3FF;} #TripPlanDetailsTable td.checkbox {width:300px;} /*-------------------------------------------------------------------------end Travel Planner styles-------------------------------------------------------------------------*/ /* new styles for tables and list-items / April 21, 2009 */ #main ul li { list-style:disc; margin-left:15px; margin-bottom:8px; } #main ul.bulletList li, #main #tabs li, #main #tabsRoutes li, #main .tabsStyle li, #main .discoverOttawaLeft li, #main .discoverOttawaMiddle li, #main .discoverOttawaRight li, #main .bulletList li { list-style:none !important; margin-left:0px; margin-bottom:0px; } .headerBG h3 { font-size:1.5em; padding:7px 0; color:#333; } #main {margin-bottom:100px;} #main table {width:100%;} #main caption { padding:5px; font-size:1.6em; font-weight:normal; } #main th { font-weight:bold; color:#336666; } #main thead {background:#e3e3e3;} #main td, #main th { font-size:1.1em; border:1px solid #bbb; padding:5px; text-align:left; } #main .routesTable td, #main .routesTable .th { border:none !important; } .routesTable { width:470px; background:url(/images/routesBG.gif) top left no-repeat; margin:0 0 3px 0; } .th { padding-top:7px !important; padding-bottom:10px !important; } /*--------- Routes ----------*/ #routes .twoColumn { padding-right: 1.5%; } a.blackRoutes, a.greenRoutes, a.redRoutes, a.schoolRoutes, a.otrainRoutes, a.blueRoutes { width: 92%; padding-right: 15px !important; } h1.blackRoutes { color: #000; } h1.greenRoutes { color: #393; } h1.redRoutes { color: #F00; } h1.schoolRoutes { color: #b31e1e; } h1.otrainRoutes { color: #600; } h1.blueRoutes { color: #3399cc; } h1.blackRoutes, h1.greenRoutes, h1.redRoutes, h1.schoolRoutes, h1.otrainRoutes, h1.blueRoutes{ width: 100%; } h1.blackRoutes .headerArrow { background: #000; } h1.greenRoutes .headerArrow { background: #393; } h1.redRoutes .headerArrow { background: #f00; } h1.schoolRoutes .headerArrow { background: #b31e1e; } h1.otrainRoutes .headerArrow { background: #600; } h1.blueRoutes .headerArrow { background: #3399cc; } h1.blackRoutes .headerArrow, h1.greenRoutes .headerArrow, h1.redRoutes .headerArrow, h1.schoolRoutes .headerArrow, h1.otrainRoutes .headerArrow, h1.blueRoutes .headerArrow{ display:block; float:left; margin: 0 5px 0 0 !important; padding: 0 !important; width: 25px; height: 25px; background-image: url(/images/routeArrow.gif); background-repeat: no-repeat; background-position: 11px 10px; } h1.blackRoutes .header, h1.greenRoutes .header, h1.redRoutes .header, h1.schoolRoutes .header, h1.otrainRoutes .header, h1.blueRoutes .header {float:left} .selectRouteType { padding-right: 0 !important; width: 50% !important; } .leftNavBoxContent .wide { width: 90%; } #routes #selectRouteType { margin: 5px 0 0 10px; font-size: 1.1em; font-weight: normal; } #routes #tabContainer { margin-top: 10px } #routes #main label { margin-bottom: 5px; } #main .routesTable .note td { font-weight: normal; } .routesTable .topRow {} .routesTable .topRow th {padding-bottom: 0 !important; background-color: #c7dddf; } .routesTable .topRow .first { background-image: url(/images/routesBGlefttop.gif); background-repeat: no-repeat; } .routesTable .topRowAfter td { padding:0 !important; background-color: #c7dddf; vertical-align: bottom; } .routesTable .topRowAfter img { margin:0 !important; } .topRow .direction { padding: 0px !important; background-color: #78a4a8;} tr.topRow th { padding-top:7px !important; padding-bottom:10px !important; } .topRow th { vertical-align: top; height: 55px; } .topRow span { cursor: help; } .topRow .direction { background: #78a4a8 url(/images/routes-change-dir-icon.gif) center center no-repeat !important; width: 17px; } .topRow .direction:hover, .topRow .direction.hover { background-color: #92b6b9 !important; } .topRow .direction a { background: url(/images/routes-change-dir-topright.gif) 4px top no-repeat;} .topRow .direction a { display:block; text-indent:-9999px; width:17px; height: 2.5em; } .topRowAfter .direction { text-align: right !important; vertical-align: bottom !important; } .topRowAfter .direction img { width: 4px; height: 5px;} .topRowAfter .direction a { display:block; width:17px; height: 5px; background-color: #78a4a8 !important;} .topRowAfter .direction a:hover, .topRowAfter .direction.hover a { background-color: #92b6b9 !important; } .topRowAfter .topright { background: url(/images/routes-change-dir-topright.gif) 4px top no-repeat;} .topRowAfter.note td { background-image: url(/images/routes-change-dir-bottomright.gif); background-position: right top; background-repeat: no-repeat; } .routeNote { background-color: #c7dddf; font-size: 110%; color: #336666; padding: 7px; margin: 0; } .selectRouteTypeImg a.blackRoutes, .selectRouteTypeImg a.greenRoutes, .selectRouteTypeImg a.redRoutes, .selectRouteTypeImg a.schoolRoutes, .selectRouteTypeImg a.otrainRoutes, .selectRouteTypeImg a.blueRoutes { float: left; background-position: 6px 6px !important; width: 10px !important; height: 10px !important; text-indent: -9999px; margin-top: 7px !important; margin-right: 2px !important; padding: 3px 3px 3px 3px !important; } #routes .label { float:left; clear:both; margin-top: 10px; margin-right: 6px; color:#333; } #navRouteNumber { float:left; width: 100px; margin: 4px 0 0 3px; } h5.selectARoute{ padding:0; font-size: 1.5em; } .buttonSubmit.noTopMargin { margin-top: 0; } /*----------------- Routes Tabs --------------*/ #routes #tabsRoutes a.active-tab { color: #333; font-size:120%; } /* ---------------- Bus Fleet styles ---------*/ table#fleetTable { padding: 0; margin: 0; border: none; } table#fleetTable td { padding: 10px 10px 10px 0; text-align: left; border: none; } table#fleetTable td p{ margin: 0 !important; padding: 0 !important; } table#fleetTable td p img{ padding: 0; margin: 0 0 5px 0 !important; } /* ---------------- Community styles ---------*/ .eventsListing .listBox{ margin-bottom: 25px !important; } .eventsListing hr{ margin-bottom: 20px !important; } #community .emLink { font-size: 100%; } /* ---------------- Left nav fixes ---------*/ #container { width:253px; overflow:hidden !important; position:relative; background:url(/images/leftNavBG.gif) repeat-x bottom left #ece9e0; } #slider { width:1012px; position:relative; left:0px; overflow:hidden; background:url(/images/leftNavBG.gif) repeat-x bottom left #ece9e0; } #slider #panel1, #slider #panel2, #slider #panel3, #slider #panel4 { width:253px; float:left; } select.selectDay {display:block;} #subNavSchedule {padding-bottom:100px;} #selectRoute {width:213px;} #leftColumn #selectRoute {width:217px;} #selectDay, .selectDay { display:block; margin-bottom:0px; } .leftNavBox .selectDayLabel { float: left; } .leftNavBox .selectDayField { width: 202px; } /* ---------------- routes fixes ---------*/ .routesMain #main {width:485px;} .routesMain #rightColumn {margin-left:12px;} #paraTabs li { list-style:none; display:inline; margin-left:0px; } /* ---------------- tickets & passes styles ---------*/ table#faresByType { margin-top: 20px; } #tabContainer #tabFix {display:none;} #tabContainerDouble #tabFix { height:0px; width:100%; margin:0px; overflow:hidden; border:none; } .paraCalloutWrapper p { padding:0px 10px; } #routes .accordion_content {display:none;} #tickets #tabContainer .panel table{ margin-bottom: 10px !important; } /*-- stylesSearch --*/ /*** Content ***/ #searchResults .searchBoxWrapper{ width: 538px; height: 50px; margin-bottom: 10px; margin-top: 20px; background: url(/images/greyBoxRounded.gif) no-repeat; padding: 18px 0 0 18px; } #searchResults .searchBoxWrapper input#searchField{ width: 210px; padding: 4px 0 2px 2px; margin-right: 5px; font-size: 100%; color: #999; } #searchResults .searchBoxWrapper input#searchButton{ padding: 3px 14px; } #searchResults .searchBoxWrapper p{ margin-top: 3px; } #searchResults .searchPagination{ width: 550px; height: 30px; position: relative; } #searchResults .searchPagination p{ float: left; margin-left: 10px; } #searchResults .searchPagination .paginate { position: absolute; /* dunno how wide this might get, so don't want to float it w/out a width */ top: 0; right: 0; } #searchResults .searchPagination .paginate a { display: inline; text-decoration: underline; padding: 2px 5px 3px 5px; } #searchResults .searchPagination .paginate a:hover{ color: #fff; background: #336666; } #searchResults .searchResult{ width: 540px; margin-left: 10px; margin-bottom: 20px; } #searchResults .searchResult h2{ margin-bottom: 0; font-size: 180% !important; } #searchResults .searchResult p{ margin-bottom: 4px; } #searchResults .searchResult h2 a{ text-decoration: underline; } #searchResults .searchResult h2 a:hover{ text-decoration: none; } #searchResults .searchResult p{ font-size: 130% !important; line-height: 113%; } #searchResults .searchResult a.resultLink{ font-size: 121% !important; } /* stylesSitemap */ /*** Content ***/ #sitemap { margin-top: 20px; } #sitemap .threeColumn{ width: 140px; margin-right: 80px; float: left; } #sitemap .last{ margin-right: 0; } #sitemap h2 { color: #000 !important; text-transform: uppercase; } #sitemap ul li h3 a{ font-size: 113% !important; } #sitemap ul{ margin-bottom: 20px; } #sitemap ul.bulletList li{ padding: 0 0 0 2px; } #sitemap ul.bulletList li a{ margin: 0; display: block; padding: 0 0 0 10px; background: url(/images/ulArrow.gif) no-repeat 0 6px; } /* tabs */ #tabContainer { margin:0 0 50px 0; } #main #tabContainer ul#tabs, #main #tabContainer ul#tabsRoutes, #main #tabContainer ul.tabsStyle { width: 470px;margin-left: 0; } #rightColumn #tabContainer {margin:0;} .panel { clear: both; display: none; padding:15px 3px; } #tabContainer .panel { padding: 0; } #tabContainer .panel h3 { margin: 0 0 5px; } #tabContainer .accordion_header { height: auto; line-height: 1.4em; padding: 5px 10px; } .accordion_header .detail { color: #8BA4A7; font-size: 90%; display: block; clear: left; } .accordion_header .title { float: left; width: 300px; } .accordion_header .date { float: right; } .accordion_header .readMore { clear: both; display: block; width: 1px; height: 1px; text-indent: -9999px; zoom: 1; visibility: hidden; font-size: 0; } #tabContainer .accordion_content p { padding: 5px 10px 0; } #tabContainer .accordion_content strong { font-weight: bold; } .panel.active-tab-body { display: block; } .panel h3 { margin:0 0 12px 0; } .clear {clear:both;} #tabs, #tabsRoutes, .tabsStyle, #paraTabs { list-style: none; background:url(/images/tabNavBG.png) no-repeat; height:22px; } #tabs li, #tabsRoutes li, .tabsStyle li, #paraTabs li { float: left; border-top:1px solid #ccc; border-left:1px solid #ccc; border-right:1px solid #ccc; margin-right:3px; line-height:15px; font-size:11px; } #tabs a, #tabsRoutes a, .tabsStyle a, #paraTabs a { float: left; padding: 3px 10px; background:url(/images/tabBG.gif) bottom left repeat-x; text-decoration: none; color: #999999; } #tabs a:hover, #tabsRoutes a:hover, .tabsStyle a:hover, #paraTabs a:hover {color:#325254;} #tabs a.active-tab, #tabsRoutes a.active-tab, .tabsStyle a.active-tab, #paraTabs a.active-tab { background-position:0px 0px; border-bottom:none !important; color:#325254; } #tabContainerDouble #tabs { background:url(/images/tabNavBGTall.png) no-repeat; height:44px; } #rightColumn #tabs a, #rightColumn #tabsRoutes a, #rightColumn .tabsStyle a, #rightColumn #paraTabs a { background:url(/images/tabBG2.gif) bottom left repeat-x; } #rightColumn #tabs a:hover, #rightColumn #tabsRoutes a:hover, #rightColumn .tabsStyle a:hover, #rightColumn #paraTabs a:hover, #rightColumn #tabs a.active-tab, #rightColumn #paraTabs a.active-tab { background:url(/images/tabBG2.gif) 0px 0px; } #rightColumn .panel { padding:0 3px; } #paraTab2 #paraLinksWapper { margin-bottom: 6px; } #paraTab2 #paraLinksWapper div { width: 180px; padding: 0 !important; margin-left: 5px; } #paraTab2 div a { display: block; width: 180px; padding: 3px 0 3px 5px; w\idth: 175px;} /* tables */ table #dayPass{ border: none; background:#ffffff; } table #noBorder{ border: none; background:#ffffff; letter-spacing: 1px; } th.noBorder{ border:solid #000000; border-width: 0 0 2px 0; } p.service{ font: bold 1.4em/120% Verdana, Arial, Helvetica, sans-serif; color:#b8c6ce; } table #fleet { font: normal 75%/150% Verdana, Arial, Helvetica, sans-serif; border-collapse: collapse; border: 2px solid #CCCCCC; border-top: 2px double #CCCCCC; border-bottom: 2px double #CCCCCC; } #fleet th { font: bold 1.4em/120% Verdana, Arial, Helvetica, sans-serif; padding: 3px 6px; font-variant: small-caps; color: #000000; text-align: center; letter-spacing: -1px; background:#edeae1; } #fleet td { color: #000000; } #fleet thead th { border: 1px solid #87CEFA; white-space: nowrap; background: #F0F8FF; } #fleet t tbody td { padding: 2px 4px; background: #fff; color: #000; } tbody th { padding: 2px 4px; color: #000; } #fleet tbody th #fleet{ color: #047; font-weight: normal; font-variant: normal; font-size: 1em; } tbody tr.odd #fleet{ border: 1px solid #ccc; } tbody tr.odd td, tbody tr.odd th #fleet{ background: #F0F8FF; } tfoot td, tfoot th #fleet{ border: none; padding-top: 10px; } caption #fleet{ font-family: "Georgia", serif; letter-spacing: 5px; font-style: italic; text-align: center; text-indent: 2em; text-transform: uppercase; font-size: 150%; padding: 10px 0; color: #047; } table a:link #fleet{ color: #DC143C; } table th a:link #fleet{ color: #047; text-decoration: none; } table a:visited #fleet{ color: #036; text-decoration: line-through; } table a:hover #fleet{ color: #000; text-decoration:none; } table a:active #fleet{ color: #000; } /*-- stylesHome --*/ #home .leftNavBox{background: #edeae1 url(/images/leftNavBG.gif) bottom left no-repeat;} .leftNavCap{height:14px; width:253px; background:url(/images/leftNavCap.png); margin-bottom: 10px; } .leftNavBoxContent{ padding:0 3px 15px 15px; } .leftNavBox h4{ text-indent: -9999px; height: 27px; } #leftNavQuickPlanner h4{ background: url(/images/leftNavHeaderQuickPlanner.gif) no-repeat; } #leftNavQuickPlanner .leftNavBoxContent{padding-top:10px;} #leftNavMaps .leftNavBoxContent {padding-bottom:20px;} #leftNavMaps h4{background: url(/images/leftNavHeaderMaps.gif) no-repeat;} #leftNavMaps h5{color:#a2211f; padding:10px 0 1px 0;} #leftNavSchedule h4{background: url(/images/leftNavHeaderSchedule.gif) no-repeat;} #leftNavSchedule h5{margin:15px 0 5px 0;} #home #leftNavSchedule h5{margin:3px 0 5px 0;} #home .leftNavBoxContent {padding:0 3px 5px 15px;} #leftNavQuickPlanner .leftNavBoxContent {padding:8px 3px 15px 15px;} #home #leftNavMaps{padding-bottom:15px;} #home #sendFormBox{display:none;} #home #selectDay, #home .selectDay { display:block; margin-bottom:0px; } #home .dateMonth, #home .dateYear, #home .dateDay { margin-top:4px; } .leftNavBox { width:252px; overflow:hidden; } /*** Tabs ***/ .leftNavBox .panel {display: none; padding:6px 0 15px 0 !important;} .leftNavBox .panel.active-tab-body {display: block;} .leftNavBox .panel h3 {margin:0 0 12px 0;} .tabContainerLast .panel{padding-bottom:12px !important;} .leftNavBox .tabs {list-style: none; background:url(/images/tabNavBG.png) no-repeat; height:20px !important;} .leftNavBox .tabs li { float: left; border-top:1px solid #ccc; border-left:1px solid #ccc; border-right:1px solid #ccc; margin-right:3px; line-height:15px !important; font-size:10px !important; } .leftNavBox .tabs a { float: left; padding: 2px 3px !important; background:url(/images/tabLeftNavBG.gif) bottom left repeat-x !important; text-decoration: none; color: #000 !important; } .leftNavBox .tabs a:hover {color:#000 !important;} .leftNavBox .tabs a.active-tab {background-position:0px 0px !important; border-bottom:none !important; color:#000 !important;} /*** End of Tabs ***/ .emLink {text-decoration:underline;font-size:108%;color:#5a8d8d;} .emLink:hover {color:#325254;} .linkArrow { float: left; display:block; padding:4px 0 4px 20px; margin-right: 15px; background:url(/images/findOutMoreArrow.gif) no-repeat center left; } .leftNavBox .linkPDF { float: left; display:block; padding:4px 0 4px 18px; margin-right: 15px; background:url(/images/callouts/calloutIconPDF.gif) no-repeat center left; } .leftNavBox .timeType{width:80px;margin-top:4px;color:#336666;} .leftNavBox .dateMonth{width:68px;margin-top:4px;color:#336666;} .leftNavBox .dateDay{width:60px;margin-top:4px;color:#336666;} .leftNavBox .dateYear{width:67px;margin-top:4px;color:#336666;} #leftNavQuickPlanner .dateMonth, #slider #panel4 .dateMonth{width:38px;margin-top:4px;color:#336666;} #leftNavQuickPlanner .dateDay, #slider #panel4 .dateDay{width:42px;margin-top:4px;color:#336666;} #leftNavQuickPlanner .dateYear, #slider #panel4 .dateYear {width:48px;margin-top:4px;color:#336666;} .leftNavBox .dateTime{margin:5px 0 7px 0;color:#336666;} .leftNavBox .buttonSubmit{text-align:right; margin:10px 15px 0 0;} .leftNavBox .buttonSubmit input{padding:2px 4px;} .leftNavBox label{padding-top: 3px; font-size:110%; color:#333; margin-right:3px;} .leftNavBox input#origin1, .leftNavBox input#destination1{padding:2px 2px;} .leftNavBox #origin1, .leftNavBox #destination1 { width: 127px; } .leftNavBox .region { width: auto; color: #666; width: 85px; } /*** Right Nav ***/ #liveUpdates p{margin:0 0 5px 0;} #liveUpdates .blackRoutes, #liveUpdates .greenRoutes, #liveUpdates .schoolRoutes, #liveUpdates .otrainRoutes, #liveUpdates .redRoutes, #liveUpdates .blueRoutes{margin-top:10px !important;width:60%;} /*** End Right Nav ***/ /*** Content ***/ #home #newsCol1, #home #newsCol2{float:left;width:46%;} #home #latestNews {width: 440px; } #home #latestNews h2, #home #newsCol1 h2, #home #newsCol2 h2{font-size:12px; line-height:15px;color:#336666; float: left; } #home #latestNews p{ width:235px; float: left;} #home #main h1{margin-bottom:6px;} #home #main h2{margin-left:2px;} #home #latestNews img{margin:0 15px 20px 0;} #home #latestNews h2{margin-top: 50px;} #home #latestNews img, #home #latestNews h2, #home #latestNews h2 a{float:left;} #home #newsCol1{margin-right: 40px} #questions h2{ margin-left: 0 !important; } label.radio {float:left;} .expressTabs #tabs li a { font-size:0.9em !important; } /* .message { background-color: #e6e6e6; padding: 10px; } */ .message { background-color: #A0CE67; padding: 10px; } .message {color:#000;} #main ul.message li { margin-bottom: 0; } .message .emLink { font-size: 100%; } .message .linkArrow { float: none; display: inline; } .welcomeMessageContent { line-height: normal; padding: 20px; } .welcomeMessageContent h1 { color:#336666; font-size:2em; } .welcomeMessageContent p { text-align: left; font-size: 140%; line-height: 140%; margin-bottom: 10px; width: 90%; } .welcomeMessageContent .switchLang { font-size: 1.4em; } .routeType { padding-top:10px !important; } .print { display: none; } a#fdbk_tab_commentaires { top: 25%; left: 0; width: 42px; height: 102px; color: #fff; cursor: pointer; text-indent: -9999px; overflow: hidden; position: fixed; z-index: 100000; margin-left: -7px; background-color: #222; background-image: url(/images/feedback.png); _position: absolute; } a#fdbk_tab_commentaires:hover { margin-left: -4px; } a#fdbk_tab_commentaires { right: 0 !important; left: auto !important; margin-right: 0 !important; margin-left: auto !important; width: 35px !important; } a#fdbk_tab_commentaires:hover { width: 38px !important; margin-right: 0 !important; margin-left: auto !important; } .regionNote { margin: 10px 0; } .regionNote.style1 { background-color: #F5F5DD; padding: 10px 10px 1px 10px; } .regionNote.style2 { margin: 0; } #leftColumn .regionNote { margin-right: 10px; font-size: 11px; } #leftColumn .regionNote p { text-align: left; padding-bottom: 9px; } #accessibleTopLink { float: left; text-indent: -9999px; margin-left: -9999px; } /** Custom Tables **/ #video_style table{width: 480px;} #video_style td, #video_style th { font-size:1.1em; border-style:none; border-spacing:0; padding-left:0; padding-right:0; width:33%; text-align: center;} #video_style p {text-align:center;} #video_style img{text-align:center;} /* footer social nav */ #footerNavWrapper { padding:11px 12px 40px 32px; } #footerNavWrapper p {clear:both;} #footerNav { padding:20px 0 0; width:800px; float:left; } #footerSocialNav { width:150px; float:right; padding-top:15px; } #footerSocialNav li { display:block; float:left; width:30px; height:20px; } #footerSocialNav li a { display:block; width:100%; height:100%; background:url(/images/footerSocial2.gif) no-repeat 0px 0px; text-indent:-9999px; } #footerSocialNav li#footerFlickr a { background-position:-3px 0px; } #footerSocialNav li#footerYoutube a { background-position:-33px 0px; } #footerSocialNav li#footerTwitter a { background-position:-63px 0px; } #footerSocialNav li#footerFacebook a { background-position:-93px 0px; } #footerSocialNav li#footerRSS a { background-position:-123px 0px; } #footerSocialNav li#footerFlickr a:hover { background-position:-3px -40px; } #footerSocialNav li#footerYoutube a:hover { background-position:-33px -40px; } #footerSocialNav li#footerTwitter a:hover { background-position:-63px -40px; } #footerSocialNav li#footerFacebook a:hover { background-position:-93px -40px; } #footerSocialNav li#footerRSS a:hover { background-position:-123px -40px; } /* sidebar social nav */ #sidebarSocialNav {width:175px;} #sidebarSocialNav li { display:block; float:left; width:35px; height:50px; margin:0; } #sidebarSocialNav li a { display:block; width:100%; height:100%; background:url(/images/subNavSocial2.jpg) no-repeat 0px 0px; text-indent:-9999px; } #sidebarSocialNav li#sidebarFlickr a { width: 35px; background-position:0px 0px; } #sidebarSocialNav li#sidebarYoutube a { width:35px; background-position:-35px 0px; } #sidebarSocialNav li#sidebarTwitter a { background-position:-70px 0px; } #sidebarSocialNav li#sidebarFacebook a { background-position:-105px 0px; } #sidebarSocialNav li#sidebarRSS a { background-position:-140px 0px; } #sidebarSocialNav li#sidebarFlickr a:hover { background-position:0px -51px; } #sidebarSocialNav li#sidebarYoutube a:hover { background-position:-35px -51px; } #sidebarSocialNav li#sidebarTwitter a:hover { background-position:-70px -51px; } #sidebarSocialNav li#sidebarFacebook a:hover { background-position:-105px -51px; } #sidebarSocialNav li#sidebarRSS a:hover { background-position:-140px -51px; } #topNav { width: 440px; } .fr #topNav {width:480px;} #wrapper{width:996px}#logoWrapper{width:250px;padding-left:17px}a#logo{width:250px}#main{width:470px}#leftColumn{margin-left:13px}#rightColumn{width:200px;overflow:hidden}#mainNav{padding:89px 0 0 0}#mainNav li{float:left}#mainNav li a{display:block;text-indent:-9999px;height:44px;background:url(/images/mainNavNew.gif) no-repeat;padding:10px 12px 0 12px}#mainNav #mainNavHome{background-position:right 0px}#mainNav #mainNavUpdates{background-position:-83px 0px}#mainNav #mainNavTicketsPasses{background-position:0px 0px}#mainNav #mainNavRoutesMaps{background-position:-212px 0px}#mainNav #mainNavDiscoverOttawa{background-position:-326px 0px}#mainNav #mainNavCommunity{background-position:-432px 0px}#mainNav #mainNavTravelTips{background-position:-566px 0px}#mainNav #mainNavAbout{background-position:-672px 0px}#mainNav a:hover#mainNavHome, #home a#mainNavHome{background-position:right 0px;color:#85d6db !important}#mainNav a:hover#mainNavUpdates, #updates a#mainNavUpdates{background-position:-83px 0px;color:#85d6db !important}#mainNav a:hover#mainNavTicketsPasses, #tickets a#mainNavTicketsPasses{background-position:0px 0px;color:#85d6db !important}#mainNav a:hover#mainNavRoutesMaps, #routes a#mainNavRoutesMaps, #travelplanner a#mainNavRoutesMaps{background-position:-212px 0px;color:#85d6db !important}#mainNav a:hover#mainNavDiscoverOttawa, #discover a#mainNavDiscoverOttawa{background-position:-326px 0px;color:#85d6db !important}#mainNav a:hover#mainNavCommunity, #community a#mainNavCommunity{background-position:-432px 0px;color:#85d6db !important}#mainNav a:hover#mainNavTravelTips, #travelTips a#mainNavTravelTips{background-position:-566px 0px;color:#85d6db !important}#about #mainNavAbout, #mainNav a:hover#mainNavAbout{background-position:-672px 0px;color:#85d6db !important}#dateTime{float:left;display:inline;width:225px;margin:0 0 0 15px;color:#e9e9e9;text-align:right}#mainNav{height:44px !important;overflow:hidden !important}#mainNav li a{text-indent:0 !important;text-align:center;padding-top:10px;font-size:12px;color:#FFF;height:34px}#mainNav a:hover{color:#85d6db !important}#footerMain{color:#666;background:url(/images/footerBG.jpg) no-repeat top left;padding:5px 0px 0px 29px}#main .blackRoutes, #main .greenRoutes, #main .schoolRoutes, #main .otrainRoutes, #main .redRoutes, #main .blueRoutes{margin-top:0px !important;width:91%}#home #newsCol1{margin-right:15px;clear:left}#rightColumn .calloutWrapperGrey{border:1px solid #FFF}#main .twoColCallout{width:208px}#main .twoColumn{width:47%;padding-right:3%}#home .twoColumn{padding-right:20px}.threeColCallout{width:129px;overflow:hidden;text-align:left}.threeColCallout p{text-align:left !important}#main td .blackRoutes, #main td .greenRoutes, #main td .schoolRoutes, #main td .otrainRoutes, #main td .redRoutes, #main td .blueRoutes{margin-top:0px !important;width:85%}#longColumn .blackRoutes, #longColumn .greenRoutes, #longColumn .schoolRoutes, #longColumn .otrainRoutes, #longColumn .redRoutes, #longColumn .blueRoutes{margin-top:0px !important;width:95%}.insideSubLeft{width:230px}.threeColumn h2{font-size:1.4em;line-height:1.2em}.threeColumn .bulletList h3 a{font-size:11px !important}#discoverOttawaWrapper{width:465px}#longColumn{width:695px}#mainNav li a{overflow:hidden}.formColumn{width:44% !important}.formWrapper label{width:415px}.formWrapper textarea{width:405px}.formWrapper label input{margin-left:1px !important}.formWrapper .twoColumn label{width:200px}#longColumn .routesTable{width:685px}#routes #longColumn select{margin:5px 0}.routesTable{padding-right:10px !important;width:470px !important;overflow:hidden}.routesTable th, .routesTable td{text-align:right}.mainNavHover{background-position:right 89px !important}#discoverOttawaWrapper{width:465px !important}#discoverOttawa{width:445px !important}.leftNavBoxContent select{width:217px} /* #routes.wide .stopTimes { height:auto !important; } #routes .stopNames { height:65px; position:relative; } #routes.wide .direction { position:absolute; top:0px; left:auto; right:-18px; } */ /* end 1024.css */ /* CSS Document */ /*--- Callout styles - Added 03-02-09 ---*/ #rightColumn h4 { margin:8px 0 8px 0; line-height: 100%; } #rightColumn h5 { font-size:11px; font-weight:bold; } div.calloutButton a, a.calloutButton { background:url(/images/calloutButton.jpg) center right no-repeat #8ba4a7; padding:4px 30px 4px 20px; color:#FFF; text-transform:uppercase; font-size:1.1em; border:1px solid #FFF; margin:5px 10px; float:right; display:inline; } div.calloutButton a:hover, a:hover.calloutButton { background:url(/images/calloutButton2.jpg) center right no-repeat #6e878b; color:#FFF; } .calloutFooterLinks { padding:5px 0 0 14px; } .bulletCallout .calloutFooterLinks { padding:14px 0 0 14px; } .calloutWrapperGrey li { margin-left: 10px; list-style-type: disc; } .calloutFooterLinks li { padding-bottom:2px; margin-left: 0; list-style-type: none; } .calloutFooterLinks a { display:block; padding:0 0 0 20px; background:url(/images/findOutMoreArrow.gif) no-repeat left 3px; } .calloutFooterLinks a.PDF { background:url(/images/callouts/calloutIconPDF.gif) no-repeat center left; } #rightColumn .routesCallout {padding:8px;} #mapLightBox img {padding:5px;} #rightColumn .paraBanner { margin:5px 0 5px 0; } .calloutSelectForm { padding:18px 0 5px 0; } .calloutSelect { margin:0 0 5px 11px; display:block; width:90%; } .detoursCallout p a {text-decoration:underline;} #rightColumn hr { border-bottom:1px solid #666; } .calloutWrapperGrey p { text-align: left; } .calloutLight { float: right; width: 183px; border: solid 1px #DFDFDF; } /* REQUIRED */ #lightwindow_overlay { display: none; visibility: hidden; position: absolute; top: 0; right:0; width: 100%; margin-left:auto; margin-right:auto; height: 100px; z-index: 500; background:url(/images/red-70.png) repeat 0 0; } #lightwindow { display: none; visibility: hidden; position: absolute; z-index: 999; line-height: 0px; } #lightwindow_container { display: none; visibility: hidden; position: absolute; padding: 0 0 0 0; margin: 0 0 0 0; } /* REQUIRED */ * html #lightwindow_container { overflow: hidden; } /* IE6 needs this for positioning */ #lightwindow_contents { overflow: hidden; z-index: 0; position: relative; border: 10px solid #ffffff; background-color: #ffffff; } #lightwindow_loading { height: 100%; width: 100%; top: 0px; left: 0px; z-index: 9999; position: absolute; background-color: #f0f0f0; padding: 10px; } /* REQUIRED */ #lightwindow_loading_shim { display: none; left: 0px; position: absolute; top: 0px; width: 100%; height: 100%; } #lightwindow_loading span { font-size: 12px; line-height: 32px; color: #444444; float: left; padding: 0 10px 0 0; } #lightwindow_loading span a, #lightwindow_loading span a:link, #lightwindow_loading span a:visited { color: #7e9a9d; text-decoration: none; cursor: pointer; } #lightwindow_loading span a:hover, #lightwindow_loading span a:active { text-decoration: underline; } #lightwindow_loading img { float: left; margin: 0 10px 0 0; } #lightwindow_navigation { position: absolute; top: 0px; left: 0px; display: none; } /* REQUIRED */ #lightwindow_navigation_shim { display: none; left: 0px; position: absolute; top: 0px; width: 100%; height: 100%; } /* REQUIRED */ #lightwindow_navigation a, #lightwindow_navigation a:link, #lightwindow_navigation a:visited, #lightwindow_navigation a:hover, #lightwindow_navigation a:active { outline: none; } /* REQUIRED */ #lightwindow_previous, #lightwindow_next { width: 49%; height: 100%; background: transparent url(/images/blank.gif) no-repeat; /* Trick IE into showing hover */ display: block; } #lightwindow_previous { float: left; left: 0px; } #lightwindow_next { float: right; right: 0px; } #lightwindow_previous:hover, #lightwindow_previous:active { background: url(/images/prevlabel.gif) left 15% no-repeat; } #lightwindow_next:hover, #lightwindow_next:active { background: url(/images/nextlabel.gif) right 15% no-repeat; } #lightwindow_previous_title, #lightwindow_next_title { display: none; } #lightwindow_galleries { width: 100%; position: absolute; z-index: 50; display: none; overflow: hidden; margin: 0 0 0 10px; bottom: 0px; left: 0px; } #lightwindow_galleries_tab_container { width: 100%; height: 0px; overflow: hidden; } a#lightwindow_galleries_tab, a:link#lightwindow_galleries_tab, a:visited#lightwindow_galleries_tab { display: block; height: 20px; width: 77px; float: right; line-height: 22px; color: #ffffff; text-decoration: none; font-weight: bold; cursor: pointer; font-size: 11px; color: #325254; background: url(/images/black-70.png) repeat 0 0 transparent; } * html a#lightwindow_galleries_tab, * html a:link#lightwindow_galleries_tab, * html a:visited#lightwindow_galleries_tab { background: none; background-color: #000000; opacity: .70; filter: alpha(opacity=70); } a:hover#lightwindow_galleries_tab, a:active#lightwindow_galleries_tab { color: #ffffff; } #lightwindow_galleries_tab_span { display: block; height: 20px; width: 63px; padding: 0 7px 0 7px; } #lightwindow_galleries_tab .up { background: url(/images/arrow-up.gif) no-repeat 60px 5px transparent; } #lightwindow_galleries_tab .down { background: url(/images/arrow-down.gif) no-repeat 60px 6px transparent; } #lightwindow_galleries_list { background: url(/images/black-70.png) repeat 0 0 transparent; overflow: hidden; height: 0px; } * html #lightwindow_galleries_list { background: none; background-color: #000000; opacity: .70; filter: alpha(opacity=70); } .lightwindow_galleries_list { width: 200px; float: left; margin: 0 0 10px 0; padding: 10px; } .lightwindow_galleries_list h1 { color: #09F; text-decoration: none; font-weight: bold; cursor: pointer; padding: 10px 0 5px 0; font-size: 16px; } .lightwindow_galleries_list li { margin: 5px 0 5px 0; list-style-type: none; } .lightwindow_galleries_list a, .lightwindow_galleries_list a:link, .lightwindow_galleries_list a:visited { display: block; line-height: 22px; color: #ffffff; text-decoration: none; font-weight: bold; cursor: pointer;padding: 0 0 0 10px; font-size: 11px; } .lightwindow_galleries_list a:hover, .lightwindow_galleries_list a:active { background: #000000; color: #ffffff; border-left: 3px solid #ffffff; padding: 0 0 0 7px; } #lightwindow_data { position: absolute; } /* REQUIRED */ #lightwindow_data_slide { position: relative; } /* REQUIRED */ #lightwindow_data_slide_inner { background-color: #ffffff; padding: 0 10px 10px 10px; } #lightwindow_data_caption { padding: 10px 0 0 0; color: #666666; line-height: 25px; background-color: #ffffff; clear: both; } #lightwindow_data_details { background-color: #f0f0f0; padding: 0 10px 0 10px; height: 20px; } #lightwindow_data_author_container { width: 40%; text-align: right; color: #666666; font-style: italic; font-size: 10px; line-height: 20px; float: right; overflow: hidden; } #lightwindow_data_gallery_container { font-size: 10px; width: 40%; text-align: left; color: #666666; line-height: 20px; float: left; overflow: hidden; } #lightwindow_title_bar { height: 25px; overflow: hidden; } #lightwindow_title_bar_title { color: #ffffff; font-size: 14px; line-height: 25px; text-align: left; float: left; } a#lightwindow_title_bar_close_link, a:link#lightwindow_title_bar_close_link, a:visited#lightwindow_title_bar_close_link { float: right; text-align: right; cursor: pointer; color: #ffffff; line-height: 25px; padding: 0; margin: 0; font-size:12px; } a:hover#lightwindow_title_bar_close_link, a:active#lightwindow_title_bar_close_link { color: #7e9a9d; } #lightwindow h2 {color:#325254;} #lightwindow hr { border-bottom:1px solid #999999; } .textField, #lightwindow textarea {font-size:12px;} #lightwindow .submit { padding:7px 12px !important; } #lightwindow .submit:hover { color:#7e9a9d; border:1px solid #7e9a9d; } #lightwindow hr { margin:0 0 12px 0; } #home #updatesRight { clear: both; width: 170px; } #home #updatesRight .accordion_content{ float: left; width: 170px !important; margin: 3px 0;} #home #updatesRight .accordion_content ul{ float: left; width: 170px; } #home #updatesRight .accordion_content ul li{ float: left; width: 170px; margin-left: 0 !important; list-style-type: none; } #home #updatesRight .accordion_content a{ float: left; width: 166px; display: block; margin-left: 4px; } #home .leftNavBox .panel { display: block !important; } /* Routes page styles */ #routes .topRow {float:left;margin:0px !important; background-color:#C7DDDF;border:none;width:453px;font-size: 1.2em; line-height: 1.2em;} #routes .direction {float:left;padding: 0px !important; background-color: #78a4a8;background:#78A4A8 url(/images/routes-change-dir-icon.gif) no-repeat scroll center center !important;width:17px;height:65px;margin:0px;} #routes .direction a {background:transparent url(/images/routes-change-dir-topright.gif) no-repeat scroll 4px top;display:block;height:2.5em;text-indent:-9999px;width:17px;height:65px;} #routes .th {float: left;text-align:center;color:#336666;font-weight:bold;background-color:#C7DDDF;padding-bottom:0pt !important;padding-top:7px !important;height:58px; vertical-align:top;} #routes .topRowAfter {float:left;margin:0 !important; background-color: #c7dddf; vertical-align: bottom;width:453px;height:5px; } #routes .direction2 {float:left;width:17px;background-color:#78A4A8;height:5px;text-align:right !important;vertical-align:bottom !important;} #routes .direction2 img{display:inline;height:5px;width:4px;margin:0pt !important;} #routes .routesTableCorner img {float:left;} #routes .row {clear:both;width:453px;height:18px;} #routes .beige {background-color:#f1eee7; border:1px solid #f1eee7; } #routes .row div {float:left;text-align:center;padding:2px 0px;} #routes .topRowAfter .routesTableCorner img{ float: left;}