#ttl_qtt {

	font-family: Verdana, Arial, Helvetica, sans-serif;

	text-align:left;

	background-color:#7A89A6;

	color:#fff;

	font-size:11px;

}

#ttl_qtt h3,

#ttl_qtt .railcard_check{

	margin:2px;

	font-size:15px;

}

#ttl_qtt h4 {

	margin:2px;

	font-size:13px;

}

#ttl_qtt label.railcard_check{

	color: #061268;

	font-weight: bold;

	font-size:13px;

}

#ttl_qtt p {

	margin:2px;

	font-size:10px;

}

#ttl_qtt label {display:inline-block;margin:2px;}

#ttl_qtt input {display:inline-block;margin:2px;}

#ttl_qtt select {display:inline-block;margin:2px;}

#ttl_qtt img {vertical-align: middle;}

input.radio {width:auto !important;}



#ttl_qtt a {

	color:#000;

	text-decoration:underline;

	padding:10px 0 0 0;

}

#ttl_qtt a:hover {

	text-decoration:none;

}



#ttl_qtt form {

	padding:0px;

	margin:0px;

}

#ttl_qtt input#TimeTableWithMatrixButton {

	border:0;

	/*background:url(https://new.raileasy.co.uk/ibe/html/common/images/buttons/bg_ref-submit.png) transparent top left no-repeat;*/

	width:100px;

	height:30px;

	font-size:14px;

	cursor:pointer;

border-radius: 4px;

-webkit-border-radius: 4px;

-moz-border-radius: 4px;

/*

background: #E0E9B4;

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(224, 233, 180, 1)), color-stop(100%,rgba(206, 222, 134, 1)));

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e0e9b4', endColorstr='#cede86',GradientType=0 );

color:#08335E;

font-weight:bold;

*/

background:#7cca00;

color:#fff;

box-shadow: 0px 3px 5px #555;

}

/*

#ttl_qtt input#TimeTableWithMatrixButton:hover{

background: #E5F888;

background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(229, 248, 136, 1)), color-stop(100%,rgba(179, 202, 75, 1)));

filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#e5f888', endColorstr='#b3ca4b',GradientType=0 );

}

*/

#ttl_qtt input#ref-adv-button {

	border:0;

	

	width:100px;

	height:38px;

	color:#fff;

	font-size:14px;

	padding:0 0 8px 0;

	cursor:pointer;

}



/* Layout Fix's (deano) */



#ttl_qtt input[type='checkbox'], #ttl_qtt input[type='radio'] {

	position:relative;

	top:2px;

}



#ttl_qtt .hidden {

	display:none !important;

}



#ttl_qtt .spacing {

	padding:0px 10px 0px 0px;

}



#ttl_qtt #outslide_rangel, #ttl_qtt #inslide_rangel {

	position:relative;

	top:5px;

}

/* Horizontal */



/* 

*** REVERT TO THIS FOR 960PX

#ttl_qtt div.horizontal #ref-planner {float:left;width:275px;padding:10px;border-right:1px solid #fff;} */

#ttl_qtt div.horizontal .datepicker {

	background:#ffffff url('https://www.thetrainline.com/assets/images/icon-calendar.png') no-repeat 128px 1px;

	

}

#ttl_qtt div.horizontal #ref-planner {float:left;width:236px;padding:0px 0px 0px 0px;}

#ttl_qtt div.horizontal #ref-planner .ref-pad {padding:5px 5px 20px 5px !important;}

#ttl_qtt div.horizontal .left-white {border-right:1px solid #fff;}

/*#ttl_qtt div.horizontal #ref-planner label {padding-top:3px;padding-bottom:10px;}*/

#ttl_qtt div.horizontal #ref-planner label[class='error'] {padding:0px;position:relative;top:-5px;}

#ttl_qtt div.horizontal #ref-planner label[for='journey.origin'] {padding-top:5px;padding-bottom:10px;width:30px;float:left;}

#ttl_qtt div.horizontal #ref-planner label[for='journey.destination'] {width:30px;float:left;padding: 5px 0px 10px 0px;}

#ttl_qtt div.horizontal #ref-planner .journeyfromto {width:30px;float:left;}

#ttl_qtt div.horizontal #ref-planner label#lblchild {text-align:right;width:80px;}

#ttl_qtt div.horizontal #ref-planner input {width:180px;float:left;}



/* 

*** REVERT TO THIS FOR 960PX

#ttl_qtt div.horizontal #ref-outward {float:left;width:321px;margin:0 0 5px 0;padding:10px 0 10px 10px;border-bottom:1px solid #fff;} */

#ttl_qtt div .ref-pad {padding:5px;}

#ttl_qtt div.horizontal #ref-outward {float:left;width:277px;margin:0 0 5px 0;border-bottom:1px solid #fff;}

#ttl_qtt div.horizontal #ref-outward input {width:148px;}



/* 

*** REVERT TO THIS FOR 960PX

#ttl_qtt div.horizontal #ref-return {float:left;width:322px;margin:0 0 5px 0;padding:10px 0 10px 10px;border-bottom:1px solid #fff;border-left:1px solid #fff;} */

#ttl_qtt div.horizontal #ref-return {float:left;width:277px;margin:0 0 5px 0;border-bottom:1px solid #fff;}

#ttl_qtt div.horizontal #ref-return input[type="text"]{width:148px;}



#ttl_qtt div.horizontal #ref-type {float:left;width:273px;padding:0 0 0 5px;}

#ttl_qtt div.horizontal #ref-class {float:left;width:150px;}

#ttl_qtt div.horizontal #ref-card {float:left;width:275px;}

/*

*** REVERT TO THIS FOR 960PX 

#ttl_qtt div.horizontal #ref-advanced {clear:both;width:940px;border-top:1px solid #fff;padding:10px;}

#ttl_qtt div.horizontal #ref-advanced-01 {float:left;width:310px;}

#ttl_qtt div.horizontal #ref-advanced-02 {float:left;width:310px;}

#ttl_qtt div.horizontal #ref-advanced-03 {float:left;width:310px;} */

#ttl_qtt div.horizontal #ref-advanced { position: relative; clear:both;border-top:1px solid #fff;}

#ttl_qtt div.horizontal #ref-advanced-01 {float:left;width:280px;line-height:20px;}

#ttl_qtt div.horizontal #ref-advanced-02 {float:left;width:210px;line-height:20px;}

#ttl_qtt div.horizontal #ref-advanced-03 {float:left;width:290px;}



#ttl_qtt div.vertical #ref-advanced-01 {font-size:10px !important;}

#ttl_qtt div.vertical #ref-advanced-02 {font-size:10px !important;}

#ttl_qtt div.vertical #ref-advanced-03 {font-size:10px !important;}





/*

*** REVERT TO THIS FOR 960PX

#ttl_qtt div.horizontal #ref-buttons {clear:both;width:940px;border-top:1px solid #fff;padding:10px;} */

#ttl_qtt div.horizontal #ref-buttons {clear:both;border-top:1px solid #fff;}

#ttl_qtt div.horizontal #ref-adv-button {clear:left;float:left;padding:15px 0px 0px 20px}

#ttl_qtt div.horizontal #ref-tt-button {float:right;padding:15px 20px 0px 0px}

#ttl_qtt div.horizontal #TimeTableWithMatrixButton {margin:7px 6px 2px 0px;float:right;}



#ttl_qtt div.horizontal #outslide {margin:10px 0 0 0;}

#ttl_qtt div.horizontal input#outslide_range {width:80px;}



#ttl_qtt div.horizontal #inslide {margin:10px 0 0 0;}

#ttl_qtt div.horizontal input#inslide_range {width:80px;}



/* Vertical */

#ttl_qtt div.vertical .ref-pad {padding:5px 0;}

#ttl_qtt div.vertical .left {float:left;}

#ttl_qtt div .clear {clear:both;}

#ttl_qtt div.vertical .smalltolarge {position:relative;top:4px;left:8px;}

#ttl_qtt div.vertical .datepicker {

	background:#ffffff url('https://www.thetrainline.com/assets/images/icon-calendar.png') no-repeat 200px 1px;

	

}



#ttl_qtt div.vertical #ref-planner {padding:0px;border-bottom:1px solid #fff;width:270px;}

#ttl_qtt div.vertical #ref-planner label {width:40px;}

#ttl_qtt div.vertical #ref-planner label#lbladult {width:32px;}

#ttl_qtt div.vertical #ref-planner label#lblchild {text-align:right;width:80px;}

#ttl_qtt div.vertical #ref-planner input {width:200px;}

#ttl_qtt div.vertical #ref-planner .journeyfromto {width: 30px;float: left;}



#ttl_qtt div.vertical #ref-outward {width:270px;border-bottom:1px solid #fff;}

#ttl_qtt div.vertical #ref-outward input {width:220px;}



#ttl_qtt div.vertical #ref-return {border-bottom:1px solid #fff;width:270px;}

#ttl_qtt div.vertical #ref-return input {width:220px;}

#ttl_qtt div.vertical #ref-return input#openReturn {width:auto}



#ttl_qtt div.vertical #ref-type {width:270px;padding:5px 0;border-bottom:1px solid #fff;}

#ttl_qtt div.vertical #ref-class {width:auto;padding:5px;border-bottom:1px solid #fff;}

#ttl_qtt div.vertical #ref-card {border-bottom:1px solid #fff;width:270px;}

#ttl_qtt div.vertical #ref-advanced {padding:0px;border-bottom:1px solid #fff;width:270px;}

#ttl_qtt div.vertical #ref-buttons {padding:0px;width:270px;}

#ttl_qtt div.vertical #ref-adv-button {clear:left;float:left;}

#ttl_qtt div.vertical #ref-tt-button {clear:left;float:left;}

#ttl_qtt div.vertical #TimeTableWithMatrixButton {margin-top:10px;float:right;}



#ttl_qtt div.vertical #outslide {margin:10px 0 0 0;}

#ttl_qtt div.vertical input#outslide_range {width:80px;}



#ttl_qtt div.vertical #inslide {margin:10px 0 0 0;}

#ttl_qtt div.vertical input#inslide_range {width:80px;}



/* Errors

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

#ttl_qtt label.error {

	display:block;

	width:auto !important;

	color:#ff0;

}



#ttl_qtt .criterror {

	border:1px solid red;

	padding:10px;

	color:#770404;

	background-color:#ffefef;

	font-weight:bold;

}



#ttl_qtt div.horizontal label.error {



}

/* #ttl_qtt div.horizontal #ref-planner label.error {width:160px !important;} */

#ttl_qtt div.horizontal #ref-planner label.error, #ttl_qtt div.horizontal #ref-card label.error { display: inline-block; position: relative; margin: 2px;}





/* Layout helpers

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

.ui-helper-hidden { display: none; }

.ui-helper-hidden-accessible { position: absolute !important; clip: rect(1px 1px 1px 1px); clip: rect(1px,1px,1px,1px); }

.ui-helper-reset { margin: 0; padding: 0; border: 0; outline: 0; line-height: 1.3; text-decoration: none; font-size: 100%; list-style: none; }

.ui-helper-clearfix:after { content: "."; display: block; height: 0; clear: both; visibility: hidden; }

.ui-helper-clearfix { display: inline-block; }

/* required comment for clearfix to work in Opera \*/

* html .ui-helper-clearfix { height:1%; }

.ui-helper-clearfix { display:block; }

/* end clearfix */

.ui-helper-zfix { width: 100%; height: 100%; top: 0; left: 0; position: absolute; opacity: 0; filter:Alpha(Opacity=0); }



/* Interaction Cues

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

.ui-state-disabled { cursor: default !important; }



/* Misc visuals

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



/* Overlays */

.ui-widget-overlay { position: absolute; top: 0; left: 0; width: 100%; height: 100%; }

/* Overlays */

.ui-widget-overlay { background: #aaaaaa ; opacity: .60;filter:Alpha(Opacity=60); }

.ui-widget-shadow { margin: -8px 0 0 -8px; padding: 8px; background: #aaaaaa; opacity: .60;filter:Alpha(Opacity=60); -moz-border-radius: 8px; -webkit-border-radius: 8px; border-radius: 8px; }



/* Component containers

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

.ui-datepicker-trigger { position:relative; top:-1px; left:5px;}

.ui-widget { font-family: Helvetica, Arial, sans-serif; font-size: 11px; }

.ui-widget .ui-widget { font-size: 1em; }

.ui-widget input, .ui-widget select, .ui-widget textarea, .ui-widget button { font-family: Helvetica, Arial, sans-serif; font-size: 1em; }

.ui-widget-content { border: 1px solid #ddd; background: #fff; color: #444; }

.ui-widget-content a { color: #444; }

.ui-widget-header { border: 1px solid #ddd; background: #ddd; color: #444; font-weight: bold; }

.ui-widget-header a { color: #444; }



/* Interaction states

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

.ui-dialog-buttonset button { border: 1px solid #7A89A6; background: #fff !important; font-weight: bold; color: #7A89A6 !important ; }

.ui-dialog-buttonset button:first-child { border: 1px solid #7A89A6; background: #7A89A6 !important; font-weight: bold; color: #fff !important ; }

.ui-menu-item .ui-state-hover, td .ui-state-hover {

	color: #7A89A6 !important;

}



.ui-state-default, .ui-widget-content .ui-state-default, .ui-widget-header .ui-state-default { border: 1px solid #ddd; background: #f6f6f6; font-weight: bold; color: #7A89A6; }

.ui-state-default a, .ui-state-default a:link, .ui-state-default a:visited { color: #7A89A6; text-decoration: none; }

.ui-state-hover, .ui-widget-content .ui-state-hover, .ui-widget-header .ui-state-hover, .ui-state-focus, .ui-widget-content .ui-state-focus, .ui-widget-header .ui-state-focus { border: 1px solid #7A89A6; background: #F6F6F6; font-weight: bold; color: #fff; }

.ui-state-hover a, .ui-state-hover a:hover { color: #fff; text-decoration: none; }

.ui-state-active, .ui-widget-content .ui-state-active, .ui-widget-header .ui-state-active { border: 1px solid #ddd; background: #fff; font-weight: bold; color: #ff0084; }

.ui-state-active a, .ui-state-active a:link, .ui-state-active a:visited { color: #ff0084; text-decoration: none; }

.ui-widget :active { outline: none; }



/* Interaction Cues

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

.ui-state-highlight, .ui-widget-content .ui-state-highlight, .ui-widget-header .ui-state-highlight  {border: 1px solid #ccc; background: #fff; color: #444; }

.ui-state-highlight a, .ui-widget-content .ui-state-highlight a,.ui-widget-header .ui-state-highlight a { color: #444; }

.ui-state-error, .ui-widget-content .ui-state-error, .ui-widget-header .ui-state-error {border: 1px solid #ff0084; background: #fff; color: #2222; }

.ui-state-error a, .ui-widget-content .ui-state-error a, .ui-widget-header .ui-state-error a { color: #222; }

.ui-state-error-text, .ui-widget-content .ui-state-error-text, .ui-widget-header .ui-state-error-text { color: #222; }

.ui-priority-primary, .ui-widget-content .ui-priority-primary, .ui-widget-header .ui-priority-primary { font-weight: bold; }

.ui-priority-secondary, .ui-widget-content .ui-priority-secondary,  .ui-widget-header .ui-priority-secondary { opacity: .7; filter:Alpha(Opacity=70); font-weight: normal; }

.ui-state-disabled, .ui-widget-content .ui-state-disabled, .ui-widget-header .ui-state-disabled { opacity: .35; filter:Alpha(Opacity=35); background-image: none; }



.ui-datepicker { width: 200px; padding:2px; display:none;}

.ui-datepicker .ui-datepicker-header { position:relative; padding:.2em 0; }

.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next { position:absolute; top: 4px; padding:3px; cursor:pointer;font-size:10px;}

.ui-datepicker .ui-datepicker-prev-hover, .ui-datepicker .ui-datepicker-next-hover { }

.ui-datepicker .ui-datepicker-prev { left:2px; }

.ui-datepicker .ui-datepicker-next { right:2px; }

.ui-datepicker .ui-datepicker-prev-hover { left:1px; }

.ui-datepicker .ui-datepicker-next-hover { right:1px; }

.ui-datepicker .ui-datepicker-title { margin: 0 2.3em; line-height: 1.8em; text-align: center; }

.ui-datepicker .ui-datepicker-title select { font-size:1em; margin:1px 0; }

.ui-datepicker select.ui-datepicker-month-year {width: 100%;}

.ui-datepicker select.ui-datepicker-month, 

.ui-datepicker select.ui-datepicker-year { width: 49%;}

.ui-datepicker table {width: 100%; font-size: .9em; border-collapse: collapse; margin:0 0 .4em; }

.ui-datepicker th { padding: .7em .3em; text-align: center; font-weight: bold; border: 0;  }

.ui-datepicker td { border: 0; padding: 1px; }

.ui-datepicker td span, .ui-datepicker td a { display: block; padding: .2em; text-align: right; text-decoration: none; }

.ui-datepicker .ui-datepicker-buttonpane { background-image: none; margin: .7em 0 0 0; padding:0 .2em; border-left: 0; border-right: 0; border-bottom: 0; }

.ui-datepicker .ui-datepicker-buttonpane button { float: right; margin: .5em .2em .4em; cursor: pointer; padding: .2em .6em .3em .6em; width:auto; overflow:visible; }

.ui-datepicker .ui-datepicker-buttonpane button.ui-datepicker-current { float:left; }



.ui-slider { position: relative; text-align: left; }

.ui-slider .ui-slider-handle { position: absolute; z-index: 2; width: 1.2em; height: 0.5em; cursor: default; }

.ui-slider .ui-slider-range { position: absolute; z-index: 1; font-size: .7em; display: block; border: 0; background-position: 0 0; }



.ui-slider-horizontal { height: .8em; }

.ui-slider-horizontal .ui-slider-handle { top: -.3em; margin-left: -.6em; }

.ui-slider-horizontal .ui-slider-range { top: 0; height: 100%; }

.ui-slider-horizontal .ui-slider-range-min { left: 0; }

.ui-slider-horizontal .ui-slider-range-max { right: 0; }



.ui-slider-vertical { width: .8em; height: 100px; }

.ui-slider-vertical .ui-slider-handle { left: -.3em; margin-left: 0; margin-bottom: -.6em; }

.ui-slider-vertical .ui-slider-range { left: 0; width: 100%; }

.ui-slider-vertical .ui-slider-range-min { bottom: 0; }

.ui-slider-vertical .ui-slider-range-max { top: 0; }



.ui-dialog { position: absolute; padding: .2em; width: 300px; overflow: hidden; }

.ui-dialog .ui-dialog-titlebar { padding: .4em 1em; position: relative;  }

.ui-dialog .ui-dialog-title { float: left; margin: .1em 16px .1em 0; } 

.ui-dialog .ui-dialog-titlebar-close { position: absolute; right: 1em; top: 50%; width: 19px; margin: -7px 0 0 0; padding: 1px; height: 18px; }

.ui-dialog .ui-dialog-titlebar-close span { display: block; margin: 1px; }

.ui-dialog .ui-dialog-titlebar-close:hover, .ui-dialog .ui-dialog-titlebar-close:focus { padding: 0; }

.ui-dialog .ui-dialog-content { position: relative; border: 0; padding: .5em 1em; background: none; overflow: auto; zoom: 1; }

.ui-dialog .ui-dialog-buttonpane { text-align: left; border-width: 1px 0 0 0; background-image: none; margin: .5em 0 0 0; padding: .3em 1em .5em .4em; }

.ui-dialog .ui-dialog-buttonpane .ui-dialog-buttonset { float: right; }

.ui-dialog .ui-dialog-buttonpane button { margin: .5em .4em .5em 0; cursor: pointer; }

.ui-dialog .ui-resizable-se { width: 14px; height: 14px; right: 3px; bottom: 3px; }

.ui-draggable .ui-dialog-titlebar { cursor: move; }



.ui-autocomplete { position: absolute; cursor: default; }	

* html .ui-autocomplete { width:1px; } /* without this, the menu expands to 100% in IE6 */



.ui-autocomplete {

	max-height: 200px;

	overflow-y: auto;

	/* prevent horizontal scrollbar */

	overflow-x: hidden;

	/* add padding to account for vertical scrollbar */

	padding-right: 20px;

}

/* IE 6 doesn't support max-height

 * we use height instead, but this forces the menu to always be this tall

 */

* html .ui-autocomplete {

	height: 200px;

}



.ui-menu {

	list-style:none;

	padding: 2px;

	margin: 0;

	display:block;

	float: left;

}

.ui-menu .ui-menu {

	margin-top: -3px;

}

.ui-menu .ui-menu-item {

	margin:0;

	padding: 0;

	zoom: 1;

	float: left;

	clear: left;

	width: 100%;

}

.ui-menu .ui-menu-item a {

	text-decoration:none;

	display:block;

	padding:.2em .4em;

	line-height:1.5;

	zoom:1;

}

.ui-menu .ui-menu-item a.ui-state-hover,

.ui-menu .ui-menu-item a.ui-state-active {

	font-weight: normal;

	margin: -1px;

}

.ac_results {

	padding: 0px;

	border: 1px solid black;

	background-color: white;

	overflow: hidden;

	z-index: 99999;

}



.ac_results ul {

	width: 100%;

	list-style-position: outside;

	list-style: none;

	padding: 0;

	margin: 0;

}



.ac_results li {

	margin: 0px;

	padding: 2px 5px;

	cursor: default;

	display: block;

	/* 

	if width will be 100% horizontal scrollbar will apear 

	when scroll mode will be used

	*/

	/*width: 100%;*/

	font: menu;

	font-size: 12px;

	/* 

	it is very important, if line-height not setted or setted 

	in relative units scroll will be broken in firefox

	*/

	line-height: 16px;

	overflow: hidden;

}



.ac_loading {

	background: white url('indicator.gif') right center no-repeat;

}



.ac_odd {

	background-color: #eee;

}



.ac_over {

	background-color: #39CD07;

	color: white;

}