/* -------------------------------------------------------------- 


   RapidKL Joomla Templates
   * Author: Fadzril
   * Version:   0.1 (14/04/09)


-------------------------------------------------------------- */


@import "lib/reset.css";

@import "lib/typography.css";

@import "lib/forms.css";

@import "lib/plugins/tabs.css";



/* Body
-------------------------------------------------------------- */

body { background: #ececec url("../images/body-bg.jpg") top center no-repeat; margin: 1.5em auto; }


/* Page
-------------------------------------------------------------- */

#page { margin: 0 auto; width: 930px; background-color: #ffffff; padding: 0 10px 10px 10px;}

#wrapper { margin: 0; padding: 0; }


/* Header
-------------------------------------------------------------- */

#header {  width: inherit; margin-top: 20px; position:relative; z-index:900; /*background: transparent url("../images/header-bg.jpg") top right no-repeat;*/}

#header #linkLogo { height: 95px; width: 255px; text-indent: -9999px; background: transparent url("../images/logo.jpg") top left no-repeat; display:block;}
#header #linkLogo2 { height: 119px; width: 624px;display:block;float:right;}
#header #printHeader {display:none;}

/*#header .info { float: right; width: 520px;  margin: 25px 50px 0 0; clear: right;}*/
#header .info { float: right; width: 545px;  margin: 25px 25px 0 0; clear: right; }

#header .left {  width: 265px; margin-right: 40px; float: left;  padding: 0;}

#header .middle {  width: 80px; margin-right: 10px; float: left;  padding: 0;}

/*#header .right { width: 120px; float: right; padding: 0; }*/
#header .right { width: 145px; float: right; padding: 0; text-align:right; }

#header .right a#logoutLink { font-weight:bold; color:#F00; }

#header #topHeader { width:100%; height:120px; background: transparent url("../images/top-header-bg.jpg") top right no-repeat; }

#topHeader .langSelect { padding-left:8px; padding-top:8px; }

#topHeader .langSelect p { color:#333; }

#topHeader .langSelect p a { color:#d3aa65; }

#topHeader .logOutWrapper {padding-left:8px; height:30px;}

#topHeader .searchWrapper {padding-left:8px;}

#topHeader a#logoutLink { font-weight:bold; color:#F00; }

/* Social Media
-------------------------------------------------------------- *

#socialnet img { border: none; margin-left: 5px; }

#socialnet p { width: 100px; }

#socialnet p a:hover { text-decoration: none;}



/* Body
-------------------------------------------------------------- */

#body { margin-top: 3px; background-color: #fff; }

#introduction { float: left; width: 660px; padding: 0; _width:650px; /*margin-left: 5px;*/ }

#introduction h3 { color:#005EA8; font-size:14px; }

#resources { float: left; width: 260px; margin-right: 10px; background-color: #ededed; min-height: 640px !important; overflow: hidden;  border-bottom: 3px solid #063868; }/*BEBDB8,797164,B08F1E,535250,888687*/

#resources ul, #resources ol { color: #888; }

#resources ul a { color: #555; }

#resources ul li { list-style-image: url("../images/bullet.jpg"); }

#resources h3 a {font-size:16px;}

#resources a {font-size:12px;}
#resources td {font-size:12px;}

#box { padding: 10px; border: 1px solid #c0c0c0; margin-bottom: 1.0em; background: #ebebeb url("../images/box-bg.jpg") top left repeat-x; -moz-border-radius: 5px; -webkit-border-radius: 5px; }

#box img { float: left; vertical-align: middle; margin-right: 10px;/*border: 2px solid #e7e7e7; margin-right: 1.45em; */}

#login {  width: 155px; display:none; z-index: 1000; float: right; }

/*#login dt a{ float: left; display: inline; text-decoration: underline; font-weight: normal; font-size: 75%; background: none !important; border: none; color: #000000;}*/
#login dt a{ float: left; display: inline; text-decoration: underline; font-weight: normal; font-size: 10px; background: none !important; border: none; color: #000000;}

#boximg { border: 1px solid #c0c0c0; padding: 5px;}

td {vertical-align:top;}

td img {vertical-align:top;}

.contentpaneopen {width:100%}


/* Network Module
-------------------------------------------------------------- */

#network { width: 100%; margin:0 auto; padding: 0; clear: both;}

#network img { padding-left: 10px; display: block; }

.network-table { width: 99%; margin: 1.2em auto ; border: none; clear: both; }

.network-left { width: 49%; float: left; margin-right: 5px; overflow: visible; }

.network-right { width: 49%; float: right; margin-left: 5px;  }

#network td{ text-align: left; padding-left: 5px; line-height: 1.2em; border-bottom: 1px dotted #ebebeb;}

#route { /*width: 100%;*/ margin:0 auto; padding: 0 10px 10px 10px; position: relative; _padding: 0 5px 10px 10px;}

#route .left-container { float: left; width: 40%; margin: 0 auto; padding:0; }

#route .right-container { float: right; width: 60%; margin: 0 auto; padding: 0; }

#route .right-container ul { margin: 0 auto; display: inline;}

#route .right-container ul:after  {  content: " "; }

#route .right-container ul li { color: #000000; display: inline-block;}

/*#route .right-container ul li ul li:before { display: inline; padding-left: 5px;  content: "\00BB \0020"; color: #ff0000; }*/

/*#route .right-container ul li ul li:before { content: "test" }*/

#route .right-container ul li ul li {display:inline;}

#route .box-title { width: 97%; background-color: #c0c0c0; padding: 10px; clear:both; margin-top: 10px; line-height: 1em;}

#route table { width: 100%; border: 0; text-transform: uppercase; margin: 1.2em auto; padding: 0; }

#route thead{  border-bottom: 2px solid #c0c0c0; line-height: 1.6em; background-color: #ebebeb; font-weight: 700; }

#route tr,td {padding-right: 5px; padding-left: 5px; }

/*#route tr td a{ color: #ff0000; text-decoration: underline; font-weight: 700; }*/

#route tr td a{ color: #fff; text-decoration: underline; font-weight: 700; }

#route .redraquo {color:#F00; font-size:12px;}



/* Route Template
-------------------------------------------------------------- */

#busroute { float: left; width: 450px; padding: 2px; border: none;}

#busroute p { font-size: 110%; font-weight: bold;clear: both; text-align: center; text-transform: uppercase; }

.mini-map { float: right; width: 120px; }

/*.exchange-title { font-size: 110%; color: #ef4035;}*/

.exchange-title { font-size: 100%; color: #000000;}

.routetable thead { font-size: 110%; font-weight: bold; display: block; }

.routetable-left { width: 50%; float: left; margin-right: -5px;}

.routetable-left td { text-align: right; }

.routetable-left img { padding-right: 7px; vertical-align: middle; }

.routetable-right { width: 50%; float: right; margin-left: -5px;}

.routetable-right td { text-align: left; }

.routetable-right img { padding-left: 7px; vertical-align: middle; display: inline;}



/* Tooltip Bus Route
-------------------------------------------------------------- */

span.hasTip img { border: none;margin:0 auto;display: inline;}

.tool-tip { background:#FFFFCC none repeat scroll 0 0; border:1px solid #D4D5AA; float:left; max-width:200px; padding:5px; z-index: 100; margin-left: -10px; }

.tool-title { background:transparent url(../../system/images/selector-arrow.png) no-repeat scroll 0 0; font-size:12px; font-weight:bold; margin:-15px 0 0; padding:15px 0 5px; }

.tool-text { font-size:12px; margin:0; }



/* Tickets Module

-------------------------------------------------------------- */

.tickets { width: 100%; margin:0; padding-left: 5px; clear: both; border: 1px solid #c0c0c0; min-height: 180px; overflow: hidden; }

.tickets-left { width: 49%; float: left; margin-right: 5px; _width: 48%;}

.tickets-right { width: 49%; float: right; margin-left: 5px; _width: 48%;}

.tickets-box { min-height: 220px; overflow: hidden; padding: 0 5px 10px 0; border: 1px solid #c0c0c0; margin: 0; }

.tickets-box-small { min-height: 130px; overflow: hidden; padding: 0 0 5px 0; border: 1px solid #c0c0c0; margin-bottom: 1.2em; text-align: center;}

.tickets-box img { float: left; margin-right: 5px; }

.tickets-box h5 { width: 99.8%; }

.tickets-box p { line-height: 1.3em; }

.tickets-box .heads { line-height: 22px; font-weight:bold; }

.tickets-box .small-icon {width:55px;float:left;text-align:center;padding-top:10px;}
.tickets-box .small-icon img {float:none;}
.tickets-box .desc {width:224px;float:left;padding-top:10px;padding-bottom:10px;}
.tickets-box .opt {padding-left:10px;}
.tickets-box .opt img {float:none;}
.tickets-box .opt .small-icon2 {width:25px;float:left;}
.tickets-box .opt .desc2 {width:120px;float:left;line-height:25px;}

.title { background-color: #efefef; line-height: 1.8em; font-weight: bold; color: #000;  margin: 0 2px 5px 0; }

.span-img { text-align: center; background-position: center center; margin-left: 25px; }

.tickets-table { width: 99%; margin-left: 5px; clear: both; border: 1px solid #c0c0c0; }

.tickets-table tbody, tr,td { margin-left: 5px; line-height: 1.6em; }


/* Result Quick Journey Module
-------------------------------------------------------------- */

#result { width: 100%; margin:0 auto; padding: 0; clear: both;}

#result thead { line-height: 1.5em; border-top: 1px solid #c0c0c0; border-bottom: 3px solid #c0c0c0; color: #ef4035;  }

#result tfoot{ border-top: 1px solid #c0c0c0; margin-top: 1em; line-height: 2em;}

#result span.price { color: #ff0000; font-weight: bold; font-size: 120%; }

#result .left { width: 49%; float: left; margin-right: 5px; overflow: visible; }

#result .network-right { width: 49%; float: right; margin-left: 5px;  }

#result td img { vertical-align: middle; padding-right: 5px;}


/* Custom
-------------------------------------------------------------- */

.service-status { display: table; width: 100%; padding-right: 10px; background-color: #fcd9d7; color: #4b4b4b; }

.cell { padding: 5px 3px 5px 5px; border-right: 1px dotted #ffffff; }

.alt { background-color:#ccdfee; }

.last { display: none; }

.inputradio {border: none;}

#station1 {width: 90%;}

#station2 {width: 90%;}

.inputbox-search { width: 150px; padding: 5px 3px 5px 2px; background:#fff url("../images/search.png") center right no-repeat; border: 1px solid #ebebeb; }

.submit-button { color: white; font-weight: bold; background-color: #ef4035; margin-top: 5px; padding: 3px 5px 3px 5px; cursor: pointer; -moz-border-radius: 5px; -webkit-border-radius: 5px;}

.advert { margin: 0; width: 260px; background: #0b6aba url("../images/sms-advert.png") right bottom no-repeat;  color: #ffffff;}

/*.advert blockquote { font-size: 120%; padding: 5px 10px 5px 5px; }*/
.advert blockquote { font-size: 13px; padding: 5px 10px 5px 5px; }

.advert blockquote small { line-height: 0.7em; }

.left { float: left; width: 280px; margin-right: 5px; }

.left ul li { list-style-image: url("../images/bullet-black.png"); }

.right { float: right; width: 280px; margin-left: 5px; }

.span-right { float: right; margin-right: 10px; }

.right ul li { list-style-image: url("../images/bullet-black.png"); }

.contentheading { font-weight: bold; color: #005ea8; width: 100%; font-size:14px; }

.componentheading { font-weight:bold; font-size:14px; color: #005ea8; }

/*.star { font-size: 120%; color: #ffff00; vertical-align: middle; }*/
.star { font-size: 13px; color: #ffff00; vertical-align: middle; }

.button-quote a{ text-transform: uppercase; color: #ffff00; font-weight: bold; padding-top: 10px; display: block; }

.button-quote a:after { content: "\0020 \00BB \0020 "; color: #ffff00; }

/*.small {font-size: 70%;}*/
.small {font-size: 10px;}

.translate {text-align: right;}

.red { color: #ff0000; font-style: italic; }

.red:before { content: '*';}

.low { border-left: 1px solid #fff; background-color:#85b0cc; }

.medium { border-left: 1px solid #fff; background-color: #b6d7e3; }

.high { border-left: 1px solid #fff; background-color: #fca09a; }

.clear { clear:both; }

.strong { font-weight:bold; }

.italic { font-style:italic;}

.padl_2em { padding-left:2em; }


/* Footer
-------------------------------------------------------------- */

#footer { border-top: 3px solid #ef4035; margin-top: 5px; font-size:12px; }

#footer a {font-size:12px;}

/*#footer .tabs { float: right; width: 430px; margin-right: 0; }*/
#footer .tabs { float: right; width: 500px; margin-right: 0; }

#footer .tabs a { padding: 10px 30px 10px 0; color: #666; text-decoration: none; }

#footer p.quiet { color: #000; }

#footer .menu {float:right;}


/* Search Form */

#searchForm label { display:inline; }

#searchForm select#limit { width:60px; }

#textOptions label { padding-right:10px; }

#searchForm table.contentpaneopen { margin-bottom:0.2em; }

#searchForm #searchOptions { line-height:20px; }


/* Additional */
.sf-menu { font-size:13px; }

.registerFormFieldName { width:180px;float:left;line-height:30px; }
.registerFormFieldName2 { width:300px;float:left;line-height:30px; }
.registerFormField { width:300px; float:left; line-height:30px; }
.registerFormField2 { width:500px; float:left; line-height:30px; }

.w_40p {width:40%;}
.w_15p {width:15%;}
.w_28p {width:28%;}
.w_50p {width:50%;}
.w_48p {width:48%;}
.valign_top {vertical-align:top;}

/*.interchange_code {width:25%;display:block;line-height:18px;float:left;}*/
.interchange_code {width:35px;display:block;line-height:18px;float:left;}

.chronoform {visibility:hidden;}

#banner_container
{
	width: 653px;
	height: 375px;
	margin-left:5px;
	position: relative;
}
#banner_container img
{
	width: 653px;
	height: 375px;
	position: absolute;
	left: 0;
	top: 0;
	z-index: 0;
}

img.show
{
	display: none;
	z-index: 1 !important;	
}

#busroutePopUp {
	display:none;
	position:absolute;
	width:200px;
	background:#FFFFCC;
	border:1px solid #555;
	padding:8px;
}

.jwts_tabbertab h2 span {display:none;}

.routeNum span {display:none;}

#routeDetailsPrint {width:18px;height:18px; display:block; text-align:right; float:right;}

.interchange_code_print {display:none;}

.dummyIcons {width:18px;height:18px; display:block; text-align:right; float:right; margin: 0 5px;}
.dummyIconsRight {width:18px;height:18px; display:block; text-align:right; float:right; margin-left: 5px;}