/* 
	common.css
	===============================================================
	Bluebridge - Screen Styles	
	To sort, search for '@'	
	
	Legacy styles
	By Breathe
	Optimised and tidied by CT	
	Corrections: h3.top of page now h3.topofpage	
	
	New styles
	By CT
	HTML is a recode of existing markup.

	To prevent the new styles from being applied to existing templates, 
	home/booking styles are prefixed with #t-booking to match 
	the template body ID.

	Styles that need to be shared between templates 
	(such as the sidebar booking form), aren't preceded with #t-booking 
  ===============================================================
*/

/*	
	@ layout/spacing (legacy)
  ---------------------------------------------------------------
*/		
	
	body, 
	div, 
	image {
		padding:0;
		margin:0; 
	}	
	h1,
	h2,
	h2.topofpage,	
	h3,	
	h3.topofpage,	
	h4 {
		clear:both; 		
	}			
	h1,
	h2,
	h3,	
	h4,
	p.h2inline,
	p.h3inline {
		padding-top: 12px;		
	}	
	.rwc2011 h2 {
		color: #005d73;
		padding-top: 0;
	}
	.cufon-active #t-legacy .rwc2011 h2 {
		font-size: 1.65em; /* 26px */
	}
	h2.topofpage,
	h3.topofpage,
	p.b,
	p {
		padding-top: 0;
	}		
	h1,
	h2,
	h4,
	p.h2inline {	
		margin-top: 12px;		
	}		
	.rwc2011 h2 {
		margin-top: 0;
		margin-bottom: 18px; /* replace div.20 */
	}	
	h2.topofpage,
	h3,
	h3.topofpage,	
	p.h3inline,
	p.b,
	p {
		margin-top: 0;
	}	
	h1 {
		padding-bottom: 8px; 
		margin-bottom: 7px;				
	}
	h2,
	p.h2inline,
	h2.topofpage.
	h3,
	p.h3inline,
	h3.topofpage,
	h4,
	p.b,
	p {
		padding-bottom: 5px;
		margin-bottom: 5px;
	}		
	#middle ul,
	ol {
	/* breathe may have intended #middle ol here? */
		padding-top: 0px; 
		padding-bottom: 8px; 
		padding-left: 20px; 		
		margin-top: 0px; 
		margin-bottom: 0px; 
		margin-left: 1px; 
	}
	#middle ol {
		padding-top: 0px; 
		padding-bottom: 8px; 
		padding-left: 25px; 		
		margin-top: 0px; 
		margin-bottom: 0px; 
		margin-left: 1px; 
	}
	#middle li {
		padding: 0 5px 5px 0; 		
		margin-top: 0px; 
		margin-bottom: 5px;
	}	
	#wrapper .rwc2011 li {
		background: url(/images/list-bullet.gif) no-repeat 4px 0.5em;
		padding-left: 11px;
		padding-bottom: 0;
		margin-bottom: 0;
	}
	.rightPic,
	.picright,
	.DynamicPic,
	.ImgrightTop,
	.Imgright { 
		float:right; 
	}
	.picleft,
	.leftText,
	.Imgpicleft { 
		float:left; 
	}
	.DynamicPic,
	.ImgrightTop,
	.Imgright { 
		margin:0 0 10px 20px;
	}	
	.DynamicPic {
		margin-bottom: 15px;
		margin-left: 15px;		
	}
	.Imgright { 
		margin-top: 10px;
	}	
	.rightPic{
		margin: 8px 0 8px 25px; 
	}		
	.button{
		display:block;
	}			
	
/*	
	@ #skip (legacy)
  ---------------------------------------------------------------
	Hidden skip link at top of page
  _______________________________________________________________
*/		
	
	#skip a, 
	#skip a:hover, 
	#skip a:visited { 
		position:absolute; 
		left:0px; 
		top:-500px; 
		width:1px; 
		height:1px; 
		overflow:hidden;
		visibilty:hidden;
  } 
	#skip a:active { 
		position:static; 
		width:auto; 
		height:auto; 
	}	
	
/*	
	@ .divN (legacy)
  ---------------------------------------------------------------
	These appear to be used to insert vertical spacing
  _______________________________________________________________
*/	
	
	.div10 { 
		height:10px;
	}
	.div20 { 
		height:20px;
	}
	.div30 { 
		height:30px;
	}
	.div40 { 
		height:40px;
	}
	.div50 { 
		height:50px;
	}
	.div60 { 
		height:60px;
	}
	.div70 { 
		height:70px;
	}
	.div80 { 
		height:80px;
	}
	.div150 { 
		height:150px;
	}
	.div200 { 
		height:200px;
	}
	.div250 { 
		height:250px;
	}

/*	
	@ .home, .homeLink, #homeLink, .returnLink (legacy)
  ---------------------------------------------------------------	
	#homeLink used above .side-a . 
	Unsure where others are used.
  _______________________________________________________________
*/			
	
	#homeLink {
		display:block; 
		width:100px; 		
		margin:8px 0;
	}	
	.returnLink{
		float:right; 
		margin-right:10px;
	}	
	
/*	
	@ .dotted_line, .dotted_line_title (legacy)
  ---------------------------------------------------------------	
	Divider
  _______________________________________________________________
*/		
	
	.dotted_line,
	.dotted_line_title {
	/* Changed by Equinox: URL location changed */	
		background-image: url("/images/dot.gif"); 
		background-repeat: repeat-x;  
	}	
	.dotted_line { 
		position: relative; 
		z-index: 1; 
		width: 95%; 
		padding-top:5px; 
		margin:10px 0 4px 0;
	}
	.dotted_line_title { 
		width: 100%; 
		padding:0; 
		margin:0; 
		height:10px; 
		border: 0;
	}
	
/*	
	@ #secondaryNav (legacy)
  ---------------------------------------------------------------	
 	Inline list that sits below the h2
  _______________________________________________________________
*/			
	
	#secondaryNav {
		font-size: 0.8em;
		margin:5px 0 20px 0; 
		padding:0; 
	}	
	#secondaryNav span {
		margin:0 12px;
	} 
	
/*	
	@ #dataTable (legacy)
  ---------------------------------------------------------------
  _______________________________________________________________
*/			

	#dataTable{
		border: #0E88CD 1px solid;  
		width:auto; 
		margin-bottom:25px; 
	}
	#dataTable th { 
	/* Changed by Equinox: URL location changed */	
		background-image:url("/images/th_bg.gif"); 
		text-align:left; 
		padding:6px;
	}
	#dataTable td{
		padding:9px; 
	}	
	
/*	
	@ layout defaults
  ---------------------------------------------------------------
	_______________________________________________________________
*/	

	body {
		background-image: url(/images/bg-gradient-tile.jpg);
		background-repeat: repeat-x;
		padding: 20px 0 0 0;
		margin: 0;		
	}	
	#t-booking .nav ul,
	#t-booking .nav ol,
	#t-booking .nav li,
	#t-legacy .nav ul,
	#t-legacy .nav ol,	
	#t-legacy .nav li {	
		padding: 0;
		margin: 0;
		list-style: none;
	}	
	#t-booking .clear,
	#t-legacy .clear {
		clear: both;
		display: block;
		height: 0;
		overflow: hidden;		
	}	
	#t-booking .access,
	#t-legacy .access {
		visibility: hidden;
		position: absolute;
		/*text-indent: -999px;*/
	}	
	#t-booking fieldset,
	#t-legacy fieldset {
		padding: 0;
		border: 0;
		margin: 0;
	}
	#t-booking h2, 
	#t-legacy .side-a h2, 	
	#t-booking h3, 
	#t-booking h4, 
	#t-booking h5, 
	#t-booking h6, 
	#t-booking #middle_home p,
	#t-booking .side-a .trip p,	
	#t-booking .step-2 .sailing p,
	.middle_booking p.cancel,	
	.side-a p.add {
		margin: 0;
	}
	#t-booking .step-2 .sailing p {
		margin-bottom: 0.5em;
	}
	#t-booking a img,
	#t-legacy a img {
		border: 0;
	}	
	#t-booking hr,
	#t-legacy hr {
		display: none;
	}	

/*	
	@ layout
  ---------------------------------------------------------------
	div#content
	 div#wrapper
		div#container
		 div.side-a 
		div#middle	
		
	Note: #nav is legacy - not sure where this is used
	_______________________________________________________________
*/
	
	#content {
	/* legacy */	
		text-align:center;	
	}	
	#wrapper { 
		text-align: left;
		padding: 0px;
		border:0;					
	}
	#nav,
	#flashcontainer {
		text-align: center; /* embed/fallback content is 760px */
	}	
	#nav,
	#flashcontainer,	
	#footer {
		width: 100%;
	}				
	#wrapper,	
	#topNavContainer,
	#footer .liner,
	#ssLogo {	
		width: 760px;	
	}	
	#content,	
	#topNavContainer,
	#wrapper,
	#footer .liner,
	#ssLogo {	
		margin: 0 auto;		
	}		

/*	
	@ #logo
  ---------------------------------------------------------------
  Print logo	
	_______________________________________________________________
*/

	.logo {
		position: absolute;
		visibility: hidden;
	}
	
/*	
	@ #topNavContainer
  ---------------------------------------------------------------
	Top Navigation
	
	Same on all templates.
	
	Changed by Equinox
	- URL location changed
	Changed by Chrometoaster: 
	- Breathe code reformatted, updated;
	- HTML now uses one UL rather than multiple ULs in a table
	- LIs now fixed width to emulate table cell widths
	- BG graphics edited
  _______________________________________________________________
*/

	#topNavContainer .liner {
		background-image: url(/images/primary-nav/nav-background.jpg); /* taller version of existing graphic */
		background-repeat: no-repeat;
		width: 760px; /* prevent bg bleeding beyong nav items */
		z-index: 1000 !important; /* see [http://joshuaink2006.johnoxton.co.uk/blog/82/flash-content-and-z-index] for flash index fix */
		border-bottom: 8px solid;		
	}
	#topNavContainer li {
		float: left;		
	}
	#topNavContainer li li {
		float: none;		
	}
	#topNavContainer li.nav-1 {
		width: 63px;
	}
	#topNavContainer li.nav-1 ul {	
		width: 60px;
	}		
	#topNavContainer li.nav-2 {
		width: 101px;
	}
	#topNavContainer li.nav-2 ul {	
		width: 98px;	
	}	
	#topNavContainer li.nav-3 {
		width: 75px;
	}
	#topNavContainer li.nav-3 ul {	
		width: 72px;
	}	
	#topNavContainer li.nav-4 {
		width: 168px;
	}
	#topNavContainer li.nav-4 ul {	
		width: 165px;
	}	
	#topNavContainer li.nav-5 {
		width: 117px;	
	}
	#topNavContainer li.nav-5 ul {	
		width: 114px;	
	}	
	#topNavContainer li.nav-6 {
		width: 92px;	
	}
	#topNavContainer li.nav-6 ul {	
		width: 89px;	
	}				
	#topNavContainer li.nav-7 {
		width: 136px;
		border-right: 8px solid;			
	}
	#topNavContainer li.nav-7 ul {	
		width: 133px;
	}											
	#topNavContainer li ul {	
	/* sub menus */
		position: absolute;
		left: -999em; /* hide */
		padding: 1px 0 0 0;
		background: url(/images/primary-nav/sub-menu-top.gif) no-repeat 100% 0; /* faux top border, to allow same width li and li ul and then to prevent bleeding into gap between list items */
		margin: 0;	
	}
	#topNavContainer li:hover ul,
	#topNavContainer li:focus ul,		
	#topNavContainer li.sfhover ul,
	#topNavContainer li.sffocus ul {		
		left: auto; /* show */
	}
	#topNavContainer li a {	
		display: block;
		background: url(/images/primary-nav/corner-left.gif) no-repeat;			
		padding: 0 0 0 3px;
		border-right: 3px solid; /* divider, so that gradient nav bg does not show underneath */
	}		
	#topNavContainer li a strong {	
		display: block;
		line-height: 1.2em;
		text-align: center; 	
		background: url(/images/primary-nav/corner-right.gif) no-repeat 100% 0;	
		padding: 6px 3px 6px 0;
		min-height: 15px; /* 27 less vert padding */				
	}	
	#topNavContainer li li a {		
		text-align: left; 
		padding: 5px 3px 5px 5px;
		border: 0;
		border-top: 1px solid;
		margin: 0;			
	}
	
/*	
	@ #flashcontainer
  ---------------------------------------------------------------
	Flash banner, with fallback to inline image.
	Extends to full width of viewport, so that resized top nav
	items push the blue strip down the page.
  _______________________________________________________________
*/	
	
	#t-booking #flashcontainer,
	#t-legacy #flashcontainer {
		background-color: #b2e6f0;
	}
	#t-legacy #flashcontainer {
		overflow: hidden;		
	}
	#t-legacy #flashcontainer img {
	/* crop top off legacy image */
		margin-top: -7px;
	}	
	html>body#t-booking #flashcontainer img {	
	/* 	remove 2-3 px whitespace below integrated header img */
		display: block;
		margin: 0 auto;
	}
	
/*	
	@ helpers
  ---------------------------------------------------------------
	.processing
	Show hourglass via jQuery onclick .class toggle
	
	hide focus border is firefox
  _______________________________________________________________
*/		

	body.processing {
		cursor: wait;
	}
	
	div:focus {
		outline: none;
	}

/*	
	@ .side-a 
  ---------------------------------------------------------------
	Booking side bar
	Used by all booking templates incl homepage + legacy pages	
	
	Previously this contained the following structure:
	.side-a > p > span.bookingSystem > table
  _______________________________________________________________
*/		

	.side-a {
		float: left; 

		margin-top: 6px;
		margin-left: 1px;
	}
	.side-a {
		width: 206px;
	}
	#t-booking .side-a ,
	#t-legacy .side-a ,	
	#t-booking .side-a .trip {
		background-image: url(/images/sidebar-booking-form/booking-sidebar-form-gradient-bg.jpg);
		background-repeat: repeat-x;
		background-position: 0 100%;
	}
	#t-legacy .side-a {
		margin-top: 0; /* transferred to #homeLink */
	}	
	.side-a fieldset {
		padding: 0 2px 8px 4px;
		margin-top: 5px;		
		margin-bottom: 1px;
	}	
	#t-booking .side-a fieldset,
	#t-legacy .side-a fieldset {	
		padding-left: 4px;
	}	
	#t-booking .side-a fieldset.leaving,
	#t-booking .side-a fieldset.returning,
	#t-legacy .side-a fieldset.leaving,
	#t-legacy .side-a fieldset.returning {	
		padding-bottom: 8px;
	}
	#t-booking .side-a fieldset.first,
	#t-legacy .side-a fieldset.first {	
		margin-top: 6px;
	}	
	.side-a fieldset#pdbTemplate__PageTemplate_ctlBooking_BookTravelPane2_tabPassengers {
		padding-bottom: 2px;
	}	
	.side-a fieldset#pdbTemplate__PageTemplate_ctlBooking_BookTravelPane2_tabVehicleEntry {
		margin-top: -5px;		
		margin-bottom: 0;
	}
	.side-a fieldset.first {
		padding-bottom: 0;
		margin-top: 6px;		
		margin-bottom: 0;		
	}
	.side-a legend {
		margin-top: 0;	
		margin-bottom: 2px;
		margin-left: -2px;
	}	
	.side-a fieldset.first legend {
		margin-bottom: 0;
	}
	.side-a h2,
	#t-booking #middle_home #news h2 {
		background-image: url(/images/sidebar-booking-form/booking-sidebar-form-hr.gif);
		background-repeat: no-repeat;
		padding: 4px 9px 1px 9px;
		border-bottom: 1px solid;
	}
	.side-a .pair img,
	.side-a legend img {	
		margin-bottom: -2px;
	}
	.side-a h2 img {
		display: block;
	}	
	.side-a .pair,
	.side-a .set-copy .pair {
		margin-top: 2px;
		margin-bottom: 9px;
	}	
	.side-a .set .pair {	
		margin-bottom: 7px;
	}
	.side-a .set-copy .pair {
		margin-top: -1px;
	}
	.side-a fieldset.first .pair {	
		margin-bottom: 0;
	}	
	.side-a .inline-pair {
		margin-top: 0;
	}	
	.side-a .inline-pair,	
	.side-a .pair input,	
	.side-a .pair select,	
	.side-a .pair label {	
	/*,
	.side-a .jq-dp*/
		display: inline;
	}	
	.side-a .jq-dp {
	/* generated icon which triggers jquery date-picker pop-up */
		margin-bottom: -0.4em;
	}	
	.side-a .set .pair,
	.side-a .set p.remover {	
		display: block;
		float: left;
	}

	
	.side-a select.route {
		width: 198px;
		margin-bottom: 5px;
	}
	.side-a select.monthyear {
		width: 126px;
	}
	.side-a fieldset.tabPassengers select {
		width: 45px;
	}
	.side-a select.day,
	.side-a select.monthyear,
	.side-a fieldset.tabPassengers select {
		margin-right: 3px;		
	}
	.safari .side-a select.day,
	.safari .side-a select.monthyear,
	.safari .side-a fieldset.tabPassengers select {
		margin-right: 1px;		
	}	
	.side-a fieldset.tabVehicleEntry select {
		width: 124px;
	}
	.side-a fieldset.tabVehicleEntry input {
		width: 48px; /* 68 less 20 for remover */
		margin-left: 4px;
		margin-top: 1px;
	}
	.safari .side-a fieldset.tabVehicleEntry input {
		margin-top: 5px;
	}
	.side-a fieldset.tabVehicleEntry .set-copy input {
		margin-top: 0; /* else dynamically generated inputs sit slightly too low */
	}		
	.safari .side-a fieldset.tabVehicleEntry .set-copy input {
		margin-top: 2px;
	}	
	.side-a .set p.remover {
		background: none;
		width: 11px;
		padding: 0;
		border: 0;
		margin: 0.35em 0 0 5px;
	}		
	.safari .side-a .set p.remover {	
		margin-top: 0.45em;
	}
	.side-a .set .pair label {
	/* faux legend */
		display: block;
		padding-bottom: 3px;
		margin-top: -1.7em;
		margin-left: 3px;		
	}
	.safari .side-a .set .pair label {	
		padding-top: 4px;
		padding-bottom: 0;
		margin-bottom: -1px;
	}
	#t-booking #content .side-a .set-copy .pair label,
	#t-legacy #content .side-a .set-copy .pair label {	
		position: absolute;
		visibility: hidden;
	}
	.side-a p.add {	
		clear: both;
		padding-bottom: 0;
		margin-left: 2px;
	}
	.side-a p.add a {
		display: block;
		background: url(/images/sidebar-booking-form/booking-sidebar-add-icon.gif) no-repeat 0 0.3em;
		min-height: 10px;		
		padding-left: 14px;				
	}	
	.side-a .submit {
		text-align: center;
		padding-bottom: 9px;
		margin-top: 10px;
	}	
	.side-a #homeLink {
	/* was confined to #t-legacy, but freed up to cater for templates that incorrectly use #t-booking */
		width: auto;
		padding: 8px 0 8px 1px;
		margin: 0;
	}
	#t-booking .side-a #homeLink {
		margin-top: -6px; /* offset top margin of .side-a, to match #t-legacy (for pages that incorrectly use #t-booking) */ 	
	}
	.side-a .feedback .trip li {
		line-height: 1.2;
	}			


	
/*
	.checkTimetables
*/	
	
	.side-a .checkTimetables {
		background-image: url(/images/sidebar-booking-form/booking-sidebar-footer.gif);
		background-repeat: no-repeat;
		padding-top: 2px;
		margin: 0;
	}
	#t-booking .side-a .trip h3,
	#t-booking .side-a .trip p,	
	#t-booking .side-a .trip li {
		padding-bottom: 0.4em;
	}		
	#t-booking .side-a .trip .liner {	
		padding: 0 8px;
	}

	#t-booking .side-a .trip h3 {
		padding-top: 0.5em;	
		padding-bottom: 0;
	}	
	#t-booking .side-a .trip p {
		padding-bottom: 0.8em;
	}	
	#t-booking .side-a .trip h3 {
		background: url(/images/sidebar-booking-form/booking-sidebar-header.gif) no-repeat;			
		padding-left: 8px;
		padding-right: 8px;		
		margin-left: -8px;
		margin-right: -8px;
	}	
	#t-booking .side-a .trip h3.first {
		background: none;
	}	
	#t-booking .side-a .trip .liner {	
		padding-bottom: 2px;
		border-bottom: 1px solid;
		background: url(/images/sidebar-booking-form/booking-sidebar-footer.gif) no-repeat 0 100%;			
	}	
	.side-a .checkTimetables p,
	.side-a .feedback .trip p.action {
	/* overrides */
		padding: 0;
		margin: 8px 0 0 6px;
	}	
	.side-a .feedback .trip p.action {
		margin-left: 0;
		margin-top: 5px;
	}	
	.side-a .checkTimetables p a {
		background: url(/images/sidebar-booking-form/timetable-icon.gif) no-repeat 0 0.3em;
		padding-left: 15px;
	}	
	.side-a .checkTimetables p a img,
	.side-a p.action a img {
	/* inline image is 1*1 */
		width: 3px;
		height: 5px;
		margin-left: 2px;
	}	
	.middle_booking .trip {
		margin-bottom: -1.7em;
	}
	
/*	
	@ #side-b
  ---------------------------------------------------------------
	Images (RH column)
  _______________________________________________________________
*/		
	
	#side-b { 
		float: right;	
		width: 150px; 
		text-align:center; 
	}		
	
/*	
	@ #middle, #middle_home, #middleFlushed (legacy)
  ---------------------------------------------------------------
	Main content (center column container)
  _______________________________________________________________
*/			

	#middle,
	#middle_home,
	#middleFlushed {
	/* legacy */
		float: left;		
		padding: 31px 0px 0px 18px; 
	}
	#middle { 
	/* legacy */	
		width: 500px; 
	}
	#middle_home {
	/* legacy */	
		padding-bottom: 10px;
		width: 365px; 
	}	
	#middleFlushed { 
	/* legacy */	
		width: 515px; 
	}		
	#t-booking #middle_home,
	.middle_booking {
		padding-top: 4px;	
		padding-left: 23px;
		width: 524px; /*508px*/
	}	
	#t-booking #middle_home #promo {
		margin-left: -2px;
		margin-bottom: -8px; /* offset extra w/s above h2 in case of no promo */
	}
	#t-booking #middle_home h2,
	.middle_booking h2,
	.middle_booking h3 {
		/* overrides */
		padding: 0;
		margin: 0;	
	}	
	.rwc2011 h3,
	.rwc2011 h4 {	
		font-family: Arial, Helvetica, sans-serif;
		font-weight: bold;
		color: #009ec2;
		font-size: 0.9em; /* 14px */
		padding-top: 0.1em;
		margin-bottom: 1.4em;
	}
	.rwc2011 h4 {	
		font-size: 0.8em;
	}	
	#t-booking #middle_home h2 {
		margin: 20px 0 6px 0;	
	}	
	#t-booking .middle_booking h2 {
		margin: 17px 0 1px 0;	
	}	
	#t-booking .middle_booking h3,
	#t-booking .middle_booking p.h3 {
		margin: 13px 0 1px 0;
	}	
	.middle_booking p {
		line-height: 1.5;
	}	
	.middle_booking #form-errors p,
	.middle_booking #browser-check p,		
	.middle_booking p.cancel,
	#t-booking .step-2 .sailing p,
	.middle_booking .inline-set p {
		line-height: normal;
	}
	#t-booking #middle_home p {
		line-height: 1.5;
	}	
	#t-booking #middle_home #news {
		width: 504px; /* 510 less horz pad */
		background: url(/images/news/booking-main-news-shadow.gif) no-repeat;
		padding: 2px 3px 0 4px;
		margin: 6px 0 0 -2px;
	}	
	#t-booking #middle_home #news h2 {	
		background-image: url(/images/booking-main-form-hr.gif);
		padding-left: 4px;
		margin: 0;
	}
	#t-booking #middle_home #news .item {
		position: relative; /* abs wrap */
		margin: 6px 25px 3px 5px;
	}	
	#t-booking #middle_home #news .item p a {
		padding-right: 5px;
	}		
	#t-booking #middle_home #news .item h3 {
		padding: 6px 0 0 0; 
		margin: 0 0 0.35em 0; 		
	}	
	.rwc2011 #flash-driving-calculator object {	
		margin-top: 0.5em;
		margin-bottom: 1.1em;
	}
	object {
		outline: none;
	}
	
/*	
	@ .trip
  ---------------------------------------------------------------
	.side-a and .middle_booking
  _______________________________________________________________
*/		
	
	#t-booking .trip li,
	#t-booking .trip ul {
	/* .side-a and .middle_booking */
		list-style: none;
		padding: 0;
		margin: 0;
	}
	#t-booking .trip li {
		padding-bottom: 0.5em;
	}		
	#t-booking .trip li li {
		padding-bottom: 0;
	}	
	#t-booking .trip li strong {
		display: block;
	}	
	
/*	
	@ .middle_booking
  ---------------------------------------------------------------
	Wrapper used by all booking templates.
	Note: Homepage uses #middle_home
  _______________________________________________________________
*/			
	
	.middle_booking {
		float: left;
	}	
	.middle_booking table,
	.middle_booking th,
	.middle_booking td {
		padding: 0;
		border: 0;
	}		
	.middle_booking p {
		margin-bottom: 0.5em;
	}	
	.middle_booking .progress {
		margin-top: 3px;
	}
	#t-booking .middle_booking .progress li {
		display: inline;
		margin-right: 8px;
	}	
	
/*
	tables,
	faux table footer
*/	

	.middle_booking th,
	.middle_booking td {			
		text-align: left;				
	}	
			
/*
	.hr-wrap
	Wrapped elements that are displayed inline
	
	p.h5
	Looks like H5, but P used to match .side-a setup.
*/	

	.middle_booking .hr-wrap {
		margin-top: 1.1em;
		margin-bottom: -0.2em;		
	}	
	.middle_booking .hr-wrap p.h5 {
		margin-left: 3px;
	}			
	.middle_booking .hr-wrap h3,
	.middle_booking .hr-wrap p.h5,	
	.middle_booking .hr-wrap p {
		display: inline;
	}	
	.middle_booking .hr-wrap p.required {
		margin-left: 7px;
	}
	
/*
	.warning
 	Warning text with icon.

	#form-errors
	Precedes form and shows that there is an error.
	This is particularly accessible but is a limit of the backend setup.
	
	Styles also reused by
	#browser-check
*/		
	
	.middle_booking label strong.warning {
		display: block;
	}		
	.middle_booking #browser-check p.first {
		margin-bottom: 0.5em;
	}
	.side-a .warning,
	.middle_booking .warning,
	.middle_booking .sailing .table div.warning p,
	.rwc2011 .warning h4 {
		background-repeat: no-repeat;
		padding-left: 19px;	
	}		
	.side-a p.warning {
		margin: 0.5em 4px;
	}
	.side-a .warning {
		min-height: 16px;
	}	
	.middle_booking #form-errors,
	.middle_booking #browser-check,
	.rwc2011 .warning h4 {
		background-image: url(/images/warning-form-errors.gif);
	}	
	.rwc2011 .warning h4 {
		background-position: 0 0.1em;
	}
	.side-a .warning {
		background-image: url(/images/sidebar-booking-form/warning.png);
	}	
	.middle_booking .warning,
	.middle_booking .sailing .table div.warning p {
		background-image: url(/images/warning-special-assistance.gif);
	}	
	#t-booking .middle_booking .sailing .table div.warning {
		background: none;
		text-align: center;
		padding: 0;
		margin: 0;
	}	
	#t-booking .middle_booking .sailing .table div.warning p {
		background-position: 0 1em;
		width: 260px;	
 /* pad el out so that ajax loading overlay looks nicer */		
		padding-top: 1em;
		padding-bottom: 0.8em;
		margin-left: auto;
		margin-right: auto;				
	}
	.middle_booking tr.odd .warning {
		background-image: url(/images/warning-special-assistance-odd.gif);
	}			
	.middle_booking #form-errors,
	.middle_booking #browser-check {	
		margin-top: 1em;
	}	
	.middle_booking #form-errors p,
	.middle_booking #form-errors ul,
	.middle_booking #browser-check p,
	.middle_booking #browser-check ul {	
		padding-left: 0;
		margin: 0;
	}	
	.middle_booking #form-errors ul,
	.middle_booking #browser-check ul {
		padding-left: 14px;
	}	
	
/*
	faux table footer
*/	
	
	.middle_booking tfoot .total {
		width: 44px; /* 72 less horz pad */
		padding-top: 6px;
		border-top: 2px solid;
	}			
	
/*
	form .submit,
	.cancel booking process
*/		
	
	.middle_booking .submit {
		text-align: right;
		padding-top: 7px;
	}	
	.middle_booking .submit p,	
	.middle_booking .submit label,
	.middle_booking .submit input {
		display: inline;
	}		
	.middle_booking .submit input {
		margin-left: 9px;
		margin-bottom: -0.8em;
	}	
	.middle_booking p.cancel {
		display: block;
		text-align: right;
		margin-top: 11px; /* avoid collision with .submit button */
		margin-right: 2px;
	}
	
/*	
	@ .middle_booking.step-2
  ---------------------------------------------------------------
	Booking - Step 2: Choose your sailings	
	
	#depart/#return
 	  div.sailings
			h4
			ul (nav)
				UL not valid within table caption, so replaced with div.table 
				and summary used in place of caption			
			table		
		div.additions
			fieldset
			div.table
				table
					thead
					tfoot
					tbody
					em
					strong			
	
	Where reqd, #t-booking can be used to override .middle_booking.	
  _______________________________________________________________
*/	

/* .sailing */		
	
	.step-2 .sailing .table {	
		position: relative; /* abs wrap */			
		text-align: left;		
		background-image: url(/images/booking-table-btm.gif);
		background-repeat: no-repeat;
		background-position: 0 100%;
		width: 504px; /* 520 less horz pad */
		padding: 8px;
		margin-bottom: 16px;
		margin-top: 2px;
	}
	.step-2 .sailing table {		
		width: 100%; /* preserve the design if less text in the cells */
	}
	.safari	.step-2 .sailing .table {	
		/* width: 520px; failed */
	}
	.step-2 .sailing .table .loader {
		/* width and height set by jquery to match table */	
		position: absolute;
		bottom: 8px;
		left: 8px;
	}	
	.step-2 .sailing .table .loader img {
		position: absolute;	
		top: 50%;
		left: 50%;
		margin-top: -11px; /* half height of loader */
	}	
	.step-2 .sailing .table .nav {
		background: url(/images/booking-table-top.gif) no-repeat;
		padding: 8px 0 9px 0;
		margin: -8px -8px 3px -8px;
	}	
	.step-2 .sailing .table h4 {
		display: block;
		width: 280px;
		padding: 0;
	}
	#t-booking .step-2 .sailing .table h4 {
		text-align: center;	
		margin: 3px 120px 0 120px;	
	}
	.step-2 .sailing .table li {
		position: absolute;
		left: 8px;
		top: 8px;	
	}
	.step-2 .sailing .table li.next {
		left: auto;
		right: 8px;
	}		
	.step-2 .sailing .table a,
	.step-2 .sailing .table a span {
		display: block;
	}		
	.step-2 .sailing .table a {
		width: 104px; 
		background: url(/images/date-button-btm.gif) no-repeat 0 100%; /* 3px plus extra 100px height */
		padding-bottom: 3px;
	}

	.step-2 .sailing .table a span {
		text-align: center;
		background: url(/images/date-button-top.gif) no-repeat 0 0;	
		padding: 6px 6px 3px 18px;		
	}
	.step-2 .sailing .table li.next a span {
		background-position: -104px 0;
		padding-right: 18px;
		padding-left: 6px;				
	}		
	#t-booking .step-2 .sailing .table table {
		border-bottom: 1px solid;
	}	
	#t-booking .step-2 .sailing .table th,
	#t-booking .step-2 .sailing .table td {		
		padding: 6px 8px 5px 8px;
		width: 20%;
	}		
	.safari	#content .step-2 .sailing .table th,
	.safari	#content .step-2 .sailing .table td {	
		width: 19%;
	}	
	#t-booking .step-2 .sailing .table .first td {	
		padding-top: 5px;
	}	
	#t-booking .step-2 .sailing .table th {
		padding-top: 10px;
		padding-bottom: 7px;		
	}	
	#t-booking .step-2 .sailing .table th.price-a,
	#t-booking .step-2 .sailing .table th.price-b,
	#t-booking .step-2 .sailing .table th.price-c,
	#t-booking .step-2 .additions .table th.cost {		
		text-align: center;			
	}			
	.step-2 .sailing .table th.price-a {
		white-space: nowrap;	
	}
	#t-booking .step-2 .sailing .table th.price-a,
	#t-booking .step-2 .sailing .table th.price-b,
	#t-booking .step-2 .sailing .table th.price-c,
	#t-booking .step-2 .sailing .table td.price-a,
	#t-booking .step-2 .sailing .table td.price-b,
	#t-booking .step-2 .sailing .table td.price-c {
		border-left: 1px solid;
	}			
	#t-booking .step-2 .sailing .table td {
		border-top: 1px solid;		
	}			
	.step-2 .sailing .table input {
		display: block; /* else bottom margin not applied */
		margin: 0 3px -1.2em 0;
	}	
	.step-2 .sailing .table label {
		margin-left: 17px; /* w/s for radio */
	}	
	
/* .additions */		

	.step-2 .additions {
		margin-bottom: 19px;
	}
	.step-2 .additions p,
	.step-2 .additions .inline-set,
	.step-2 .additions .inline-pair {
		display: inline;
	}		
	.step-2 .additions table {
		width: 520px;
		margin-top: 22px;
	}	
	#t-booking .step-2 .additions th,
	#t-booking .step-2 .additions td {
		padding: 4px 9px 3px 9px;
	}	
	#t-booking .step-2 .additions thead th {
		padding-top: 0;
		padding-bottom: 5px;
	}
	.step-2 .additions td {	
		width: 13%;
	}
	#t-booking .step-2 .additions .odd td {
		border-bottom: 1px solid;
	}	
	.step-2 .additions td.first {
		width: 61%;
	}	
	#t-booking .step-2 .additions tfoot th,
	#t-booking .step-2 .additions tfoot td {
		padding-top: 10px;
		padding-right: 3px;
	}	
	#t-booking .step-2 .additions tfoot td {
		padding-top: 8px; /* pad less border */
	}		
	#t-booking .step-2 .additions tfoot th {
		width: 445px;
		text-align: right;
	}	
	#t-booking .step-2 .additions td.cost,
	#t-booking .step-2 .additions tfoot td {
		text-align: right;		
		padding-right: 28px;
	}		
	
/*	
	@ .middle_booking.step-3
  ---------------------------------------------------------------
	Booking - Step 3: #passengers and .vehicles
	
	Where reqd, #t-booking can be used to override .middle_booking.	
	
	#passengers
	Uses a table, with form markup, for compatability with forms-mode
  _______________________________________________________________
*/	

	.step-3 table {
		margin-top: 0.65em;
	}
	.step-3 label,
	#passengers .special-assistance-1 label span {
		position: absolute;
		visibility: hidden; 
	}
	.step-3 .submit label,
	#passengers .special-assistance-1 label,	
	#passengers td.assistance .special-assistance-2 label {
		position: static;
		visibility: visible; 
	}			
	.safari #passengers td.assistance .special-assistance-2 label.warning {
		min-height: 15px;
		display: block;
	}	
	#t-booking .step-3 td {
		padding-top: 6px;
		padding-bottom: 6px;		
	}
	#t-booking .step-3 th,
	#t-booking .step-3 td {	
		padding-right: 7px;
		vertical-align: top;
	}
	#t-booking .step-3 th {
		padding-bottom: 1px;
	}				
	.vehicles td.make {
		padding-right: 8px;
	}	
	.vehicles td.registration {
		padding-right: 18px;
	}		
	#t-booking .step-3 td.type {
		padding-left: 7px;
		padding-top: 8px;
	}	
	#passengers td.type {	
		text-align: right;
		width: 116px; /* 130px less horz pad */
	}
	.vehicles td.type {
		width: 245px; /* 259px less horz pad */
	}	
	#passengers th.assistance,
	#passengers td.assistance {	
		text-align: right;
		padding-right: 10px;		
	}	
	#passengers td.assistance {	
		padding-left: 6px;
	}	
	#passengers .special-assistance-1,		
	#passengers .special-assistance-2 {
	/*
		Originally I had envisaged a complex scenario with 
		- an absolutely positioned div,
		- JQuery used to 'prop' open a space for the div by calculating the div height and applying the reqd amt of bottom pad to the row cells.
		However I was happy to discover that the left margin offset works just as well, and the content remains in the flow so a JQuery hack is not reqd.
	*/	
		text-align: left;
		width: 387px;	
		margin: 0.3em 0 0 -288px;		
	}
	#passengers .special-assistance-1 {
	/* div */
		position: relative;
		margin-top: 1.9em;			
	}	
	#passengers .special-assistance-1 select {
		position: absolute;
		top: -1.9em;
		right: -4px;
	}
	#passengers td input,
	#passengers td select {
		width: 100%;
	}
	#passengers td.title select {
		width: 61px;
	}	
	#passengers td.firstname input,
	#passengers td.lastname input {	
		width: 96px;
	}		
	#passengers td.assistance select {
		width: 103px;
	}
	.vehicles td.make select {
		width: 117px;
	}		
	.vehicles td.registration input {
		width: 118px;
	}	
	#passengers td.assistance textarea {	
		width: 100%;
		height: 119px;
	}
	.step-3 th img.help {
		margin-bottom: -0.3em;
	}
	.step-2 img.help,
	.step-2 img.note {
		margin-bottom: -0.2em;
	}
	
/*	
	@ #middle-booking.step-4
  ---------------------------------------------------------------
	Booking - Step 4: #contact and #payment
	
	Where reqd, #t-booking can be used to override .middle_booking.
  _______________________________________________________________
*/		

	.step-4 #contact {
		margin-bottom: 2.7em;
	}	
	.step-4 #payment .hr-wrap {	
		margin-bottom: 0.5em;
	}				
	#t-booking .step-4 h4 {
		margin-top: -0.7em;
		margin-bottom: -0.3em;		
	}		
	.step-4 .set .pair,
	.step-4 .set div.inline-pair {	
		float: left;
	}	
	.step-4 span.pair {
		margin-right: 6px;	
		margin-bottom: 3px;		
	}	
	.step-4 div.pair {
		width: 174px; /* 159 + 5 + 10 */
		margin-right: 8px;	
		margin-bottom: 6px;			
	}		
	.step-4 fieldset div.pair-last {
		width: 334px; /* 349 - 5 - 10 */
	}			
	.step-4 .inline-pair label,	
	.step-4 span.pair label,
	.step-4 .inline-pair p {
		display: inline;	
	}	
	.step-4 div.inline-pair {
		margin-top: 1.6em;
		margin-left: -5px;		
	}	
	.step-4 #payment .terms div.inline-pair {
		margin-top: 1.4em;
		margin-bottom: 2.35em;
	}	
	#t-booking .step-4 #contact fieldset span.inline-pair {
		margin-left: -2px;
	}			
	.step-4 #payment .terms p {
		text-transform: lowercase;
	}			
	.step-4 legend,
	.step-4 label,
	.step-4 h4 {
		display: block;	
	}
	.step-4 legend,
	.step-4 label {
		padding-bottom: 3px;
		padding-top: 0.35em;	
	}		
	.step-4 legend {
		padding-left: 1px;
	} 
	.step-4 #payment legend,
	.step-4 #payment label {	
		padding-top: 0.1em;
	}		
	#t-booking .step-4 fieldset.cc-number {
		margin-top: 7px;
	}	
	#t-booking .step-4 .cc-type label {
		margin-bottom: 6px;
	}	
	.step-4 .cc-type label img {
		margin-bottom: -6px;
	}	
	.step-4 .submit label {	
		display: inline;
		padding-top: 0;
		padding-bottom: 0;			
	}
	.step-4 div.pair select {	
		width: 173px; /* 158 + 5 + 10 */
	}					
	.step-4 div.pair input {		
		width: 169px; /* 154 + 5 + 10 */
	}
	.step-4 #contact span.short input {
		width: 31px; /* 26 + 5 */
	}
	.step-4 #contact span.medium input {
		width: 87px; /* 82 + 5 */
	}	
	.step-4 #payment span.medium select {
		width: 67px; /* 62 + 5 */
	}
	#t-booking .step-4 input.cost {
		padding: 0;
		border: 0;
		margin: -0.1em 0;		
	}	
	
/*	
	@ .middle_booking.confirmation
  ---------------------------------------------------------------
	Booking - .confirmation (final step)
	
	Where reqd, #t-booking can be used to override .middle_booking.	
  _______________________________________________________________
*/			

	#t-booking .confirmation {
		margin-bottom: 1.7em; /* offset negative bottom margin on .trip */
	}
	#t-booking .confirmation .hr-wrap {	
		margin-top: 2.45em;
		margin-bottom: 0.35em;
	}
	#t-booking .confirmation p.h3 {
		margin-bottom: 0.5em;
	}	
	#t-booking .confirmation p.h3,	
	#t-booking .confirmation p.h5 {
		line-height: normal;	
	}
	
/*	
	@ #footer
  ---------------------------------------------------------------
	Footer
	
	Same on all templates.	
  _______________________________________________________________
*/			
	
	#footer {
		margin: 20px 0 0 0; /* override */
	}	
	#footer .liner {
		padding: 8px 19px;
	}	
	#footer .nav,
	#footer p {	
		padding: 0;
		margin: 0;
	}		
	#footer p.copyright {	
		float: left;
		text-align: left;		
		width: 200px;
	}	
	#footer p#ssLogo {	
		text-align: left;
		margin-top: 6px;
	}	
	#footer p#ssLogo a {	
		display: block;
		float: left; /* shrink wrap to img and text */
		background: url(/images/footer/strait-shipping-logo.gif) no-repeat;
		min-height: 24px; /* logo height less vert pad */
		padding: 4px 0 0 38px;
		margin-left: -2px;
	}	
	#footer .nav {	
		float: right;
		text-align: right;
		width: 500px;
	}
	#footer .nav li {	
		display: inline;
	}
	#footer .nav a,
	#footer .nav .a {	
		padding: 0 2px 0 6px;
		border-left: 1px solid;			
	}
	#footer .nav button {		
		background: none;	
		padding: 0;
		border: 0;
		margin: 0;		
	}		
	#footer .nav .first a {		
		background: none;
		padding-left: 0;
		border-left: 0;
	}	
	
/* 
	===============================================================
	jQuery Tooltip styles
	
	Default code updated to match new look+feel
  ===============================================================
*/	
	
	img.help,
	img.note {
		cursor: help;	
	}
	#tooltip {	
		position: absolute;	                  	
		width: 170px;	
		text-align: left;
		border: 1px solid #8b8b8b;     	
	}	
	#tooltip .liner {	
		padding: 10px;                  	
	}              	
	#tooltip dl,          	
	#tooltip dt, 	
	#tooltip dd { 	
		padding: 0;          	
		margin: 0; 	
	}	
	#tooltip dt {
		margin-bottom: 0.3em;		
	}

/* 
	===============================================================
	jQuery Date Picker styles
	
	Default code optimised and styles updated to match new look+feel
	
	div.dp-popup = table wrap
  ===============================================================
*/

	table.jCalendar,
	table.jCalendar th,
	table.jCalendar td {
		padding: 0;
		border: 1px solid #fff;	
	}
	table.jCalendar {
		border-width: 1px 1px 0 0;
	}
	table.jCalendar th,
	table.jCalendar td {
		padding: 3px 5px;
		border-width: 0 0 1px 1px;
	}
	table.jCalendar td {
		text-align: center;
	}				
	div.dp-popup button {
	/* prev/next month buttons */
		padding: 0;
		border: 0;
		margin: 0;
		background: none;
		width: auto;
	}	
	
	/* For the popup */
	

	div.dp-popup {
		position: relative;
		padding: 1px; /* DS, was 2px */
		/* width: 171px; DS, else shows bg color on RHS if too wide. Not sure if this is reqd by IE for positioning yet. */
		line-height: 1.2em;
	}
	div#dp-popup {
	/* note that this is appended to document.body so is not a child of .side-a */
		position: absolute;
		z-index: 199;
	}
	#t-legacy div.dp-popup h2,
	#t-booking div.dp-popup h2 {
		text-align: center;
		padding: 1px 0;	
		margin: 2px 0;		
	}
	a#dp-close {
		padding: 4px 0;
		text-align: center;
		display: block;
	}
	div.dp-popup button {
		padding: 3px 0;
	}	
	div.dp-popup button img {
		margin: 0;
	}	
	div.dp-popup div.dp-nav-prev,
	div.dp-popup div.dp-nav-next {
		position: absolute;
		top: 2px;
	}
	div.dp-popup div.dp-nav-prev {
		left: 2px;
	}
	div.dp-popup div.dp-nav-prev button {
		float: left;
	}
	/* Opera needs the rules to be this specific otherwise it doesn't change the cursor back to pointer after you have disabled and re-enabled a link */
	div.dp-popup div.dp-nav-prev button.disabled, 
	div.dp-popup div.dp-nav-next button.disabled,
	div.dp-popup buttona.disabled,
	div.dp-popup td.disabled {
		cursor: default;
	}
	div.dp-popup div.dp-nav-prev button.disabled, 
	div.dp-popup div.dp-nav-next button.disabled,
	div.dp-popup button.disabled {
		display: none; /* DS - why show them? */
	}	
	div.dp-popup div.dp-nav-next {
		right: 2px;
	}
	div.dp-popup div.dp-nav-next button {
		float: right;
	}
	
/*	
	@ font-family
  ---------------------------------------------------------------
*/			
	
	h1,
	h2,
	h3,	
	h4,
	p.h2inline,
	h2.topofpage,
	p.h3inline,
	h3.topofpage,
	#homeLink,
	a.homeLink,	
	.home:link,
	.home:visited,
	.home:visited:hover,
	.home:hover,
	.home:active,
	#dataTable th {	
	/* legacy > .home:active */
		font-family: Verdana, Arial, Helvetica, sans-serif;		
	}	
	p,
	p.b,
	table td,
	#middle ul,
	ol,
	#secondaryNav,			
	body,
	body#t-booking input,
	body#t-booking select,
	body#t-booking textarea,
	#topNavContainer li a,
	.middle_booking h2,	
	div.dp-popup h2,	
	.side-a .feedback .trip h3,		
	.middle_booking h3,	
	#t-booking #middle_home #news .item h3,
	.step-2 .sailing .table h4,	
	.middle_booking p.h3,		
	.middle_booking .hr-wrap p.h5,
	.step-2 .additions legend,
	.step-4 legend,
	.step-4 label,
	.step-4 h4,
	.step-4 #payment .terms p,
	#footer .nav button,
	div.dp-popup,
	div.dp-popup h2,
	div.dp-popup div.dp-nav-prev,
	div.dp-popup div.dp-nav-next {				
	/* legacy > #secondaryNav */	
		font-family: Arial, Helvetica, sans-serif;
	}	
	
/*	
	@ font-sizing
  ---------------------------------------------------------------
*/		
	
	html {
		font-size: 100.01%;
	}
	body {
		font-size: 76%;			
	}	
	#homeLink,
	a#dp-close {
	/* legacy > #homeLink */
		font-size: 11px; 
	}		
	#t-booking .step-4 input.cost {
		font-size: 1.6em;
	}	
	.middle_booking h2,
	.middle_booking h3,
	.middle_booking p.h3,		
	.middle_booking .hr-wrap p.h5,
	.step-2 .sailing .table h4,
	.step-2 .additions legend {	
		font-size: 1.5em;	/* 18px */
	}		
	body#t-legacy #middle,	
	body#t-legacy #middleFlushed,
	.side-a .feedback .trip h3 {	
		font-size: 1.3em; /* scale up , from 76% to legacy size */
	}			
	.step-2 .sailing .table h4 {
		font-size: 1.3em; /* 16px */
	}	
	#dataTable span.asterix,
	.side-a h2,
	#t-booking #middle_home #news h2,
	.step-2 .additions legend {	
	/* legacy > #dataTable span.asterix */	
		font-size:1.2em;
	}	
	#t-legacy h2 {
	/* blue heading on /experience/services.aspx */
		font-size: 1.15em;
	}
	h1,
	h2,
	p.h2inline,
	h2.topofpage,
	h3,
	p.h3inline,
	h3.topofpage,
	h4,
	.side-a .feedback .trip p,	
	.side-a .feedback .trip ul,
	#t-legacy div.dp-popup h2,
	#t-booking div.dp-popup h2 {	
	/* legacy > h4 */
		font-size: 1.1em;
	}	
	#content,
	input,
	select,
	textarea,
	#t-legacy #footer p,
	#topNavContainer li,
	.side-a p.add,
	.side-a .checkTimetables p,
	.side-a .feedback .trip p.action,
	#t-booking #middle_home #news .item h3,
	#t-booking #middle_home #news .item p,
	.step-2 .additions .inline-pair label,
	.step-4 .submit label,
	#footer .nav button,
	table.jCalendar td,
	.middle_booking td,
	.middle_booking tfoot th {	
	/* legacy > #content */	
		font-size: 1em; /* 12px */
	}		
	h3.topofpage,
	a.homeLink,
	.side-a ,
	.side-a p.add a,
	#t-booking #middle_home #news .item p,
	.middle_booking th,
	.middle_booking p.cancel,
	#t-booking .trip li strong,
	.middle_booking .hr-wrap p.required,
	.step-2 .sailing .table a,
	.step-3 th,
	#passengers td.assistance .special-assistance-1 label,	
	#passengers td.assistance .special-assistance-2 label,
	.step-4 legend,
	.step-4 label,
	.step-4 h4,
	.step-4 #payment .terms p,
	#footer {	
	/* legacy > a.homeLink */	
		font-size: 0.9em;
	}	
	h3,
	p.h3inline,
	h4,
	p.b,
	p,
	table td,
	#middle ul,
	ol,
	.returnLink a:link, 	
	.returnLink a:visited,
	.returnLink a:visited:hover,
	.returnLink a:hover, 
	.returnLink a:active,
	#dataTable th,
	div.dp-popup {  	
	/* legacy > .returnLink a:active */		
		font-size: 0.8em;
	}
		
	.rwc2011 p,
	#wrapper .rwc2011 ul {
		font-size: 0.75em;
		line-height: 1.5;
		margin-bottom: 1.5em;
	}
	#wrapper .rwc2011 ul {
		list-style-type: none;
		padding-bottom: 0;
		padding-left: 0;		
	}	

	
	#t-booking #middle ul,	
	#t-booking ol,
	#t-booking p,
	#t-legacy .side-a p {
		font-size: inherit;
	}	
	
/*	
	@ font weight/style, text-decoration
  ---------------------------------------------------------------
*/		
	
	h1,
	h2,
	p.h2inline,
	h2.topofpage,
	h3,
	p.h3inline,
	h3.topofpage,
	h4,	
	p.b,
	.titleBold,
	#homeLink,
	a.homeLink,	
	.home:link,
	.home:visited,
	.home:visited:hover,
	.home:hover,
	.home:active,	
	.homeLink a:link, 	
	.homeLink a:visited,
	.homeLink a:visited:hover,
	.homeLink a:hover, 
	.homeLink a:active,
	.titleBold,
	#secondaryNav,
	#dataTable th,
	#dataTable span,
	#dataTable span.asterix,
	#t-booking #middle_home #news .item h3,
	#t-booking #middle_home #news .item h3 a,
	.step-2 .sailing .table a,
	.step-2 .sailing .table td.price-c-checked,
	.step-2 .additions legend,
	.step-3 td.type,
	.step-4 legend,
	.step-4 label,
	.step-4 h4,
	#t-booking .step-4 input.cost,
	#tooltip dt,
	table.jCalendar th,
	#t-booking .step-2 .additions tfoot td,
	.middle_booking .warning a,
	.middle_booking .warning a:hover,
	.middle_booking .warning a:focus {
	/* legacy > titleBold */			
		font-weight:bold; 
	}	
	a:link,
	a:visited,
	a:hover,
	a:visited:hover,
	a:active,
	.returnLink a:link, 	
	.returnLink a:visited,
	.returnLink a:visited:hover,
	.returnLink a:hover, 
	.returnLink a:active,
	.middle_booking .hr-wrap p.h5,
	.step-4 h4 em,
	.step-4 .inline-pair label,	
	.step-4 span.pair label,
	.step-4 .inline-pair p,
	.step-4 .submit label,
	.middle_booking tfoot th {		
	/* legacy > .returnLink a:active */	 
		font-weight: normal; 
	}			
	.progress li em,
	.step-2 .sailing .table td em,
	.step-2 .additions td em,
	.step-4 h4 em {
		font-style: normal;
	}		

	a:link,
	a:visited,
	a:hover,
	a:visited:hover,
	a:active,
	.home:hover,	
	.home:visited:hover,	
	.homeLink a:link, 	
	.homeLink a:visited,
	.homeLink a:visited:hover,
	.homeLink a:hover, 
	.homeLink a:active,	
	.returnLink a:link, 	
	.returnLink a:visited,
	.returnLink a:visited:hover,
	.returnLink a:hover, 
	.returnLink a:active,
	div.dp-popup button,
	#topNavContainer li a,	
	#topNavContainer li:hover a,
	#topNavContainer li:focus a,		
	#topNavContainer li.sfhover a {	
	/* legacy > .returnLink a:active */		
		text-decoration: none; 		
	}		
	a.homeLink,	
	.home:link,
	.home:visited,
	.home:active,
	a#dp-close:hover,
	.side-a .checkTimetables p a,
	.side-a p.action a,
	#t-booking #middle_home #news .item p a,	
	.middle_booking p.cancel a,
	#footer a:hover,
	#footer a:focus,			
	#footer .nav .hover span,
	#t-booking #middle_home a:hover,
	#t-booking #middle_home a:focus,
	#t-booking .middle_booking a:hover,
	#t-booking .middle_booking a:focus,
	#t-booking .middle_booking #browser-check a {			
	/* legacy > .home:active */	 	
		text-decoration: underline;  
	}		
	.rwc2011 a:hover,
	.rwc2011 a:focus,
	.rwc2011 .warning a {
		text-decoration: underline;  
	} 
	div.dp-popup div.dp-nav-prev button, 
	div.dp-popup div.dp-nav-next button,
	div.dp-popup td,
	#t-booking submit input,
	#t-legacy submit input,
	.side-a .jq-dp,
	.side-a .set p.remover,
	.step-2 .sailing .table td.clickable,
	.step-2 .sailing .table td.clickable label,
	#footer .nav button,
	div.dp-popup button {		
		cursor: pointer;
	}	
	
/*	
	@ foreground/background colours
  ---------------------------------------------------------------
	Dark to light
	_______________________________________________________________
*/	

/*
	black/off-black
*/		
	
	div.dp-popup button,
	table.jCalendar td.dp-hover,
	table.jCalendar tr.activeWeekHover td,
	table.jCalendar td {	
		color: #000;
	}	
	.side-a,
	.side-a legend,	
	.middle_booking legend,
	#t-booking #middle_home #news .item p,
	.progress li em,
	.middle_booking,	
	.middle_booking h3,
	.middle_booking p.h3,	
	.middle_booking .hr-wrap h3,	
	.step-2 .sailing .table h4,
	.middle_booking .hr-wrap p.h5,	
	.confirmation p,		
	.step-2 .sailing p,
	.step-2 .additions p,
	.middle_booking th,
	.middle_booking td,
	.middle_booking tfoot,
	.middle_booking .hr-wrap p.required,
	.middle_booking .submit,
	.middle_booking .submit p,	
	.middle_booking p.cancel {	
		color: #1e1e1e;
	}		
	#tooltip dl,          	
	#tooltip dt, 	
	#tooltip dd { 	
		color: #272727;
	}		
	
/*
	grey
*/		
	
	h3,
	p.h3inline,
	h3.topofpage,
	h4,
	p.b,
	p {
	/* legacy > p */	
		color: #333; 
	}
	.titleBold,
	#dataTable span {
	/* legacy > #dataTable span */		
		color: #666;
	}	
	table.jCalendar td.today {
		background: #666; 	
	}			
	table.jCalendar td.disabled, table.jCalendar td.disabled.dp-hover {
		color: #888;
	}	
	.step-2 .additions td em,
	.step-2 .sailing .table td em,
	.middle_booking tfoot th,
	#t-booking .progress li {
		color: #8e8e8e;
	}			
	p,
	table td,
	#middle ul,
	ol,
	body {
	/* legacy > ol */		
		color: #4c5464; 
	}		
	#secondaryNav span {
	/* legacy > #secondaryNav span */				
		color: #b0b3b6;
	}		
	div.dp-popup a.disabled,
	table.jCalendar td.other-month {
		color: #aaa;
	}		
	.alt {
	/* legacy > .alt */			
		background-color: #eee;
	}		
	table.jCalendar td.other-month {
		background: #ddd;
	}	
	table.jCalendar td.disabled, 
	table.jCalendar td.disabled.dp-hover {
		background: #e9f0f4;
	}			
	
/*
	red
*/	
	
	.side-a .warning strong,
	.middle_booking .warning,
	.middle_booking .sailing .table div.warning p,
	.middle_booking #form-errors,
	.middle_booking #form-errors p,
	.middle_booking #browser-check,
	.middle_booking #browser-check p,
	#t-booking .middle_booking .warning a,
	.rwc2011 .warning h4,
	.rwc2011 .warning p,
	.rwc2011 .warning a:link,
	.rwc2011 .warning a:visited,
	.rwc2011 .warning a:hover,
	.rwc2011 .warning a:focus,
	.rwc2011 .warning a:active {		
		color: #9f0202; 
	}			
	#dataTable span.asterix{ 
	/* legacy > #dataTable span.asterix */		
		color: #c00; 
	}		
	table.jCalendar tr.selectedWeek td {
		background: #f66;
	}		
	
/*
	orange
*/		
	
	a:link,
	a:visited,
	a:hover,
	a:visited:hover,
	a:active,	
	.home:link,
	.home:hover,
	.home:active,	
	.homeLink a:link, 	
	.homeLink a:visited,
	.homeLink a:active,	
	.returnLink a:link, 	
	.returnLink a:visited,
	.returnLink a:active,
	#t-legacy .side-a #homeLink a,
	.side-a #homeLink a {  
	/* legacy > .returnLink a:active */			
		color: #cd6306;
	}	
	.rwc2011 a:link,
	.rwc2011 a:visited,
	.rwc2011 a:hover,
	.rwc2011 a:visited:hover,
	.rwc2011 a:active {				
		color: #014a7c;
	}	
	#topNavContainer li li a {		
		background: #dd9406;
	}		
	
/*
	blue
*/		
	
	#t-booking #middle_home #news .item h3 a,	
	.middle_booking h2,
	.middle_booking .trip .hr-wrap h3,
	.step-2 .additions legend,
	.progress li strong,
	#t-booking .step-4 input.cost {
		color: #00abcd;
	}		
	div.dp-popup {
		background: #00abcd;
	}		
				
	a:hover,
	a:visited:hover,	
	.home:visited,
	.home:visited:hover,	
	.homeLink a:hover,	
	.homeLink a:visited:hover,	
	.returnLink a:visited:hover,
	.returnLink a:hover {  
	/* legacy > .returnLink a:hover */			
		color: #0a98d6;
	}			
	h2,
	p.h2inline,
	h2.topofpage {
	/* legacy > h2.topofpage */
		color: #0b92cc;
	}		
	#topNavContainer li a:hover,
	#topNavContainer li a:focus,
	#topNavContainer li a.sffocus {	
		color: #94d4f0;
	}			
	#t-booking #middle_home #news .item p a,
	#t-booking a,
	#t-legacy .side-a a,
	#t-legacy #footer a,
	#footer p#ssLogo a {	
		color: #014a7c; 
	}	
	#footer p.copyright {	
		color: #011353;
	}		
	#footer .nav a,
	#footer .nav .a {	
		color: #02497d;
	}	
	#footer .nav a,
	#footer .nav .a {	
		border-color: #02497d;
	}		
	.step-2 .sailing .table .loader {
		background: #cceef5;
	}			
	#t-booking .step-2 .sailing .table th.price-a {
		border-color: #cceef5;		
	}			
	#t-booking .step-2 .sailing .table th.price-b,
	#t-booking .step-2 .sailing .table td.price-b-checked {	
		background-color: #88d8e8;
	}	
	#t-booking .step-2 .sailing .table th.price-b {
		border-color: #88d8e8;
	}		
	#t-booking .step-2 .sailing .table th.price-c,
	#t-booking .step-2 .sailing .table td.price-c-checked {	
		background-color: #12b1d1; 
	}			
	#t-booking .step-2 .sailing .table th.price-c {
		border-color: #12b1d1;
	}		
	#t-booking .side-a ,
	#t-legacy .side-a ,	
	#t-booking .side-a .trip,
	#t-booking .step-2 .additions .odd td,
	#t-booking .step-3 td,
	table.jCalendar td.dp-hover,
	table.jCalendar tr.activeWeekHover td,
	.step-2 .sailing .table {
		background-color: #e6f7fa; 
	}		
	#t-booking .step-2 .sailing .table td,
	#t-booking .step-2 .sailing .table td.price-a,
	#t-booking .step-2 .sailing .table td.price-b,
	#t-booking .step-2 .sailing .table td.price-c {
		border-color: #e6f7fa;
	}		
	#t-booking .step-2 .sailing .table .first td {	
		border-top-color: #fff;
	}	
	#t-booking .step-2 .additions td,
	#t-booking .step-3 .odd td {
		background-color: #f3fbfd; 
	}		
	#t-booking .step-2 .sailing .table th {
		background-color: #f2fbfd;	
	}	
	#dataTable th { 
	/* Changed by Equinox: URL location changed */	
		background-color: #0e88cd; 
	}		
	table.jCalendar th {
		background: #66c5dc;
	}			
	#topNavContainer .liner {
		background-color: #0c92d8; 	
	}	
	table.jCalendar td {
		background: #d1eff7;	
	}		
	.side-a h2,
	#t-booking #middle_home #news h2 {
		background-color: #6ed0e3; /* sampled from vert center of image text */
	}	
	#t-booking .step-2 .sailing .table th.price-a,
	#t-booking .step-2 .sailing .table td.price-a-checked {	
		background-color: #d0eff6;
	}	
	#footer {
		background-color: #ecfafd;
	}		
	#t-booking .step-2 .additions .odd td {
		border-color: #dcf3f8;
	}		
	#topNavContainer li a,
	#topNavContainer li.nav-7 {
		border-color: #cceff5;
	}	
	#t-booking .step-2 .additions tfoot td {
		border-color: #b7e7f1;
	}	
	
/*
	green
*/		
	
	#t-booking .step-2 .sailing .table a {
		color: #7a9c1f;
	}	
	#t-booking .step-2 .sailing .table li.disabled a {
		color: #8e8e8e;
		cursor: not-allowed;
	}		
	#t-booking .step-2 .sailing .table li.disabled a,
	#t-booking .step-2 .sailing .table li.disabled a:hover,
	#t-booking .step-2 .sailing .table li.disabled a:focus {
		text-decoration: none;
	}		
	table.jCalendar td.selected {
		background: #bad966;
	}		
	table.jCalendar td.selected.dp-hover {
		background: #88b607;
	}		
	
/*
	yellow
*/		
	
	#tooltip {	
		background-color: #ffffc3;	  
	}		
	#topNavContainer li li a:hover,
	#topNavContainer li li a:focus,
	#topNavContainer li li a.sffocus {		
		background: #e5c036;	
	}		
	
/*
	white
*/			

	#dataTable th,
	div.dp-popup h2,
	div.dp-popup div.dp-nav-prev button,
	div.dp-popup div.dp-nav-next button,
	#topNavContainer li a,
	table.jCalendar td.today,
	table.jCalendar td.selected,
	table.jCalendar td.selected.dp-hover,
	table.jCalendar tr.selectedWeek td,
	.side-a h2,
	#t-booking #middle_home #news h2,
	table.jCalendar th,
	#t-booking .step-2 .sailing .table th.price-c,
	#t-booking .step-2 .sailing .table td.price-c-checked,
	#topNavContainer li li a:hover,
	#topNavContainer li li a:focus,
	#topNavContainer li li a.sffocus {				
	/* legacy > #dataTable th */			
		color: #fff;
	}
	body,
	#wrapper,	
	.middle_booking th,
	.middle_booking td,
	#t-booking .step-2 .additions tfoot th,
	#t-booking .step-2 .additions tfoot td,	
	#t-booking .step-4 input.cost,
	#t-legacy .side-a #homeLink,
	.side-a #homeLink,	
	.side-a .checkTimetables {
		background-color: #fff;								
	}		
	.side-a h2,
	#t-booking #middle_home #news h2,
	#t-booking .side-a .trip .liner,
	#t-booking .step-2 .sailing .table table,
	#topNavContainer .liner,
	#topNavContainer li li a {	
		border-color: #fff;
	}