/* For elements which only appear on inside pages */
/* Content, if there's a three column layout */
div#content {
	width: 516px;
	border-top: solid 1px white;
}

/* Content, if there's a two column layout */
div#contentwide {
	width: 736px;
	border-top: solid 1px white;
}
	/* Headings */
	#content h1, #contentwide h1 {
	    color:black;
	    font-size:160%;
		font-weight:bold;
		padding: 0;
		margin: 0 0 10px 10px;
		width: auto;
	}
	#content h1 {
		margin: 0 10px 10px 10px;
	}
	/* This floats left along with the fieldset below */
	#contentwide h1#breakhead {
		width: 518px;
		width: 495px;
		float: left;
		padding-bottom: 12px;
	}
	strong.intro {
		font-weight: normal;
		font-size: 120%;
		line-height: 1.4em;
	}
	/* Used on paragraphs, and above */
	.intro {
		color: #656565;	
	}
	/* A simple two-column layout, used for forms */
	#content dl, #content dt, #content dd, #contentwide dl, #contentwide dt, #contentwide dd {
		margin: 0;
		padding: 0;
	}
	#content dl, #contentwide dl {
		padding: 0 10px;
		clear: both;
		border-top: solid 1px white;
	}
		#content dt, #content dd, #contentwide dt, #contentwide dd {
			float: left;
			padding: 0 0 0.3em 0;
		}
		#content dt, #contentwide dt {
			width: 200px;
			font-weight: bold;
		}
		#content dd, #content dd select, #content dd textarea {
			width: 296px;
		}
		#content dd input {
			width: 290px;
		}
		#content dd span input {
			width: auto;
		}
		/* Buttons */
		#content dd input.button, #contentwide dd input.button {
			width: auto;
		}
		#contentwide dd, #contentwide dd input, #contentwide dd select, #contentwide dd textarea {
			width: 516px;
		}
	/* Table rules */
	#content table {
		width: 516px;
	}
	#contentwide table {
		width: 736px;
	}
	#fold th, #fold td, #fold caption {
		vertical-align: top;
		text-align: left;
	}
	#fold th, #fold td {
		padding: 2px 5px 0 5px;
	}
	#fold caption {
		font-weight: bold;
		font-size: 100%;
	}
	#fold thead th, #fold thead td {
		background: #900;
		color: white;
	}
	#fold tbody th, #fold th {
		background: #999;
		color: white;
	}
	#fold tbody td, #fold td {
		background: white;
		color: black;
	}
	#fold table p {
		margin: 0 0 2px 0;
	}
	/* This is used to add emphasis to stuff with a background colour */
	.importantlightblue, .importantaqua, .importantred, .importantmulberry, .importantpurple, .importantbrown, .importantblack, .importantyellow, .importantorange, .importantgreen, .importantmushroom {
		margin: 0 0 10px 0;
		padding: 10px 0 0 0;
	}
	/* Darker colours */
	.importantaqua, .importantred, .importantmulberry, .importantpurple, .importantbrown, .importantblack, .importantgreen, .importantmushroom, #content .importantaqua h1, #content .importantred h1, #content .importantmulberry h1, #content .importantpurple h1, #content .importantbrown h1, #content .importantblack h1, #content .importantgreen h1, #content .importantmushroom h1, #content .importantaqua h2, #content .importantred h2, #content .importantmulberry h2, #content .importantpurple h2, #content .importantbrown h2, #content .importantblack h2, #content .importantgreen h2, #content .importantmushroom h2, #content .importantaqua h3, #content .importantred h3, #content .importantmulberry h3, #content .importantpurple h3, #content .importantbrown h3, #content .importantblack h3, #content .importantgreen h3, #content .importantmushroom h3, #content .importantaqua h4, #content .importantred h4, #content .importantmulberry h4, #content .importantpurple h4, #content .importantbrown h4, #content .importantblack h4, #content .importantgreen h4, #content .importantmushroom h4, #content .importantaqua h5, #content .importantred h5, #content .importantmulberry h5, #content .importantpurple h5, #content .importantbrown h5, #content .importantblack h5, #content .importantgreen h5, #content .importantmushroom h5, #content .importantaqua h6, #content .importantred h6, #content .importantmulberry h6, #content .importantpurple h6, #content .importantbrown h6, #content .importantblack h6, #content .importantgreen h6, #content .importantmushroom h6, .importantaqua a, .importantred a, .importantmulberry a, .importantpurple a, .importantbrown a, .importantblack a, .importantgreen a, .importantmushroom a {
		color: white;
	}
	
	/* This is the longest multiple selector I've ever written */
	#content .importantlightblue h1, #content .importantaqua h1, #content .importantred h1, #content .importantmulberry h1, #content .importantpurple h1, #content .importantbrown h1, #content .importantblack h1, #content .importantyellow h1, #content .importantorange h1, #content .importantgreen h1, #content .importantmushroom h1, #content .importantlightblue h2, #content .importantaqua h2, #content .importantred h2, #content .importantmulberry h2, #content .importantpurple h2, #content .importantbrown h2, #content .importantblack h2, #content .importantyellow h2, #content .importantorange h2, #content .importantgreen h2, #content .importantmushroom h2, #content .importantlightblue h3, #content .importantaqua h3, #content .importantred h3, #content .importantmulberry h3, #content .importantpurple h3, #content .importantbrown h3, #content .importantblack h3, #content .importantyellow h3, #content .importantorange h3, #content .importantgreen h3, #content .importantmushroom h3, #content .importantlightblue h4, #content .importantaqua h4, #content .importantred h4, #content .importantmulberry h4, #content .importantpurple h4, #content .importantbrown h4, #content .importantblack h4, #content .importantyellow h4, #content .importantorange h4, #content .importantgreen h4, #content .importantmushroom h4, #content .importantlightblue h5, #content .importantaqua h5, #content .importantred h5, #content .importantmulberry h5, #content .importantpurple h5, #content .importantbrown h5, #content .importantblack h5, #content .importantyellow h5, #content .importantorange h5, #content .importantgreen h5, #content .importantmushroom h5, #content .importantlightblue h6, #content .importantaqua h6, #content .importantred h6, #content .importantmulberry h6, #content .importantpurple h6, #content .importantbrown h6, #content .importantblack h6, #content .importantyellow h6, #content .importantorange h6, #content .importantgreen h6, #content .importantmushroom h6, #content .importantlightblue p, #content .importantaqua p, #content .importantred p, #content .importantmulberry p, #content .importantpurple p, #content .importantbrown p, #content .importantblack p, #content .importantyellow p, #content .importantorange p, #content .importantgreen p, #content .importantmushroom p {
		margin: 0 10px 10px 10px;
		padding: 0;
	}
	.importantlightblue {background: #9EBCB3 url(/img/bg-important-lightblue.gif) top no-repeat;}
		.importantlightblue .cap {
			background: url(/img/cap-important-lightblue.gif) bottom no-repeat;
			color: #9EBCB3;
		}
	.importantaqua {background: #00545A url(/img/bg-important-aqua.gif) top no-repeat;}
		.importantaqua .cap {
			background: url(/img/cap-important-aqua.gif) bottom no-repeat;
			color: #00545A;
		}
	.importantred {background: #9C1E3D url(/img/bg-important-red.gif) top no-repeat;}
		.importantred .cap {
			background: url(/img/cap-important-red.gif) bottom no-repeat;
			color: #9C1E3D;
		}
	.importantmulberry {background: #752641 url(/img/bg-important-mulberry.gif) top no-repeat;}
		.importantmulberry .cap {
			background: url(/img/cap-important-mulberry.gif) bottom no-repeat;
			color: #752641;
		}
	.importantpurple {background: #4F2248 url(/img/bg-important-purple.gif) top no-repeat;}
		.importantpurple .cap {
			background: url(/img/cap-important-purple.gif) bottom no-repeat;
			color: #4F2248;
		}
	.importantbrown {background: #5B473B url(/img/bg-important-brown.gif) top no-repeat;}
		.importantbrown .cap {
			background: url(/img/cap-important-brown.gif) bottom no-repeat;
			color: #5B473B;
		}
	.importantblack {background: #322C24 url(/img/bg-important-black.gif) top no-repeat;}
		.importantblack .cap {
			background: url(/img/cap-important-black.gif) bottom no-repeat;
			color: #322C24;
		}
	.importantyellow {background: #CE9E4E url(/img/bg-important-yellow.gif) top no-repeat;}
		.importantyellow .cap {
			background: url(/img/cap-important-yellow.gif) bottom no-repeat;
			color: #CE9E4E;
		}
	.importantorange {background: #BF6516 url(/img/bg-important-orange.gif) top no-repeat;}
		.importantorange .cap {
			background: url(/img/cap-important-orange.gif) bottom no-repeat;
			color: #BF6516;
		}
	.importantgreen {background: #5F7703 url(/img/bg-important-green.gif) top no-repeat;}
		.importantgreen .cap {
			background: url(/img/cap-important-green.gif) bottom no-repeat;
			color: #5F7703;
		}
	.importantmushroom {background: #816D5B url(/img/bg-important-mushroom.gif) top no-repeat;}
		.importantmushroom .cap {
			background: url(/img/cap-important-mushroom.gif) bottom no-repeat;
			color: #816D5B;
		}
	/* This rounds off the bottom of the box */
	#fold #content div p.cap {
		margin: 0;
	}
		
	/* On the Short Breaks and offers Page, this sits to the right of the h2 */
	fieldset#findby {
		margin: 0 0 12px 0;
		padding: 0;
		border: none;
		width: 218px;
		float: left;
		color: white;
		background: #8E0100 url(/img/bg-findby.gif) top no-repeat;
	}
		#findby legend {display: none;}
		#findby select {
			font-size: 100%;
			width: 140px;
		}
		#fold #findby p {
			margin: 0;
			padding: 10px;
			background: url(/img/bg-findby-p.gif) bottom no-repeat;
		}
		/* For users with JavaScript disabled, an unorder list of links appears */
		#findby ul li {
			background: none;
			list-style-type: disc;
			padding-left: 0;
		}

/* On the short breaks page, these are the two columns */
#fold div#breaks, #fold div#offers {
	float: left;
	width: 375px;
	width: 361px;
}
#fold div#breaks {
	margin: 0 14px 0 0;
}

#fold div.featured {
	background: #8F0100 url(/img/bg-featured-div.gif) top left no-repeat;
	margin: 10px 0 0 0;
	clear: both;
	border-top: solid 1px white;
	color: white;
}
	/* Beacuse   gets deleted by the WYSIWYG, this is the rubbish work around */
	#breaks div.featured span, #offers div.featured span {
		color: #8F0100;
	}
	/* The lower two boxes */
	div#breaks div, div#offers div {
		background: white url(/img/bg-breaks-offers.gif) top left no-repeat;
		margin-top: 10px;
		color: #666;
	}
		#breaks span, #offers span {
			color: #E8DCCC;
		}
	#breaks h3, #offers h3 {
		font-size: 140%;
		margin: 3px 9px 0 9px;
		padding: 0;
	}
	#fold div.featured h3 {
		color: white;
	}
	#breaks h3, #offers h3, div#breaks strong, div#offers strong {
		color: #8F0100;
	}
	#fold div.featured strong, #breakdetail dl strong {
		color: white;
	}
	#fold .featured img, #breakdetail dt img {
		border: solid 1px white;
	}
	/* Lower images */
	#breaks img, #offers img {
		border: solid 1px #8F0100;
	}
	#fold .featured dl, #offers dl, #breaks dl {
		clear: both;
		background: url(/img/bg-featured-dl.gif) no-repeat top center;
		padding: 10px 0 0 0;
		clear: both;
		/* IE fix */
		height: 90px;
	}

	/* For terribly sophisticated browsers */
	#contentwide div[class="featured"], #contentwide div[id="offers"], #contentwide div[id="breaks"] {
		height: auto;
	}
	#offers dl, #breaks dl {
		background-image: url(/img/bg-offers-dl-breaks-dl.gif);
	}
	#featured dl, #featured dt, #featured dd, #offers dl, #offers dt, #offers dd, #breaks dl, #breaks dt, #breaks dd, breakdetail dl, #breakdetail dt, #breakdetail dd {
		margin: 0;
		border: none;
	}
	.featured dt, .featured dd, #offers dt, #offers dd, #breaks dt, #breaks dd, #breakdetail dt, #breakdetail dd {
		float: left;
	}
	.featured dt, #offers dt, #breaks dt, #breakdetail dt {
		width: 100px;
		text-align: center;
	}
	.featured dd, #offers dd, #breaks dd, #breakdetail dd {
		width: 260px;
	}
	#offers dt, #breaks dt, #offers dd, #breaks dd {
		padding-bottom: 8px;
	}
	.featured a, #findby a, #breakdetail a {
		color: white;
	}
	.featured a, #breaks a, #offers a {
		text-decoration: none;
	}
	#fold .featured p.cap {
		background: url(/img/bg-breaks-cap.gif) bottom no-repeat;
		margin: 0;
		padding: 0;
		height: 5px;
	}
	html[lang] #fold .featured p.cap {
		height: auto;
		min-height: 5px;
	}
	#breaks hr, #offers hr {
		clear: both;
		height:1px;
		padding:0;
		margin:0 9px;
		border:0;
		border-bottom:1px solid #8F0100;
		color:#fff;
	}

/* On the Breaks and Offers more detail page */
div#breakdetail {
	background: #8E0100 url(/img/bg-breakdetail.gif) top no-repeat;
	clear: both;
	color: white;
}
	#breakdetail div {
		float: left;
		width: 505px;
	}
	#breakdetail #reservations {
		width: 229px;
	}
	#breakdetail h3 {
		color: white;
		margin: 4px 0 12px 10px;
		padding: 0;
		border-bottom: solid 1px white;
	}
	#breakdetail #reservations h3 {
		margin: 4px 10px 12px 0;
	}
	#breakdetail dl {
		float: left;
		width: 360px;
		margin: 0;
		padding: 0;
		border: none;
	}
	/* "Book Online" button */
	#breakdetail div p {
		float: left;
		width: 145px;
		margin: 80px 0 0 0;
		text-align: center;
	}
	div#breakdetail p.clear, #breakdetail #reservations p {
		width: auto;
		float: none;
		margin: 0;
		text-align: left;
	}
	div#breakdetail div p.clear {
		font-size: 0;
		background: none;
	}
	#breakdetail #reservations p {
		margin: 0 0 1em 0;
	}
	#fold #breakdetail li {
		background: url(/img/bullet-white.gif) top left no-repeat;
	}
	#reservations h4 {
		font-size: 100%;
		margin: 0;
		padding: 0;
		color: white;
	}
	/* The cap image at the bottom */
	div#breakdetail p.clear {
		background: url(/img/bg-breakdetail-clear.gif) bottom no-repeat;
	}
	/* More Information */
	div#moreinfo {
		background: white url(/img/bg-moreinfo.gif) top no-repeat;
		margin: 12px 0 0 0;
		/* Needed for IE5 to render bg properly */
		border: solid 1px white;
	}
		#moreinfo h3 {
			margin: 0 10px 10px 10px;
			padding: 4px 0 2px 0;
			border-bottom: solid 1px #8F0100;
			color: #8F0100;
			position: relative;
		}
	/* Main text, left */
	#moreinfo div {
		width: 520px;
		float: left;
	}
		#moreinfo div p {
			margin: 0 0 1em 8px;
		}
	p#infothumb {
		float: left;
		margin: 5px 0;
		width: 214px;
	}
		#infothumb img {
			border: solid 1px #8F0100;
			margin: 0 0 15px 13px;
		}
	
/* A two column layout, in #contentwide */
div.twocol {
	width: 732px;
	background: #730100 url(/img/bg-twocol.gif);
	clear: both;
}
	.twocol div {
		float: left;
		width: 361px;
		color: white;
	}
		#fold .twocol p.topimg {
			margin: 0 0 1em 0;
		}
		#fold .twocol h3, #fold .twocol h4, #fold .twocol h5, #fold .twocol h6 {
			margin: 0 10px;
			color: white;
		}
		#fold .twocol h3 {
			border-bottom: solid 1px white;
		}
		#fold .twocol h3, #fold .twocol h4, #fold .twocol h5 {
			margin: 0 10px;
			padding: 0;
		}
		#fold .twocol .last h3 {
			margin-left: 20px;
		}
		#fold .twocol p {
			margin: 0 10px 1em 10px;
			font-weight: bold;
		}
		#fold .twocol ul, #fold .twocol li {
			list-style-type: square;
			margin-left: 8px;
			padding-left: 8px;
			background: none;
		}
		#fold  .last ul, #fold .last li {
			margin-left: 14px;
		}
		.twocol a {
			color: white;
		}
	.twocol div.last {
		width: 371px;
	}
		#fold .twocol div.last h3, #fold .twocol div.last h4, #fold .twocol div.last h5, #fold .twocol div.last h6, #fold .twocol div.last p {
			margin-left: 20px;
		}
		#fold .twocol div.last p.topimg {
			margin-left: 10px;
		}
	div.twocol p.clear {
		background: #730100 url(/img/bg-twocol-clear.gif) left bottom no-repeat;
		margin: 0;
		padding: 0;
		height: 4px;
		font-size: 0;
	}

/* Used on the news page */
#press div.content {
	width: 504px;
	margin: 0;
}
	#press div.content p {
		margin: 0 0 0.6em 10px;
	}
	
#press div {
	float: left;
	width: 232px;
	clear: none;
}
	#press div p {
		margin: 0;
	}
	/* "Jobs in ..." */
	#press div h2 {
		margin: 0;
		padding: 0;
	}

#press hr, #press p.clear {
	float: none;
	clear: both;
}

#fold p.clear span {
	color: white;
}