/*
 * 
 * Timetables silverstripe modules styles
 * 
 * by Krzysztof Witalewski (witalewski@gmail.com) for goEuropa (http://goeuropa.eu)
 * 
 * (C) 2010 goEuropa
 * 
 */

/* RESET all styles inside #timetablesSidebar */

#timetablesSidebar * { 
	padding: 0;
	margin: 0;
	background: none;
	border: none;
	vertical-align: baseline;
	font-weight: normal;
	font-style: normal;
	text-align: left;
	font-size: 100%
	width: 650px;
	}
#timetablesSidebar ol, #timetablesSidebar ul {
	list-style: none;
	}
	
#timetablesSidebar b {
	font-weight: bold;
}
#timetablesSidebar #main {
	width:650px;	
}

#overlay {
background:url("../images/loading.gif") repeat-x scroll center top #303030;
height:100%;
left:0;
position:fixed;
top:0;
width:100%;
display: none;
filter:alpha(opacity=30);
opacity: 0.3;
-moz-opacity:0.3;
}

/* Special classes */

div.clearer {
	clear: both;
}

#timetablesSidebar a:active, #timetablesSidebar a:focus , #timetablesSidebar a:hover , #timetablesSidebar a:link,
#timetablesSidebar a:visited {
	text-decoration: none;
}

#timetablesSidebar a.route {
	background-color:#FFFFFF;
	border:1px solid #273138;
	width:40px;
	padding: 5px 1px;
	color:#273138;
	display:block;
	float:left;
	margin:1px;
	text-align:center;
}

#timetablesSidebar a.route:hover {
	text-decoration: none;
	background-color: #dfdfdf;
}

#timetablesSidebar a.route.night {
	background-color:#273138;
	color:#FFFFFF;
}

#timetablesSidebar a.route.night:hover {
	text-decoration: none;
	background-color: #dfdfdf;
	color: #273138;
}
/* General layout */

#timetablesSidebar {
	position:relative;
	float: left;
	margin-left: 100px;
}

#timetablesMapWrapper {
	float:right;
	width: 450px;
	display: none;
}


/* Breadcrumbs */

#timetablesBreadcrumbs {
	position: relative;
	left: 7px;
}

#timetablesBreadcrumbs ol li {
	display: block;
	float: left;
	width: 100px;
	height: 20px;
	padding-top: 6px;
	margin-left: -7px;
	text-align: center;
	background-image: url(../images/breadcrumb.png);
}

#timetablesBreadcrumbs a {
	color: #000000;
	text-decoration: none;
}

#timetablesBreadcrumbs a:hover {
	color: #000000;
	text-decoration: none;
}

#timetablesBreadcrumbs ol a li {
	background-image: url(../images/breadcrumb-link.png);
}

#timetablesBreadcrumbs ol a:hover li {
	background-image: url(../images/breadcrumb-hover.png);
}


/* Routes by name */

#timetablesSearchWrapper {
	margin:20px 0 0;
}

#timetablesSearchBox {
	border: 1px inset #273138;
	display: block;
	padding: 5px;
	width:100%;
}

#timetablesSidebar .routeListWrapper {
	float:left;
	margin-top:20px;
	padding-top: 50px;
	width:50%;
}

#busRoutes {
	background: url(../images/Bus.png) no-repeat top center;
}
#tramRoutes {
	background: url(../images/Tram.png) no-repeat top center;
}

#busRoutes li, #tramRoutes li {
	display:inline;
}

/* Route directions */

#directionsHeader {
	display: block;
	background:url("../images/Bus.png") no-repeat scroll left top transparent;
	font-size:200%;
	height:28px;
	margin-bottom:15px;
	margin-top:15px;
	margin-left: 260px;
	padding:9px 0 0 75px;
	text-align:left;
}

#directionsHeader.Tram {
	background:url("../images/Tram.png") no-repeat scroll 205px top transparent;
}


#timetablesSidebar ul.routeDirection {
	display:block;
	float:left;
	margin:5px;
	width:315px;
}

#timetablesSidebar ul.routeDirection li {
	display:inline;
}

#timetablesSidebar ul.routeDirection li.routeDirectionHeader {
	background-color:#273138;
	color:#FFFFFF;
	display:block;
	padding:10px;
	text-align:center;
}

#timetablesSidebar ul.routeDirection li a {
	background-color:#FFFFFF;
	border:1px solid #273138;
	color:#273138;
	display:block;
	float:left;
	margin:1px 0;
	padding:5px 1px;
	text-align:center;
	width:311px;
}

#timetablesSidebar ul.routeDirection li.zoneA a {
	background:  #FFFFFF url("../images/zoneA.png") no-repeat scroll right top;
}

#timetablesSidebar ul.routeDirection li.zoneB a {
	background:  #FFFFFF url("../images/zoneB.png") no-repeat scroll right top;
}

#timetablesSidebar ul.routeDirection li.zoneC a {
	background:  #FFFFFF url("../images/zoneC.png") no-repeat scroll right top;
}

#timetablesSidebar ul.routeDirection li a:hover {
	text-decoration: none;
	background-color: #dfdfdf;
}

/* Routes by stop */
#routesByStopHeader {
	display:block;
	font-size:200%;
	height:28px;
	width: 100%;
	margin-bottom:15px;
	margin-top:50px;
	text-align:center;
	clear: both;
	padding-top:30px;
}


#routesAndDirectionsWrapper ul li a.route {
	background-color:#FFFFFF;
	border:1px solid #273138;
	color:#273138;
	display:block;
	float:left;
	margin:1px 0;
	padding:5px 1px;
	text-align:center;
	width:100%;
}

#routesAndDirectionsWrapper ul li a.route span.name {
	display:block;
	font-size:140%;
	font-weight:bold;
	margin-bottom:-10px;
	text-align:center;
}
/* The actual timetable */

#timetableHeader {
background:url("../images/BusSmaller.png") no-repeat scroll 4px 4px white;
border:4px solid #EFEFEF;
display:block;
float:left;
height:138px;
padding:1px 1px 0;
position:absolute;
top:65px;
left:0;
width:176px;
}

#timetableHeader.Tram {
	background-image: url("../images/TramSmaller.png");
}

#timetableHeader h5.route {
	font-size:200%;
	margin-top:6px;
	margin-left:60px;
	margin-bottom:10px;
}

#operatorName {
	display:none;
	float:left;
	margin-left:7px;
	margin-top:15px;	
	/*font-size:80%;*/
}

#timetableHeader h5.direction, #timetableHeader h5.currentStop {
font-size:110%;
margin-bottom:10px;
}

#transfers {
left:0;
position:absolute;
top:40px;
width:650px;
}

#transfers li {
	display:inline;
}

#transfers ul li a {
	background:url("../images/transfer-link.png") repeat scroll 0 0 transparent;
	border:none;
	color:#000000;
	display:block;
	float:right;
	height:19px;
	margin:0;
	padding-top:6px;
	text-align:center;
	width:40px;
}

#transfers ul li a.current {
	background:url("../images/transfer-current.png") repeat scroll 0 0 transparent;
}

#transfers ul li a:hover {
	background:url("../images/transfer-hover.png") repeat scroll 0 0 transparent;
}

#transfers ul li a.current:hover {
	background:url("../images/transfer-current.png") repeat scroll 0 0 transparent;
}



#timetable {
	border:3px solid #ECECEC;
	margin-bottom:39px;
	margin-left:180px;
	margin-top:0;
	padding:0;
	position:relative;
	top:39px;
}

#timetable table {
	width:464px;
	border-collapse:collapse;
}

#timetable th, #timetable td {
padding:1px 4px;
}

#timetable th {
background:none repeat scroll 0 0 #ECECEC;
border:1px solid #ECECEC;
font-weight:bold;
margin:0;
text-align:right;
}

#timetable td {
border:1px solid #ECECEC;
/*width:100px;*/
}

#stops {
border:4px solid #EFEFEF;
left:0;
position:absolute;
top:212px;
width:177px;
overflow:hidden;
}


#stops li {
border:1px solid #EFEFEF;
display:block;
padding:1px;
}

#stops a:active, #stops a:focus, #stops a:hover, #stops a:link, #stops a:visited {
	display:block;
	font-size:8pt;
	height:13px;
	overflow:hidden;
	text-decoration:none;
	width:160px;
}

#stops li.zoneA {
	background:  #FFFFFF url("../images/zoneASmall.png") no-repeat scroll right top;
}

#stops li.zoneB {
	background:  #FFFFFF url("../images/zoneBSmall.png") no-repeat scroll right top;
}

#stops li.zoneC {
	background:  #FFFFFF url("../images/zoneCSmall.png") no-repeat scroll right top;
}


#descriptions {
border:5px solid #EFEFEF;
margin-left:180px;
margin-top:-3px;
padding:5px;
width:450px;
}
#descriptions p {
	font-size:11px;
}

#printButton {
	position:absolute;
	left:627px;
	right: 0px;
	top: 0px;
	background: url("../images/print.png");
	width: 23px;
	height: 23px;
}

#printButton a {
	width:23px;
	height:23px;
	display:block;
}

.scrollStops {
	height:12px;
	width:176px;
	position:absolute;	
}

#scrollStopsUp {
	left:0;
	top:196px;
	background-color: #EFEFEF;
	border:4px solid #EFEFEF;
}

#scrollStopsDown {
	left:0;
	top:539px;
	background-color: #EFEFEF;
	border:4px solid #EFEFEF;
}