/*

Site wide styles

These styles are shared between the ecom and www sites, ONLY include styles here if they are to 
be used on both sites. Ecom has an id of "ECOM" set on the body tag so you can use that to
set any ecom only styles or to over-write any styles you need too (such as different urls for backgrounds etc.)
these over-written rules should all appear at the bottom of the doc, name spaced with the ECOM id and 
should be safe to include on www too.

Table of contents
~~~~~~~~~~~~~~~~~

- Standard Generic tag setup
	- Body
	- Titles
	- Links
	- Forms
	- Lists
- Tabs
- Paging
- Useful classes
- JS Related Goodness
- ECOM over-writes

*/

/******************************************************

Standard Genric tag setup

******************************************************/

body {
	margin			: 0;
	border			: none;
	padding			: 0;
	background: 	#036 url(/siteimages/shared/backgrounds/body-background-wide.jpg) center top repeat-y !important;
	position		: relative;
	overflow-x: hidden;
}


div .hide,
.printonly {
	display			: none;
}

#wrapper {
	position		: relative;
	margin			: 0 auto;
	width			: 1000px;
	text-align		: left;
	border			: 0;
	overflow		: hidden;
	padding			: 0 0 75px;
	background		: #fff;
}

/* START : Styles for new homepage grid layout */
#twoColContent {
	overflow: hidden;
	clear: both;
	border-bottom: 1px solid #fff;
	margin-bottom: 15px;
	float: left;
	width: 1000px;
}

#twoColContent #leftContent,
#twoColContent #primaryContent {
	float: left;
	display: inline;
	padding: 0;
	margin: 0;
}

#twoColContent #leftContent,
#twoColContent #rightContent {
	width: 255px;
}	

#twoColContent #primaryContent {
	width: 720px;	
	margin: 0 0 0 25px;
}

/* Short term hack for no possible gain at client request #13214 */
body#compact {
	background: #fff !important;
	}

body#compact #wrapper {
	width: 930px !important;
	}

body#compact #twoColContent {
	width: 100% !important;
	}

body#compact #twoColContent #primaryContent {
	width: 650px;
	}
	
body#compact .side_box#geoIcons #geoIconsAlign, 
body#compact .informationIcons {
	text-align: left !important;
	}
	
body#compact blockquote.our_opinion {
	margin: 15px 0 !important;
	}	
	
#oneColContent #primaryContent {
	width: 1000px;
	margin: 0;
	clear: both;
}	

/*** Titles ****/
#right_content h1,
#right_content h2.bookings,
#right_content h3.bookings {
	/*font: bold 14px Arial, Helvetica, sans-serif;
	line-height: 145%;*/
	border-bottom: 1px solid #A0BEDD;
	/*padding: 0 0 3px 0;
	margin: 0 0 10px 0;*/
	clear: both;
}	

.flexchoicelogo {
	margin-left: 20px;
	}

#right_content h1	{
	/*font-size: 18px;
	letter-spacing: -1px;*/
}
	
#right_content h3.bookings	{
	/*font-size: 12px;*/
}
	
h2 a {
	font-weight		: bold;
	text-decoration		: none;
}
	
h2 a.normal {
	font-weight		: normal;
	text-decoration		: underline;
}
	
h4 {	
	position		: relative;
	display			: block;
	padding			: 8px 12px 5px 0;
	color			: #8190A9;
	border			: none;
}



/*** Links ****/

a {
	text-decoration		: underline;
	color			: #2B3879;
	font-weight		: normal;
}

a:hover {
	color			: #FF7812;
	text-decoration	: underline;
}
	
	

/*** Forms ****/

	
form {
	margin			: 0;
	padding			: 0;
}

input {
	padding			: 2px;
	font-size		: 100%;
	vertical-align	: middle;
}

input.button {
	cursor			: pointer;
}

.button {
	margin			: 5px;	
	border			: none;
}

select {
	margin			: 0;
	padding: 2px;
}

/*** Lists ****/

ul.nobullets {
	list-style		: none;
	margin			: 0;
	padding			: 2px 2px 2px 0;
	border			: none;
}

.nobullets li {
	list-style		: none;
	padding-bottom	: 4px;
}


.side_box ul
{
	list-style-type	: none;
	margin			: 0;
	margin-top		: 3px;
	padding			: 0;
	padding-left	: 10px;
}

dl {
	margin			: 0;
}

dt {
	color: #444;
	margin: 10px 0 5px 0;
	font-weight: bold;
	font-size: 		13px;
}
	
dd {
	margin-left		:0;
	line-height: 165%;
}

#contactForm {
	float: left;
	width: 720px;
	margin-right: 25px;
	margin-bottom: 50px;
	}

#contactForm p {
	float: left;
	width: 720px;
	display: block;
	}

#contactForm p label {
	font-weight: bold;
	padding-top: 2px;
	float: left; 
	width: 150px;
	}

#contactForm p input,
#contactForm p select {
	width: 200px;
	}
 
#contactForm p textarea {
	width: 500px;
	overflow: auto;
	}
	
#contactForm #contactSubmit {
	margin-left: 150px;
	}	
 
#contactAddress {
	padding: 0;
	margin:0;
	}

#contactAddress li {
	list-style: none;
	}

#contactNumbers {
	margin: 0 0 25px 0;
	width: 720px;
	overflow: hidden;
	}	

#contactNumbers dd {
	font-size: 13px;
	font-weight: bold;
	margin-bottom: 10px;
	}	

#contactNumbers dt {
	font-weight: normal;
	font-size: 12px;
	margin: 0 0 3px 0;
	}
	
#contactNumbers dt.contactNumbersNumber {
	margin: 0 0 10px 0;
	font-size: 14px;
	font-weight: bold;
	}	
	
#contactNumbers dt span {
	float: right;
}	

#contactNumbers div {
	width: 318px;
	min-height: 100px;
	padding: 15px;
	margin: 0 20px 20px 0;
	float: left;
	display: inline;
	background: #F9F9FB;
	border: 1px solid #A0BEDD;
	}
	
#contactNumbers div.no-margin {
	margin-right: 0;
	}	


/****************************************

Tabs

You can currenty have up to 10(!!!!) tabs per page and you build them like so:


<div class="tab_wrapper" id="show_tab1">
	<ul class="in_page_tabs" >
		<li class="tab1"><a href="">Destination Profile</a></li>
		<li class="tab2"><a href="">Images</a></li>
		...
		<li class="tab6"><a href="">Other useful info</a></li>
	</ul>

	<div class="in_page_tab_content tab1">
		Tab 1's content
	</div>

	<div class="in_page_tab_content tab2">
		Tab 2's content
	</div>
	...
	<div class="in_page_tab_content tab6">
		Tab 3's content
	</div>
</div>

Note: Switch the id of the wrapper div to match the tab you want to show

****************************************/


.tab_wrapper {
	margin				: 0;
	margin-top			: 20px;
	padding				: 0;
	position			: relative;
	clear				: right;
	overflow			: auto;
}

.in_page_tab_content {
	display				: none;
	position			: relative;
}

ul.in_page_tabs {
	_height				: 1%;
	margin				: 0 0 15px 0;
	list-style			: none;
	padding				: 0;
	background			: url(/siteimages/shared/backgrounds/tabs_ul_background.gif ) repeat-x bottom left;
	overflow			: hidden;
}

ul.in_page_tabs li {
	float				: left;
	margin				: 0;
	padding				: 0;
}

ul.in_page_tabs a {
	float				: left;
	display				: block;
	margin				: 0 2px 0 0;
	padding				: 4px 8px 5px 8px;
	color				: #fff;
	text-decoration		: none;
	border: 1px solid #A0BEDD;
	border-bottom		: none;
	background			: #8DB1EF;
	font-weight			: bold;
}
	
ul.in_page_tabs a:hover {
}

/* settings for selected tab */
div.tab_wrapper a:hover,
div.tab_wrapper a.selected,
/* ids for media box... */
div.tab_wrapper#show_tab1 li.tab1 a,
div.tab_wrapper#show_tab2 li.tab2 a,
div.tab_wrapper#show_tab3 li.tab3 a,
div.tab_wrapper#show_tab4 li.tab4 a,
div.tab_wrapper#show_tab5 li.tab5 a,
div.tab_wrapper#show_tab6 li.tab6 a,
div.tab_wrapper#show_tab7 li.tab7 a,
div.tab_wrapper#show_tab8 li.tab8 a,
div.tab_wrapper#show_tab9 li.tab9 a,
div.tab_wrapper#show_tab10 li.tab10 a,
/* classes for everything else */
div.tab_wrapper.show_tab1 li.tab1 a,
div.tab_wrapper.show_tab2 li.tab2 a,
div.tab_wrapper.show_tab3 li.tab3 a,
div.tab_wrapper.show_tab4 li.tab4 a,
div.tab_wrapper.show_tab5 li.tab5 a,
div.tab_wrapper.show_tab6 li.tab6 a,
div.tab_wrapper.show_tab7 li.tab7 a,
div.tab_wrapper.show_tab8 li.tab8 a,
div.tab_wrapper.show_tab9 li.tab9 a,
div.tab_wrapper.show_tab10 li.tab10 a
{
	padding-bottom		: 5px;
	background-color	: #fff;
	color				: #373C89;
	text-decoration		: none;
}

/* settings for selected tab content div */
div.tab_wrapper.show_tab1 div.tab1,
div.tab_wrapper.show_tab2 div.tab2,
div.tab_wrapper.show_tab3 div.tab3,
div.tab_wrapper.show_tab4 div.tab4,
div.tab_wrapper.show_tab5 div.tab5,
div.tab_wrapper.show_tab6 div.tab6,
div.tab_wrapper.show_tab7 div.tab7,
div.tab_wrapper.show_tab8 div.tab8,
div.tab_wrapper.show_tab9 div.tab9,
div.tab_wrapper.show_tab10 div.tab10 
{
	display				: block;
	z-index				: 4999;
}


/******************************************************

Paging for WWW only

******************************************************/

.paging-controls {
	text-align			: center;
	margin				: 10px 0 10px;
}

.paging-controls a {
	margin-left: 5px;
}

.paging-navigation {
	font-weight			: bold;
}

	

/******************************************************

Useful classes

******************************************************/

.hidden {
	display				: none;
}
	
.breadcrumbs {
	border				: none;
	padding				: 7px 7px 7px 0;
}
	
/* Hide anything wrapped in this from view of users NOT using a screen reader, not for SEO purposes, purely for Accessibility */
.aural_only {	
	position			: absolute;
	left				: -9999px;
}

/* draw a box around something you want to raise attention for */
.info_highlight {
	margin				: 0 0 15px;
	border				: 1px solid #8BAED6;
	background			: #EDF3FA;
	padding				: 10px 5px;
	line-height: normal;
	clear:				both;
	display: block;
}
	
.left {
	float				: left;
}

.right {
	float				: right;
} 	
	
	

/******************************************************

JS Related Goodness

******************************************************/

/*

Assign this to anything that you don't want visible until all the JS has fired. 
Our JS will then REMOVE this class from any elements marked with it so they "should" 
then take their natural place in the page.

*/
.visibleOnDomReady {
	visibility		: hidden;
}

.isJS {
	/*
	This class is used to highlight elements that are using in our 
	javascript, be VERY careful when modifying them, their ids, 
	removing classes adding inline styles etc.
	*/	
}

.slider {
	display			: none;
	margin-left: 0 !important;
}
	

/* Handy div for rendering messages out to the user about Ajax requests etc */

/* Old notify class - deprecated, needs retiring soon */
.Notify {
	background-color	: #C1D2FB;
	border			: 1px dashed #061781;
	padding			: 10px;
	margin			: 5px 0;
	color			: #000;
	display			: none;
	text-align		: center;
}	

/* New notify goodies for the notify bar in the header */

.NotifyHeader {
	position: fixed;
	top: 0;
	left: 0;
	background: transparent url(/siteimages/shared/backgrounds/notification-bar-background.png);
	float: left;
	width: 100%;
	margin: 0;
	padding: 10px;
	z-index: 100;
	border-bottom: 2px solid #fff;
}	
	
.NotifyHeader #NotifyMsg {
	width: 980px;
	margin: 0 auto;
}	

.NotifyHeader #NotifyMsg p {
	font-size: 16px;
	color: #fff;
	padding: 0;
	margin: 5px 0;
	float: left;
	width: 880px;
	display: inline;
}	
	
.NotifyHeader a {
	color: #ddd;
}

.NotifyHeader #NotifyMsg .NotifyHighlight {
	font-weight: bold;
	background: #fff;
	padding: 0 2px;
	color: #036;
}

.NotifyHeader #NotifyMsg #closeNotify {
	float: right;
	width: auto;
	text-align: right;
}

.NotifyHeader #NotifyMsg #closeNotify a {
	color: #eee;
	font-weight: bold;
}


/* Case 13437 - New modal window */
#modalWindow { 
	border:			2px solid #8DB1EF;
	background:		#fff;
	padding: 		20px;
	margin:			0 auto;
	width: 			455px;
	text-align:		center;
	overflow: 		hidden;

	-moz-box-shadow: 		0 0 8px #fff, 0 0 6px #444;
  	-webkit-box-shadow: 	0 0 8px #fff, 0 0 6px #444;
  	box-shadow: 			0 0 8px #fff, 0 0 6px #444;

	-moz-border-radius: 	5px;
	-webkit-border-radius: 	5px;	
	border-radius:			5px;
}

/* New modal window with giant graphic */
#modalWindow.imageModal {
	background: 	none;
	border:			0;
	padding: 		0;
	width: 			856px;
	height: 		605px;
	border:			2px solid #fff;
	position: 		relative;

	-moz-box-shadow: 		none;
  	-webkit-box-shadow: 	none;
  	box-shadow: 			none;

	-moz-border-radius: 	0;
	-webkit-border-radius: 	0;	
	border-radius:			0;
	}
	
#modalWindow.imageModal .modalWindowSpinner {
	position: absolute; 
	top: 0;
	left: 413px;
	padding: 7px;
	width: 16px;
	height: 16px;
	background: #fff url(../siteimages/shared/ajax/spinner.gif) center center no-repeat;
	text-indent: -9999em;
	
	-webkit-border-bottom-right-radius: 5px;
	-webkit-border-bottom-left-radius: 	5px;
	-moz-border-radius-bottomright: 	5px;
	-moz-border-radius-bottomleft: 		5px;
	border-bottom-right-radius: 		5px;
	border-bottom-left-radius: 			5px;
	}	

.ie6 #modalWindow.imageModal .modalWindowSpinner,
.ie7 #modalWindow.imageModal .modalWindowSpinner {
	display: none;
	}

#modalWindow p {
	text-align:		center;
	color:			#036;
	}
	
#modalWindow #modalAction {
	font-size: 		13px;
	padding-bottom: 10px;
	margin-bottom: 	30px;
	border-bottom:  1px solid #8DB1EF;
	}	
	
#modalWindow #modalAction strong {
	text-transform:	uppercase;
	}	
	
#modalWindow #modalAction img {
	margin-right: 	4px;
	}	
	
#modalWindow #modalFact,
#modalWindow #modalDontTouch {
	font:			bold 28px/125% Cambria, Georgia, Times New Roman, Serif;
	letter-spacing: -1px;
	padding-bottom: 30px;
	border-bottom:  1px solid #8DB1EF;
	}	
	
#modalWindow #modalTip {
	font: 			14px/100% Arial, Helvetica, sans-serif;
	letter-spacing: normal;
	text-transform: uppercase;
	color: 			#999;
	display:		block;
	margin-bottom: 	15px;
	}	
	
#modalWindow #modalCancel {
	clear: 			left;
	display: 		block;
	margin-top:		10px;
	margin-bottom: 	-10px;
}

#modalWindow #modalCancel a {
	cursor: 		pointer;
	letter-spacing: normal;
	font-size: 		11px !important;
	text-decoration:none !important;
} 	

/*#modalWindow .modalAwards {
	margin-top: 	10px;
	float: 			left;
	width: 			455px;
	}
	*/
#modalWindow .modalAwards img {
	margin-right: 	19px;
	} 	

#modalWindow .modalAwards img#modalAwardLast {
	margin-right: 	0;
	} 	
	
#modalWindow #modalAtol,
#modalWindow #modalAwards,
#modalWindow #modalAirlines {
	float: left;
	width: 100%;
	padding-bottom: 10px;
	border-bottom:  1px solid #8DB1EF;
	}

#modalWindow #modalAwards, 
#modalWindow #modalAirlines {
	padding-top: 10px;
	}

#modalWindow #modalAirlines {
	border-bottom: 0;
	}

#modalWindow #modalAtol img {
	margin: 0 0 10px 0;
	}

#modalWindow #modalAwards img {
	margin-right: 19px;
	}
	
#modalWindow #modalAwards img#modalAwardLast {
	margin-right: 0;
	}

#modalWindow #modalAtol p,
#modalWindow #modalAwards p, 
#modalWindow #modalAirlines p {
	text-align: left;
	color: #525F79;
	font-size: 11px;
	margin-bottom: 5px;
	}	
	
#modalWindow #modalAtol p strong,
#modalWindow #modalAwards p strong, 
#modalWindow #modalAirlines p strong {
	font-size: 13px;
	}	

#modalWindow #modalAirlines img {
	margin: 0;
	padding: 0;
	display: inline;
	float: left;
	
	}
/* Case 13437 - New modal window */



/* Modal loading box, "Please wait" */
.ModalContent,
#ModalContent,
#ModalAlert {
	background		: #fff;
	border			: 2px solid #8DB1EF;
	padding			: 10px;
	width			: 260px !important;
	overflow		: hidden;

	-moz-border-radius: 5px;
	-webkit-border-radius: 5px;	
	-moz-box-shadow: 3px 3px 3px #444;
	-webkit-box-shadow: 3px 3px 3px #444;
}

#ModalAlert {
	position: 		relative;
	padding			: 10px 15px 15px 15px;
}
	
#ModalAlert #ModalAlert_close_button {
	float: right;
	position: absolute;
	right: 5px;
	top: 5px;
	padding: 0 3px 4px 3px;
	width: 10px;
	height: 12px;
	text-align: center;
/*	background: #ccc;
	border: 1px solid #aaa;*/
	margin: 0;
	
	-moz-border-radius: 2px;
	-webkit-border-radius: 2px;		
}	

#ModalAlert #ModalAlert_close_button a {
	color: #ccc;
	font-weight: bold;
	text-decoration: none;
}

#ModalAlert #ModalAlert_close_button span {
	position: absolute;
	right: 3px;
	top: 3px;
	width: 8px; 
	height: 8px;
	text-align: center;
}		

.ModalContent p,
#ModalContent p,
#ModalAlert p {
	text-align		: left;
	/*font-size		: 11px;*/
	padding			: 0;
	margin			: 0 0 20px 0;
	line-height		: 135%;
}

.ModalContent h2,
#ModalContent h2,
#ModalAlert h2 {
	/*font-size		: 12px;*/
	margin			: 0 0 10px 0	;
}

.ModalContent p#ModalContentLoader,
#ModalContent p#ModalContentLoader,
#ModalAlert p#ModalContentLoader {
	font-weight		: bold;
}

#ModalContentAtol {
	padding-top		: 15px;
	border-top		: 1px solid #eee;	
}

#ModalContentAtol img {
	float			: left;
	margin			: 0 10px 0 0;
}

#ModalContentAtol p {
	text-align		: left;
	color			: #666;
	margin-bottom	: 5px;
}

#ModalContentAtol p strong {
	color			: #373C89;
	/*font-size		: 11px;*/
	line-height		: 20px;
}

#ModalAlert #ModalAlert_buttons p {
	margin-bottom: 5px;
}

.SummaryBox h4 {
	position		: inherit;
}

/* Disqus */
#disqus_thread {
	border-top: 1px solid #036;
	margin-top: 25px;
	padding-top: 10px;
	}
	
#disqus_thread h3 {
	border: 0;
	}	

#dsq-dislike-thread-button,
.dsq-global-toolbar-dropdown-container{
	display: none;
	}
	
/* Disqus left col latest comment styles */
.sidebar-panel .dsq-widget-item {
	border-bottom: 1px solid #A0BEDD;
	padding-bottom: 7px;
	margin-bottom: 7px;
	}
	
	.sidebar-panel .dsq-widget-item:last-child {
		border-bottom: 0;
		padding-bottom: 0;
		margin-bottom: 0;
		}	

.sidebar-panel .dsq-widget-item img.dsq-widget-avatar {
	margin: 0 10px 5px 0;
	border: 1px solid #A0BEDD;
	padding: 1px;
	background: #fff;
	}
	
.sidebar-panel .dsq-widget-item .dsq-widget-comment	 {
	margin-bottom: 7px;
	float: left;
	clear: both;
}
	
.sidebar-panel .dsq-widget-item .dsq-widget-meta {
	font-size: 11px;
	line-height: 1.25;
	}
/* START : Holiday Comment System */	
#comment-thread {
	margin: 0 0 25px 0;
	padding: 0;
	}
	
#comment-thread .comment-entry {
	border-bottom: 1px solid #CFDEEE;
	margin-bottom: 15px;
	list-style: none;
	overflow: hidden;
	clear: both;
	}	

#comment-thread .comment-entry li,
#comment-thread .comment-entry li li {
	border: 0;
	}
	
#comment-thread .comment-entry.comment-olympic {
	/*border: 1px solid #CFDEEE;
	background: #F3F7FB;
	padding: 15px;*/
	}	
	
#comment-thread .comment-reply {
	padding-left: 40px;
	background: url(../siteimages/shared/icons/comment-reply-arrow.png) 5px top no-repeat;
	}	
	
#comment-thread .comment-photo-gallery li, 
#comment-thread .comment-meta li {
	float: left;
	display: inline;
	list-style: none;
	}
	
#comment-thread .comment-meta {
	overflow: hidden;
	margin: 0 0 15px 0;
	padding: 0
	}

#comment-thread .comment-meta li {
	margin-right: 15px;
	}
	
#comment-thread .comment-meta li a {
	font-size: 11px;
	}	
	
#comment-thread .comment-user {
	float: left;
	width: 100%;
	margin-bottom:10px;
	padding: 3px 0;
	background: #fff;
}	

#comment-thread .comment-user img {
	float: left;
	display: inline;
	margin-right: 15px;
	border: 1px solid #CFDEEE;
	padding: 3px;
	background: #fff;
	}

#comment-thread .comment-user span {
	float: left;
	display: inline;
	font-size: 13px;
	margin-top: 7px;
	}
	
#comment-thread .comment-entry.comment-olympic .comment-user span {
	margin-top: 22px;
	font-size: 14px;
	font-weight: bold;
	}	

#comment-thread .comment-photo-gallery {
	display: block;
	overflow: hidden;
	clear: both;
	padding: 0;
	margin: 0 0 15px 0;
	}

#comment-thread .comment-photo-gallery li {
	margin-right: 4px;
	}
	
#comment-thread .comment-photo-gallery li img {
	border: 1px solid #CFDEEE;
	padding: 3px;
	background: #fff;
	}
	

/* END : Holiday Comment System */
	
/******************************************************

ECOM over-writes

******************************************************/

#ECOM {}