div.tram-tracker-pid { width: 200px; height:275px; background-image:url("/content/images/pid/pid-bg.png"); background-repeat:no-repeat; margin:10px; text-align:left;}
div.tram-tracker-pid div.stop-details { padding-top: 38px; padding-left:5px;padding-right:5px;}
div.tram-tracker-pid div.stop-details div.stop-name, div.tram-tracker-pid div.stop-details div.stop-location { color:#fff; font-size:160%; font-weight:bold;}
div.tram-tracker-pid div.stop-details div.stop-name { font-size:160%; white-space:nowrap; overflow: hidden;}
div.tram-tracker-pid div.stop-details div.stop-location { font-size:110%; white-space:nowrap; overflow:hidden; margin-left:1px; }
.ie8 div.tram-tracker-pid div.stop-details div.stop-location, .ie7 div.tram-tracker-pid div.stop-details div.stop-location  { margin-left:1px; }
div.tram-tracker-pid div.stop-details div.stop-ID, div.tram-tracker-pid div.stop-details div.stop-number { color:#000; font-size:90%; margin-top:7px; font-weight:bold;}
div.tram-tracker-pid div.stop-details div.stop-ID { float:left; } 
div.tram-tracker-pid div.stop-details div.stop-number { float:right;}
div.tram-tracker-pid div.arrival-labels { margin-top:5px;padding-left:5px;padding-right:5px; font-size:110%; font-weight:bold;}
div.tram-tracker-pid div.arrival-labels div.route-to {float:left;}
div.tram-tracker-pid div.arrival-labels div.minutes { float:right;}
div.tram-tracker-pid div.arrival-info { margin-left:5px;margin-right:5px; border:1px solid #000;-webkit-border-top-left-radius: 5px; -webkit-border-top-right-radius: 5px; -moz-border-radius-topleft: 5px; -moz-border-radius-topright: 5px; border-top-left-radius: 5px; border-top-right-radius: 5px; }
div.tram-tracker-pid div.arrival-info div.route-to { float:left; width:30px; height:30px; background-color:#009900; color:#fff; text-align:center; border:1px solid #50ab4f; border-top:none; font-weight:bold; padding-top:14px; }
div.tram-tracker-pid div.arrival-info div.tram-details { float:left; padding:1px;}
div.tram-tracker-pid div.arrival-info div.tram-details img.icon { padding:1px; background-color:#fff; display:block;}
div.tram-tracker-pid div.arrival-info div.tram-details div.destination-and-tram { padding-top:0; width:102px; font-size:110%; float:left; }
div.tram-tracker-pid div.arrival-info div.tram-details div.destination-and-tram div.destination{ height:16px; padding:13px 0 0 2px; }
div.tram-tracker-pid div.arrival-info div.tram-details div.destination-and-tram div.destination.multi{ height:29px; padding:0 0 0 2px; }
div.tram-tracker-pid div.arrival-info div.tram-details div.icons { width:10px; float:left; }
div.tram-tracker-pid div.arrival-info div.minutes { float:right; width:38px; height:30px; background-color:#333333; color:#fff; text-align:center; border:1px solid #6e6e6d; border-top:none; font-weight:bold; padding-top:14px; }

div.tram-tracker-pid div.arrival-info div.arrival-pages {height:135px; background-color:#fff;}
div.tram-tracker-pid div.arrival-info div.arrival-page {width:188px;}
div.tram-tracker-pid div.arrival-info div.status-bar { height:18px; font-size:120%; background-color:#333333; color:#fff;}
div.tram-tracker-pid div.arrival-info div.status-bar span {float:right; padding:2px;}
div.tram-tracker-pid div.arrival-info div.status-bar div.status { float:left; height:20px; width:20px; display:inline-block; }
div.tram-tracker-pid div.arrival-info div.status-bar div.on { background-image: url("/content/images/pid/on.png"); }
div.tram-tracker-pid div.arrival-info div.status-bar div.off { background-image: url("/content/images/pid/off.png"); }
div.tram-tracker-pid div.arrival-info div.status-bar div.err { background-image: url("/content/images/pid/err.png"); }
div.tram-tracker-pid div.arrival-info-footer {  margin-left:15px;background-image: url("/content/images/pid/pid-footer.png"); width:172px; height:7px; background-repeat:no-repeat; }

div.find-stop-dialog { height:450px; }
div.find-stop-dialog h1 { color: #009933; font-size: 360%; font-weight: bold; margin: 15px 0 10px; }
div.find-stop-dialog h3 { color: #0099CC; font-size: 150%; }
div.find-stop-dialog h3 a, div.find-stop-dialog h3 a:link { font-size: 100%; color:#0099CC; text-decoration:none; }
div.find-stop-dialog a:link { color: #000000; font-size:130% ;}
div.find-stop-dialog a:hover { color: #71BF45; }
div.find-stop-dialog div.route div.title, div.find-stop-dialog div.suburb div.title{ background-color: #C5D64C; padding:5px; margin:5px; text-transform:uppercase;font-effect:emboss; font-weight:bold; text-shadow: 0px 1px 0px #CCDEAA;}
div.find-stop-dialog div.route div.destination, div.find-stop-dialog div.suburb div.stop { background-color: #EAF0BF; padding:5px; margin:5px; margin-left:10px; font-effect:emboss; font-weight:bold; text-shadow: 0px 1px 0px #CCDEAA;} 
div.find-stop-dialog div.suburb div.stop a {float:left; color:#000;}
div.find-stop-dialog div.suburb div.stop a.stop-name {width:65%;}
div.find-stop-dialog div.suburb div.stop a {width:35%;}

#tram-tracker-message { color:#dd0000; }

div.tramTimeTablePanel { }
div.tramTimeTablePanel h1 { color: #009933; font-size: 360%; font-weight: bold; margin: 15px 0 10px; }
div.tramTimeTablePanel h3 { color: #0099CC; font-size: 150%; }
div.tramTimeTablePanel h3 a, div.find-stop-dialog h3 a:link { font-size: 100%; color:#0099CC; text-decoration:none; }
div.tramTimeTablePanel a { color: #000000; font-size:130% ;}
div.tramTimeTablePanel a:hover { color: #71BF45; }
div.tramTimeTablePanel div.route div.title, div.tramTimeTablePanel div.suburb div.title{ background-color: #C5D64C; padding:5px; margin:5px; text-transform:uppercase;font-effect:emboss; font-weight:bold; text-shadow: 0px 1px 0px #CCDEAA;}
div.tramTimeTablePanel div.route div.destination, div.tramTimeTablePanel div.suburb div.stop { background-color: #EAF0BF; padding:5px; margin:5px; margin-left:10px; font-effect:emboss; font-weight:bold; text-shadow: 0px 1px 0px #CCDEAA;} 

div.tramTimeTablePanel div.stopName { float: left; color: #000000; font-family: Arial, sans-serif; font-weight: normal; font-size: 11px; width: 380px; height: 20px; line-height: 20px; }
div.tramTimeTablePanel div.stopID { float: left; color: #000000; font-family: Arial, sans-serif; font-weight: normal; font-size: 11px; width: 240px; height: 20px; line-height: 20px; }
div.tramTimeTablePanel div.stopPDF { float: left; color: #119ac7; font-family: Arial, sans-serif; font-weight: bold; font-size: 11px; width: 120px; height: 20px; line-height: 20px; }
div.tramTimeTablePanel div.stopPDF a { font-family: Arial, sans-serif; font-weight: bold; color: #119ac7; font-size: 11px; text-decoration: none; background: url("/content/images/icon-pdf.gif") no-repeat left center; line-height: 20px; padding-left: 22px; display: block;}
div.tramTimeTablePanel div.stopPDF a:hover { color: #119ac7; text-decoration: underline; }

.routeDetails { padding: 0; margin: 0 0 0 5px; }
.routeDetails div.title{ background-color: #C5D64C; padding:5px; margin:0px; text-transform:uppercase;font-effect:emboss; font-weight:bold; text-shadow: 0px 1px 0px #CCDEAA;}
.routeDetails .content { padding: 10px; margin: 0; border: 1px solid #C5D64C; float: left; margin-bottom: 10px; }

.routeSearchRow { position: relative; width: 800px; margin-bottom: 20px; vertical-align: middle; line-height: 25px; height: 25px; }

.panelHeadingRow { width: 770px; float: left; margin-bottom: 10px; }
.panelButtonRow { width: 770px; float: left; height: 26px; line-height: 26px; vertical-align: middle; }

input.routeText { font-family: Arial, sans-serif; font-weight: normal; color: #000000; border: 1px solid #0098d1; font-size: 11px; padding: 4px; width: 138px; height: 12px; }
.blackHeading { font-family: Arial, sans-serif; font-weight: bold; color: #000000; font-size: 13px; }

.noLink { font-family: Arial, sans-serif; font-weight: normal; color:#666666; font-size: 12px; }
a.blueLink { font-family: Arial, sans-serif; font-weight: normal; color:#119ac7; font-size: 12px; text-decoration: none; line-height: 20px; }
a.blueLink:hover { font-family: Arial, sans-serif; font-weight: normal; color:#119ac7; font-size: 12px; text-decoration: underline; line-height: 20px; }
a.pdfLink { font-family: Arial, sans-serif; font-weight: normal; color: #119ac7; font-size: 12px; text-decoration: none; background: url("/content/images/icon-pdf.gif") no-repeat left center; line-height: 20px; padding-left: 22px; display: block;}
a.pdfLink:hover { color:#119ac7; text-decoration: underline; }

.RouteSearchPanel td { background: none;  padding: 0; }
.RouteSearchPanel select { font-size: 12px; margin: 0 10px 0 0; border: 1px solid #999999; padding: 2px; }

.sideHeading { font-family: Arial, sans-serif; font-weight: bold; color: #73bd48; font-size: 12px; }
.sideDivider { background-color: #73bd48; height: 6px; width: 270px; }
.sidePanelExternal td { padding: 2px 0px; }
.sideHeadingBar { font-family: Arial, sans-serif; font-weight: normal; color: #ffffff; font-size: 12px; background-color: #73bd48; border-bottom: 2px solid #ffffff; }
.sideContentCell { font-family: Arial, sans-serif; font-weight: normal; color: #707070; font-size: 12px; background-color: #e6e6e6; border-bottom: 2px solid #ffffff; }
.sideContentCell a { font-family: Arial, sans-serif; font-weight: normal; color: #707070; font-size: 12px; text-decoration: none; }
.sideContentCell a:hover { font-family: Arial, sans-serif; font-weight: normal; color: #707070; font-size: 12px; text-decoration: underline; }