@charset "utf-8";

/* GLOBAL SETTINGS */
HTML, BODY { width: 100%; height: 100%; }
BODY { background-color: #BDC5C7; margin: 0; padding: 0; }
BODY, INPUT, TEXTAREA, SELECT { font-family: "Comic Sans MS", "Comic Sans", cursive, Tahoma, Geneva, sans-serif; font-size: 11px; }
A { color: #FFFFFF; text-decoration: none; }

/* MAIN LAYOUTS */
#MainContainer { border-left: 1px #868485 solid; border-right: 1px #868485 solid; margin: auto; width: 800px; background-color: #FFFFFF; }
#LeftColumn { float: left; width: 220px; color: #FFFFFF; font-size: 13px; }
#RightColumn { float: left; margin-left: 15px; width: 542px;}

/* HEADER */
.LeftHeader { float: left; margin-top: 15px; margin-left: 15px; }
.RightHeader { float: right; }
#LanguageContainer { float: right; background: no-repeat url(../images/language_background.jpg); text-align: center; width: 133px; height: 30px; margin-right: 15px; color: #797F7F; padding-top: 5px; }
#LanguageContainer A { color: #797F7F; text-decoration: none; margin-left: 5px; margin-right: 5px; }
#WeatherContainer { clear: right; float: right; margin-right: 15px; margin-top: 15px; }
#HeaderSeperator { clear: both; height: 30px; background: no-repeat center url(../images/header_seperator.jpg); content: "New Assistant Manager position available in employment"; display: block;
 text-align: center; }

/* NAVIGATION */
#Navigation { background: url(../images/navigation_background.jpg) no-repeat; margin-left: 10px; padding-top: 15px; font-size: 14px; font-weight: bold; color: #FFFFFF; height: 315px; }
#Navigation HR { display: none; height: 2px; border: 0; margin: 0; padding: 0; border-bottom: 1px #5dade0 solid; width: 164px; margin: auto; }
.MenuItem { margin-left: 7px; padding: 8px 0px 8px 13px; width: 173px;  }
.MenuItemHover { background-color: #73d7ff; color: #183e65; cursor: pointer; }
.CurrentDate { color: #808080; text-align: center; margin-top: 15px; }

/* PORTAL BUTTONS */
#Portal .PortalButton DIV { text-align: center; padding-top: 8px; }
#ParentPortal .PortalButton DIV { margin-left: 22px; }

#ParentPortal { background: url(../images/parent_portal_background.jpg) no-repeat; width: 192px; height: 145px; margin-left: 15px;  margin-top: 15px; }
#ParentPortal H3 { font-size: 15px; margin: 0px 0px 0px 40px; padding-top: 12px; }
#ParentPortal .PortalButton { width: 162px; height: 32px; background: url(../images/parent_portal_button.png) no-repeat; margin: 30px 0px 0px 15px; padding-top: 6px; }
#ParentPortal IMG { border: 0px; }

#Portal { background: url(../images/portal_background.jpg) no-repeat; width: 192px; height: 163px; margin-left: 15px; margin-top: 15px; }
#Portal H3 { font-size: 15px; margin: 0px 0px 25px 40px; padding-top: 12px; }
#Portal .PortalButton { width: 167px; height: 36px; background: url(../images/portal_button.png) no-repeat; margin: 15px 0px 0px 15px; }

/* KEY SERVICE INDICATORS */
#KeyServiceIndicators { background: url(../images/key_service_indicators.png) no-repeat; width: 192px; height: 51px; margin: 15px 0px 15px 15px;  }
#EmploymentOpportunities { background: url(../images/employment_opportunities.png) no-repeat; width: 192px; height: 51px; margin: 15px 0px 15px 15px;  }
#FirstTimeRider { background: url(../images/first_time_rider.png) no-repeat; width: 192px; height: 51px; margin: 15px 0px 15px 15px;  }
#BusEvacuation { background: url(../images/video_button.png) no-repeat; width: 192px; height: 51px; margin: 15px 0px 15px 15px;  }

#EmploymentOpportunities DIV, #KeyServiceIndicators DIV, #FirstTimeRider DIV { margin-left: 20px; padding-top: 5px; width: 125px; font-weight: bold; }
#BusEvacuation DIV  { margin-left: 20px; padding-top: 5px; width: 125px; font-weight: bold; font-size: 13px; }

#RequestStopLocation { background: url(../images/request_stop_location.jpg) no-repeat; width: 192px; height: 104px; margin-left: 15px; margin-top: 15px; }
#RequestStopLocation DIV { width: 82px; padding-top: 8px; text-align: center; height: 94px;}

/* MAIN SPLASH AND QUOTE */
#MainSplash { background: url(../images/mainSplash.jpg) no-repeat; width: 542px; height: 412px; }
#MainSplash DIV { padding-top: 330px; text-align: center; font-size: 26px; font-weight: bold; color: #FFFFFF; }
#MainSplash .SingleLineSplash { padding-top: 350px; }
#MainQuote SPAN { font-family: Arial, Helvetica, sans-serif; font-size: 40px; font-weight: bold; color: #DDDDDD; }
#MainQuote P { font-size: 14px; text-align: center; color: #777777; line-height: 25px; }

/* CONTENT AREA */
#ContentArea { font-family: Tahoma, Georgia, Arial, "Times New Roman", Times, serif; line-height: 20px; font-size: 12px; }
#ContentArea A:LINK, #ContentArea A:VISITED, #ContentArea A:HOVER, #ContentArea A:ACTIVE  { color: black; text-decoration: underline; }


/* FOOTER AREA */
#Footer { background: url(../images/footer.jpg) no-repeat top center; text-align: center; height: 53px; margin-top: 15px; }
#Footer SPAN { padding: 0px 5px 0px 5px; color: #FFFFFF; }

/* ROUTE DELAYS */
.StatusWarning { text-align: center; font-weight: bold; font-size: 14px; }
.StatusSeperator { width: 90%; margin: auto; border: 0px; border-top: 1px black dashed; margin-bottom: 15px; margin-top: 20px; }
.MessageTitle { float: left; font-weight: bold; color: green; }
.MessageDate { font-size: 10px; text-align: right; font-style: italic; margin-right: 5px; }
.RouteTable { width: 100%; border-spacing: 0px;  border: 1px black solid; background-color: #EEEEEE; padding: 5px; }
.RouteDelayTable { width: 100%; border-spacing: 0px; border-collapse: collapse; border: 1px black solid; line-height: 15px;  }
.RouteDelayTable TH { background-color: #EEEEEE; text-align: center; font-weight: bold; font-size: 11px; border: 1px black solid; padding: 5px; }
.RouteDelayTable TD { font-size: 11px; border: 1px black solid; padding: 5px; }