/* Default elements
-------------------------------------------------------------- */
html, body {
	font-family: 'Verdana';
	font-size: 10px;
}

body.body-small {
	font-size: 10px;
}

body.body-medium {
	font-size: 11px;
}

body.body-large {
	font-size: 12px;	
}


/* Main layout
-------------------------------------------------------------- */

.only-on-print {
	display: none !important;
	visibility: hidden !important;
}

#secondmenu {
	float: right;
	
	overflow: hidden;
	height: 20px;
}

#secondmenu ul li {
	display: inline;
	padding-left: 8px;
	color: #00929d;
}

#secondmenu ul li.flag {}
	#secondmenu ul li.flag a {}
		#secondmenu ul li.flag a img {
			vertical-align: bottom;
		}

#secondmenu ul li.german-flag  { padding-left: 0px; }
#secondmenu ul li.english-flag { padding-left: 4px; }

#mainmenu {
	float: left;
	width: 800px;
}

#mainmenu ul li {
	display: inline;
	padding-right: 8px;
	
	position: relative;
	top: 0px;
	left: 0px;
}

#mainmenu ul li ul.submenu {
	display: none;
	
	position: absolute;
	top: 15px;
	top: 12px;
	left: 0px;
	padding-top: 10px;
	width: 300px;
}

#mainmenu ul li ul.submenu li {
	width: 300px;
	height: 30px;
	
	padding: 0px;
}

#mainmenu ul li ul.submenu li a {
	/*padding:0 0 0 30px;*/
	padding:0 0 0 15px;
	
	display:block;
	/*width:300px;*/
	width: 200px;


	height:30px;
	
	/*color: #000000;*/
	color: #ababab;
	
	line-height:30px;
	text-decoration:none;
	
	background: transparent url(../images/menu_bg.png) repeat scroll left top;
}

#mainmenu ul li ul.submenu li a:hover {
	/*background-image: none;*/
	/*background-color: #5CB4B7;*/

	color: #000000;
}

#secondmenu  ul li a {
	color: #00929d;
}

#secondmenu ul li a:hover {
	color: #5cb4b7;	
}

#fontsize {
	float: right;
	width: 70px;
	text-align: right;
	
	z-index:10000 !important;
}
	#fontsize img {	z-index:10000 !important; }

body.body-small #fontsize {
	background: url('../images/fontsize-small.png') no-repeat;
	background-color:#fff;
}

body.body-medium #fontsize {
	background: url('../images/fontsize-medium.png') no-repeat;
	background-color:#fff;
}

body.body-large #fontsize {
	background: url('../images/fontsize-large.png') no-repeat;
	background-color:#fff;
}

#submenu {
	margin-top: 22px;	
}

#submenu ul {
	background: url('../images/dot_horizontal_grey.png') repeat-x bottom left;
}

#submenu ul li {
	background: url('../images/dot_horizontal_grey.png') repeat-x top left;
	padding: 5px 0px;
}

#submenu > ul > li.active {
	background: url('../images/dot_horizontal_active.png') repeat-x top left;
	padding: 5px 0px;
}

#submenu ul li a {
	display: block;
	padding-left: 16px;
	background: url('../images/arrow.gif') no-repeat 0px 3px;
}

#submenu ul li.active > a {
	padding-left: 16px;
	background: url('../images/arrow_active.gif') no-repeat 0px 2px;	
}

#submenu ul li ul {
	background: none;
}

#submenu ul li ul li {
	padding-left: 16px;
	background: none;
}

#breadcrumbs {
	float: left;
	margin-top: 2px;
	font-size: 9px;
}	

#breadcrumbs,
#breadcrumbs a {
	color: #848484;
}

#breadcrumbs a {
	text-decoration: underline;	
}

#breadcrumbs a:hover {
	color: #000;	
}

#regio-info {
	float: right;
	font-size: 9px;
}

#regio-info span a {
	display: block;
	/*width: 20px;
	float: left;*/
	text-align: right;
	clear:left;
}



#regio-info .regio-item a {
	padding: 2px 0px 6px 0px;;	
}

#regio-info .bus a {
	background: url('../images/regiobus.gif') no-repeat top right;
	color:#5cb4b7;
	text-decoration:none;
}

#regio-info .trein a {
	background: url('../images/regiotrein.gif') no-repeat top right;
	color:#f0545a;
	text-decoration:none;	
}

.dep-bus {
	background: url('../images/regiobus.gif') no-repeat top right;
	height: 19px;
}
.dep-trein {
	background: url('../images/regiotrein.gif') no-repeat top right;
	height: 19px;
}
.dep-beide{
	background: url('../images/regiobeide.gif') no-repeat top right;
	padding-right: 44px;
	height: 19px;
}

#regio-info .regio-item a.dep-beide {
	padding: 2px 44px 6px 0px;;	
}

#regio-info .provincie a {
	color:#5cb4b7;
	text-decoration:none;	
}

#right .block {
	/* margin-bottom: 20px;	*/
	
}

#location {
	float:left;
	background: url('../images/location.png') no-repeat;
	width: 275px;
	height: 221px;
	font-size: 9px;
	padding-bottom:30px;
}
#location h4 {
	padding-top:20px;
	padding-left:8px;
}
#location .actualiteiten {
	float: left;
	width: 140px;
	margin-top: 8px;
	position: relative;
	overflow: hidden;
    height: 150px;	
}

#location .actualiteiten ul {
	width: 127px;
	height: 150px;	
	padding-left:8px;
}


#location .actualiteiten li {
	position: relative;
	margin: 0px 0px 6px;
	padding-left: 16px;
	background: url('../images/arrow.gif') no-repeat 0px 2px;
}

#location .actualiteiten a {
	color: #5e5d5d;
	text-decoration: underline;	
}

#location .actualiteiten a:hover {
	color: #000;	
}

#location .regio {
	padding: 4px 12px 0px 0px;
	float: right;	
}

#location .regio img {
	cursor: pointer;	
}

/* this is the block that lets you select busstops and find out the timings on the selected stop */
#select-stop {clear: left; margin-bottom: 30px; }
#select-stop h4 { background: url('../images/select_stop_top.png') left top no-repeat; text-indent: -3000px; height: 22px; margin-bottom: 0px!important;}
#select-stop form { background: url('../images/select_stop_tile.png') left top repeat-y; padding-top: 10px}
#select-stop form ul { background: url('../images/select_stop_bottom.png') left bottom no-repeat; padding: 0 10px}
#select-stop form ul li {height: 30px; clear: left;}
#select-stop form ul li label {float: left; clear: left}
#select-stop form ul li select {width: 160px; float: right}
#select-stop form button {float: right; border: none; text-decoration: underline}


/* this is the block in the obstructions controller */
#select-stop-large {clear: left;  }
#select-stop-large form {  padding-top: 10px}
#select-stop-large form ul {padding: 0 10px}
#select-stop-large form ul li {height: 30px; clear: left; list-style: none; display: block;}
#select-stop-large form ul li label {float: left; clear: left}
#select-stop-large form ul li select {width: 260px; float: right}
#select-stop-large form button {float: right; border: none; text-decoration: underline}
#select-stop-large form ul li select.frequency-select {margin:0 10px 0 0;width:100px;}
#select-stop-large form ul li select.hour-select {margin:0 10px; width:60px;}
#select-stop-large form ul li select.minute-select {margin:0 0 0 10px; width:60px;}
#select-stop-large a.tx_mailform_submit { line-height: 25px;}
.frequency-select-container { float: right; height: 25px; width: 260px; }
.sms-obstruction-entry { line-height: 25px;}
/* and the sms controller */
/* #select-stop-large form ul li input.tx_mailform_text {width: 100px; float: right; margin-right: 120px; padding: 3px; background: red;} */
#select-stop-large form ul li input.tx_mailform_text {width: 100px; float: left; margin-left: 13px; padding: 3px;}
#select-stop-large form ul li label {width:150px; }

#add-more-sms-notifications {display: block; clear: both;}

#select-stop-large .tx_mailform_submit {
  	float: right;
	padding: 0px 0px 0px 8px;
	border: none;
	color: #000;
	text-decoration: underline;
	cursor: pointer;
	font-size:1em;
	padding-right:2px;
 	}	

#select-stop-large button.tx_mailform_submit {
	text-align:right;
	padding: 0px 0px 0px 8px;
	margin-left:0;
	width: 164px;
 	}	
#stop {
	background: url('../images/location.png') no-repeat;
	width: 275px;
	height: 185px;
	padding: 20px 8px;
	font-size: 9px;
}

#stop label {
	float:left;
	width: 100px;
	margin-top:5px;
}
#stop input, #stop div.optionlabel {
	float:left;
	padding:4px;
}
#stop select {
	width:150px;
}
#stop form {
	padding-top:10px;
}
#stop fieldset {
	padding:4px;
}

#banner-right {
	float:left;
	width: 275px;
	text-align: right;	
	padding-bottom:30px;
	/* height:118px; */
}

#banner-right span {
	display: block;
}

.banner-container {
	text-align: center;
	overflow:hidden;
}

/* realtime banners */
#banner-googlemaps {
	background: transparent url(../images/banner_googlemaps.png) scroll no-repeat 0 0;
}
#banner-transitmaps {
	background: transparent url(../images/banner_transitmaps.png) scroll no-repeat 0 0;
}
.block.banner-realtime {
	width: 275px;
	height: 187px;
	margin-bottom: 30px;
	clear: both;
}
.block.banner-realtime h4 {
	margin: 0 0 0 10px;
	padding: 2px 0 0 0;
	font-weight: bold;
	font-size: 1.4em;
	color: #fff;
}
.block.banner-realtime p {
	margin-top: 144px;
	padding: 0 10px;
}
.block.banner-realtime a {
	display: block;
	padding-left: 16px;
	background: url('../images/arrow.gif') no-repeat 0px 3px;
	text-decoration: underline;
}


#bumper {
	float:left;
	background: url('../images/twentyfour.png') no-repeat;
	width: 270px;
	padding: 110px 0px 0px 24px;
	font-size: 9px;
	
}

#bumper .inleiding p {
	/*width: 190px;*/
	width: 184px;
}

.zoekbox {
	height: 40px;
}

.zoekbox .zoekveld {
	border: 1px solid #5E5D5D;
	padding: 0px 6px 2px;
	width: 130px;
	font-size: 9px;	
	color: #5e5d5d;
	
}

.zoekbox .zoekknop {
	border: 0px;
	margin-top: 2px;
	padding-left: 8px;
	background: transparent url(../images/arrow.gif) no-repeat 0px 1px;
	font-size: 9px;	
	font-weight: bold;
	text-decoration: underline;
	cursor: pointer;
}

#bumper .quicklinks ul {
	/*width: 120px;*/
	width: 200px;

	height: 140px;
	background: url(../images/dot_horizontal_grey.png) repeat-x top left;
	padding-top: 8px;
}

#bumper .quicklinks li {
	float:left;
	margin: 0px 0px 6px;
	padding-left: 16px;
	background: transparent url(../images/arrow.gif) no-repeat scroll 0px 2px;
	/*#background-color: white;*/
	/*#list-style: none inside url(../images/arrow.gif);*/
	
	/*width: 105px;*/

	
}

#bumper .quicklinks li a {
	color: #5e5d5d;
	text-decoration: underline;	
	/*
	#display: block;
	#padding-left: 16px;
	*/
}

#bumper .quicklinks li a:hover {
	color: #000;	
}

#bumper .telefoonnummer {
	height: 24px;

	text-align: center;	
}

#bumper .telefoonnummer p {
	color: #00929d;
	font-size: 14px;
	font-weight: bold;
}

#bumper .contact {
	height: 24px;
	font-size: 11px;
	text-align:center;
}

#bumper .contact a {
	color: #00929d;
	text-decoration: underline;	
}

#footermenu {
	float: right;	
}

#footermenu ul li {
	display: inline;
	padding-left: 8px;
	color: #5e5d5d;
}

#footermenu ul li a {
	color: #5e5d5d;	
}

#footermenu ul li a:hover {
	color: #000;	
}

#shadowbox_body {
	background: url(../images/frame-back.png) repeat-y top left;	
}

#regio-selector {
	background: url(../images/logo-small.png) no-repeat 20px 20px;
	padding: 48px 20px 20px;
}

#regio-overzicht li {
	padding: 6px 0px;
	background:transparent url(../images/dot_horizontal_grey.png) repeat-x scroll left bottom;
}

#regio-overzicht li a {
	text-decoration: underline;
	padding-left: 16px;
	background: url('../images/arrow.gif') no-repeat 0px 2px;	
}

#regio-selector li a.active {
	color: #00929d;
	background: url('../images/arrow_active.gif') no-repeat 0px 2px;
}

#regio-selector .regio-links {
	padding-top: 8px;
	background: url('../images/dotted-fade') no-repeat top left;
}

#regio-selector .regio-kaart {
	width: 323px;
	height: 369px;
	background: url('../images/provincies/nederland_leeg.png') no-repeat top left;
}


#regio-selector li {
	margin: 0px 0px 6px;
}

#regio-selector li a {
	color: #5e5d5d;
	text-decoration: underline;
	padding-left: 16px;
	background: url('../images/arrow.gif') no-repeat 0px 2px;	
}

.tx-indexedsearch-searchbox input {
  border: 1px solid #ccc;
  padding: 3px;
  color: #000;
  font-size:1em;
  width: 200px;
}

input.tx-indexedsearch-searchbox-button {
	padding: 0px 0px 0px 16px;
	padding-left: 16px;
	margin-left: 8px;
	border: none;
	background: transparent url('../images/arrow_active.gif') no-repeat 0px 2px;
	color: #000;
	width: 40px;
	text-align: left;
	text-decoration: underline;
	cursor: pointer;
}

input.emailsubscribe {
	padding: 0px 0px 0px 16px;
	padding-left: 16px;
	margin-left: 8px;
	border: none;
	background: transparent url('../images/arrow_active.gif') no-repeat 0px 2px;
	color: #000;
	width: 140px;
	text-align: left;
	text-decoration: underline;
	cursor: pointer;
}

div#introduction {
	width:100%;
	clear:both;
	overflow:hidden;
}
div#introduction div#intro_left {
	width:50%;
	clear:left;
	float:left;
	background: transparent url('../images/frame-back.png') no-repeat;
	overflow:hidden;
}
div#introduction div#intro_right {
	width:50%;
	clear:right;
	float:left;
	background: transparent url('../images/frame-back.png') no-repeat;
	overflow:hidden;
}

div.timestamp {
	clear:both;
	padding-top:15px;
	color:#bbbbbb;
}

div#regio-info {
	position:relative;
	top:10px;
	left:0px;
	margin-right: 20px;
}

span.bus {
	position:absolute;
	right:0px;
	width:350px;
}

span.trein {
	position:absolute;
	top:22px;
	right:0px;
	width:350px;
}

span.pdf{
	position:absolute;
	width:20px;
	right:0px;
	top:22px;
	
}
span.print{
	position:absolute;
	width:20px;
	right:0px;
	top:44px;
	
}

div#text {
	padding-top:15px;
	margin-right:20px;
}
div.browse {
	padding-top:15px;
}


/* BLACKPAGE STYLES */ 


div.blackpage {
	background: transparent url('../images/blackpage.jpg') repeat-y;
	margin-bottom:20px;
	width:850px !important;
}
div.blackpage div#text,
div.blackpage div.timestamp {
	margin-left:50px;
}
div.blackpage div#text {
	width:800px !important;
}

/* MIJN ARRIVA */
.tx-bwmijnarriva-pi1 input {
	font-size:10px;
	border:1px solid #CCCCCC;
	}
	
	
.tx-bwmijnarriva-pi1 input.text,
.tx-bwmijnarriva-pi1 input.password  {
	width:240px;
	}

.tx-bwmijnarriva-pi1 input.password  {
	margin-bottom: 8px;
}
	
.tx-bwmijnarriva-pi1 label.password-again,
.tx-bwmijnarriva-pi1 #tx_bwmijnarriva_pi1_password_again {
	margin-top:2px;
	}	

.tx-bwmijnarriva-pi1 input.zipcode_digits {
	width:34px;
	float:left;
	margin-right:4px;
	margin-bottom:4px;
	}
.tx-bwmijnarriva-pi1 input.zipcode_chars {
	width:20px;
	float:left;
	margin-bottom:4px;	
	}
.tx-bwmijnarriva-pi1 input.zipcode_place {	
	width:156px;
	float:left;
	margin-bottom:4px;	
	}
.tx-bwmijnarriva-pi1 .field, .tx-bwmijnarriva-pi1 .text-field {
	padding:0;
	margin:4px 0;
	}
.tx-bwmijnarriva-pi1 label {
	width:200px;
	float: left;
	text-align: left;
	margin-right: 0.5em;
	display: block
	}

.tx-bwmijnarriva-pi1 .error  {
	display: block;
	padding-left:103px;
	float: left;
	clear: both;
	}
.tx-bwmijnarriva-pi1 .warn  {
	padding-left:0px;
}	
.tx-bwmijnarriva-pi1 span.required {
	color:#00929D;
	}
.tx-bwmijnarriva-pi1 span.not_required {
	color:#fff;
	}
.tx-bwmijnarriva-pi1 div.password-field {
	padding-bottom:20px;
	}	
.tx-bwmijnarriva-pi1 .submit-field {
	padding-top:4px;
	}
.tx-bwmijnarriva-pi1 .submit {
	background:transparent url(../images/arrow_active.gif) no-repeat scroll 0px 2px;
	
	border:0;
	color:#000;
	text-decoration:underline;
	cursor:pointer;
	float:right;
	font-size:1em;
	font-family:inherit;
	}	

/* Nieuwsbrieven */

table.subscriptions {
 	margin-bottom:4px;
	}
td.newsletter_check {
	clear: both;
	float: none;
	}
td.newsletter_check input {
	clear: left;
	display: block;
	float: right;
	width: 20px;
	margin: 4px 2px 0px 2px;
	
	}
td.checkable {	
	padding:4px 0px;
	vertical-align:top;
	}
td.newsletter_check label {
	clear: right;
	float: left;
	margin-left: 5px;
	padding-bottom:10px;
	}	
table.newsletter_fe, table.newsletter_fe table {
	margin-bottom:0;
	}
table.newsletter_fe table td {
	padding-top:4px;
	vertical-align:top;
}
td.newsletter_check .odd td {
	background: #fff;
	}
td.newsletter_check .even td {
	background: #eee;
	}
.tx_mailform_submit {
  	float: right;
	padding: 0px 0px 0px 8px;
	border: none;
	background: transparent url('../images/arrow_active.gif') no-repeat 0px 2px;
	color: #000;
	text-decoration: underline;
	cursor: pointer;
	font-size:1em;
	padding-right:2px;
 	}	




 /* Stremmingen en SMS */
 #delayform .optionlabel,  #delayform .transport {
 	float:left;
 	margin-top:4px;
 	} 
 #delayform label {
 	margin-top:4px;
 	width:100px;
 }
 #delayform fieldset {
 	padding:4px 0;
 	}
table.delay {
	margin-top:10px;
} 	
table.delay td {
	margin-left:5px;
	padding-bottom:10px;
	}
table.delay .even td {
	background: #eee;
	}	
table.delay td a.remove {
	background:transparent url(../images/arrow_active.gif) no-repeat scroll 0px 3px;
	padding-left:12px;
	}		
#sms td.line a {
	color: #00929D;
	text-decoration:none;
	}
input.date-picker {
	float:left;
}
img.ui-datepicker-trigger {
	float:left;
	margin:1px 2px;
}
.smslinks {
	float:left;
}
.smslinks .submit {
	color: #00929D;
	text-decoration:none;
	float:left;
}

/* MISC */
.hidden{
	display:none;
 	}

.box-top {
	background: url(../images/box_top.png) no-repeat left top;
	height: 42px;
	overflow: hidden;
}

.box-center {
	background: url(../images/box_center.png) repeat-y left top;
}

.box-center .inner {
	padding: 6px 9px 15px 7px;
}

.box-bottom {
	background: url(../images/box_bottom.png) no-repeat left top;
	height: 21px;
	overflow: hidden;
}

.box-top-plain {
	background: url(../images/box_top.png) no-repeat left top;
	height: 21px;
	overflow: hidden;
}

.box-bottom-plain {
	background: url(../images/box_bottom_plain.png) no-repeat left top;
	height: 6px;
	overflow: hidden;
}

.box-bottom a {
	text-decoration: underline;
	padding-left: 14px;
	margin-left: 6px;
	background: url(../images/more_side.png) no-repeat left 1px;
	color: #fff !important;
}

.box-top-plain h3,.box-top h3 {
	color: #fff;
	font-size: 12px;
	margin: 0 0 0 6px;
}

.box-top h4 {
	color: #231f20;
	font-size: 12px;
	font-weight: normal;
	margin: 0 0 0 6px;
}

.realtime-form-departure {
	width: 60px !important;
}

#realtime-detail-form .field {
	display:block;
	height:25px;
}

#realtime-detail-form {
	margin-bottom: 30px;
}

table.realtime th,
table.realtime td {
	padding: 4px 0px;
	border-bottom: 1px solid #ccf0ff;
	}
	
table.realtime th {
	padding-bottom: 16px;
	}

.cancellations {
	padding: 0px 0px 4px 0px;
	border-bottom: 1px solid #ccf0ff;
}

.tablepager-links a,
.realtime-buttons a {
	position: relative;
	margin: 0px 0px 6px;
	padding-left: 16px;
	background: url('../images/arrow.gif') no-repeat 0px 2px;
	}		
	
.tablepager-prev-but {
	float: left;
	background: url('../images/arrow_back_black.gif') no-repeat 0px 2px !important;
	}	
	
.tablepager-next-but {
	float: right;
	}
	
.realtime-buttons { margin: 16px 0px 4px 0px; }

#realtime-detail-form { margin-bottom: 30px; }

#realtime-map {width: auto; height: 460px; }


#haltevertrekstaten { position: relative; float: right; border: 1px solid #1e6782; width: 796px; }
.vertrektijden { margin: 0; width: 100%; color: #464646; font-size: 11px; }
.vertrektijden th,
.vertrektijden td { padding: 4px 10px; }
.vertrektijden thead th { text-align: center; }
.vertrektijden thead th.haltes { text-align: left; }
.vertrektijden tbody th.haltes { padding-left: 32px; background: url(../images/haltevertrekstaten_o.png) no-repeat 10px 7px; font-weight: normal; cursor: pointer; }
.vertrektijden thead th,
.vertrektijden tbody th.halte-selected,
.vertrektijden tbody th.haltes:hover { background-color: #1e6782; color: #fff; font-weight: bold; }
.vertrektijden tbody th.halte-selected,
.vertrektijden tbody th.haltes:hover { background-image: url(../images/haltevertrekstaten_o_selected.png); }
.vertrektijden thead th.uren { border-left: 1px solid #fff; border-right: 1px solid #fff; }
.vertrektijden tbody td.uren { border-left: 1px solid #1e6782; border-right: 1px solid #1e6782; text-align: center; }
.vertrektijden thead th.ma-vr,
.vertrektijden thead th.za { border-right: 1px solid #fff; }
.vertrektijden tbody td.ma-vr,
.vertrektijden tbody td.za { border-right: 1px solid #1e6782; }
.vertrektijden tbody td.uren,
.vertrektijden tbody td.ma-vr,
.vertrektijden tbody td.za,
.vertrektijden tbody td.zo-feest { border-bottom: 1px solid #ccf0fb; }
.vertrektijden tbody .last-entry td.uren,
.vertrektijden tbody .last-entry td.ma-vr,
.vertrektijden tbody .last-entry td.za,
.vertrektijden tbody .last-entry td.zo-feest { border-bottom: 0; }
.vertrektijden tfoot td.haltes-first,
.vertrektijden tfoot td.tijden { border-top: 1px solid #1e6782; }
.vertrektijden tfoot td.haltes { border-right: 1px solid #1e6782; }
.vertrekstaat-top-left,
.vertrekstaat-top-right { display: block; position: absolute; top: -1px; width: 3px; height: 3px; line-height: 0; background: no-repeat top left; overflow: hidden; }
.vertrekstaat-top-left { left: -1px; background-image: url(../images/haltevertrekstaten_top_left.png); }
.vertrekstaat-top-right { right: -1px; background-image: url(../images/haltevertrekstaten_top_right.png); }


#promotions div {
	float: left;
	width: 325px;
	height: 250px;
	background: right middle no-repeat;
}
