/* Stylesheet for El Mar Services - http://www.tenerifeairporttransfers.co.uk */

* { /* CSS Reset */
	margin: 0;
	padding: 0;
	vertical-align: baseline;
	border: 0px none;
	outline: 0px none;
	font-size: 100%;
	font-family: Arial, Helvetica, sans-serif;
}
.clear {clear: both;}
.spacer {height: 17px; line-height: 17px; width: 100%;}
@font-face {
    font-family: 'Helvetica Rounded';
    src: url('fonts/helveticaroundedltstd-bdcn-webfont.eot');
    src: url('fonts/helveticaroundedltstd-bdcn-webfont.eot?#iefix') format('embedded-opentype'),
         url('fonts/helveticaroundedltstd-bdcn-webfont.woff') format('woff'),
         url('fonts/helveticaroundedltstd-bdcn-webfont.ttf') format('truetype'),
         url('fonts/helveticaroundedltstd-bdcn-webfont.svg#HelveticaRoundedLTStdBdCn') format('svg');
    font-weight: normal;
    font-style: normal;
}
html {background: url(images/html-bg.gif) top repeat-x fixed #3f76ad;}
body {background: url(images/body-bg.jpg) top left fixed no-repeat;}
a {color: #25a;} /* Standard link color unless otherwise defined */
/* HEADER */
#header {
	width: 960px;
	height: 112px;
	overflow: hidden;
	margin: 0 auto;
}
	#header .controlpanel {
		height: 29px;
		width: 260px;
		margin: 10px 10px 0 10px;
		float: right;
		background: url(images/header-cpanel-bg.gif) repeat-x;
		-moz-border-radius: 0px 4px 0px 0px;
		-webkit-border-radius: 0px 4px 0px 0px;
		border-radius: 0px 4px 0px 0px;
		font-size: 12px;
		-moz-box-shadow: 2px 2px 2px #536d90;
		-webkit-box-shadow: 2px 2px 2px #536d90;
		box-shadow: 2px 2px 2px #536d90;
	}
		#header .controlpanel img  {padding-right: 10px; float: left;}
		#header .controlpanel img.icon {
			margin-right: 5px;
			vertical-align: middle;
			padding-right: 0;
			position: relative;
			z-index: 11;
		}
		#header .controlpanel a {
			color: #fff;
			margin-right: 10px;
			margin-top: 6px;
			text-decoration: none;
			float: right;
			position: relative;
			z-index: 11;
		}
	#header .logoarea {
		-moz-box-shadow: 2px 2px 2px #536d90;
		-webkit-box-shadow: 2px 2px 2px #536d90;
		box-shadow: 2px 2px 2px #536d90;
		width: 960px;
		height: 68px;
		margin: 0 auto;
		background: #fff;
		-moz-border-radius: 4px 4px 0px 0px;
		-webkit-border-radius: 4px 4px 0px 0px;
		border-radius: 4px 4px 0px 0px;
		text-align: right;
		font-size: 14px;
		color: #000050;
		font-family: Verdana, Arial, Helvetica, sans-serif;
		font-weight: bold;
		letter-spacing: -1px;
		position: relative;
		z-index: 20;
	}
		#header .logoarea img {
			margin: 20px 0 0 20px;
			float: left;
			display: inline;
		}
		#header .logoarea p {
			margin: 20px 20px 0 0;
			float: right;
			display: inline;
		}
		#header .logoarea a {
			color: #000050;
			font-family: Verdana, Arial, Helvetica, sans-serif;
			text-decoration: none;
		}
/* NAV */
#nav {
	width: 930px;
	height: 38px;
	overflow: hidden;
	margin: -8px auto -4px auto;
	padding: 0 15px;
	-moz-border-radius: 4px 4px 0px 0px;
	-webkit-border-radius: 4px 4px 0px 0px;
	border-radius: 4px 4px 0px 0px;
	-moz-box-shadow: 2px 2px 2px #536d90;
	-webkit-box-shadow: 2px 2px 2px #536d90;
	box-shadow: 2px 2px 2px #536d90;
	background: url(images/nav-bg.gif) top repeat-x;
	font-size: 12px;
	position: relative;
	z-index: 30;
}
	#nav a {
		color: #252a6d;
		text-decoration: none;
		padding: 0 15px;
		line-height: 34px;
	}
	#nav a:hover {color: #fd6a00;}
/* MAIN CONTENT */
#content {
	width: 960px;
	margin: 0 auto;
	overflow: hidden;
	background: #fff;
	-moz-border-radius: 4px 4px 0px 0px;
	-webkit-border-radius: 4px 4px 0px 0px;
	border-radius: 4px 4px 0px 0px;
	-moz-box-shadow: 2px 2px 2px #536d90;
	-webkit-box-shadow: 2px 2px 2px #536d90;
	box-shadow: 2px 2px 2px #536d90;
	position: relative;
	z-index: 40;
}
	.container {
		background: #ddedfd;
		border: 1px solid #9cf;
		margin: 20px 0 0 20px;
		float: left;
		padding-bottom: 4px;
	}
	.fullwidth {width: 910px; padding: 4px;} /* The flash banner area */
	.twothirdswidth {width: 598px;}
	.onethirdwidth {width: 298px;}
		.innerbox {
			width: 588px;
			background: #fff;
			border: 1px solid #9cf;
			margin: 4px 0 0 4px;
		}
		.onethirdwidth .innerbox {width: 288px;}
		.container .halfwidth {width: 291px; float: left;} /* The small inner boxes at half width */
		.container .faq {background: url(images/innerbox-faq.gif) bottom right no-repeat #fff;}
		.container .rewards {background: url(images/innerbox-rewards.gif) bottom right no-repeat #fff;}
		hr {
			margin: 10px 10px 0 10px;
			background: #9cf;
			height: 1px;
		}
		h1, h2 {
			font-size: 22px;
			font-weight: bold;
			font-family: "Helvetica Rounded", Arial, sans-serif;
			margin: 10px 10px 0 10px;
			cursor: default;
			text-transform: capitalize;
		}
		.twothirdswidth h1, .twothirdswidth h2 {color: #25a;}
		.onethirdwidth h2 {color: #fd6a00;}
		h1.purple, h2.purple, p.purple {color: #8f5dad;}
		h1.orange, h2.orange, p.orange {color: #fd6a00;}
		h1.blue, h2.blue, p.blue {color: #25a;}
		h3 {
			color: #555;
			font-size: 18px;
			font-weight: bold;
			font-family: "Helvetica Rounded", Arial, sans-serif;
			margin: 10px 10px 0 10px;
			cursor: default;
		}
		h3 a {font-family: "Helvetica Rounded", Arial, sans-serif;}
		.onethirdwidth h3 {font-size: 16px;}
		h2 img.padlock, h1 img.padlock {float: right; margin-left: 10px;}
			.onethirdwidth .rewardsinfo {
				width: 123px;
				height: 107px;
				display: inline;
				float: right;
				margin: 0 0 10px 10px;
				padding-top: 10px;
				background: url(images/star.gif) center no-repeat;
				color: #fff;
				text-align: center;
				font-size: 26px;
				line-height: 117px;
				overflow: hidden;
				font-weight: bold;
			}
		.innerbox p {
			color: #222;
			font-size: 13px;
			margin: 20px 10px 10px 10px;
		}
		.innerbox p.error, .innerbox p.info {
			color: #f00;
			font-weight: bold;
			font-style: italic;
			margin-left: 40px;
			margin-right: 40px;
			font-size: 12px;
		}
		.innerbox p.info {color: #555;}
			.innerbox p.info img {margin-right: 10px; vertical-align: text-top;}
		.innerbox p.error:before {content: "! ";}
		.onethirdwidth .innerbox p {font-size: 11px; margin-top: 10px;}
		.onethirdwidth p a {font-style: italic; font-weight: bold;}
		.innerbox li {
			margin: 20px 40px;
			font-family: "Helvetica Rounded", Arial, sans-serif;
			color: #25a;
			font-size: 20px;
		}
		.mainimage { /* Images nested WITHIN P or H1 / H2 tags, floated right */
			margin: 0 0 10px 10px;
			float: right;
			padding: 4px;
			border: 1px solid #9cf;
		}
		.subimage {border: 1px solid #9cf;}
		a.orangebutton {
			background: url(images/orangebutton.gif) repeat-x;
			padding: 7px 10px;
			color: #fff;
			text-decoration: none;
			-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			border-radius: 4px;
			opacity:0.8;
			filter:alpha(opacity=80);
		}
		a.greenbutton {
			background: url(images/greenbutton.gif) repeat-x;
			padding: 7px 10px;
			color: #fff;
			text-decoration: none;
			-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			border-radius: 4px;
			opacity:0.8;
			filter:alpha(opacity=80);
		}
		a.bluebutton {
			background: url(images/bluebutton.gif) repeat-x;
			padding: 7px 10px;
			color: #fff;
			text-decoration: none;
			-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			border-radius: 4px;
			opacity:0.8;
			filter:alpha(opacity=80);
		}
		a.purplebutton {
			background: url(images/purplebutton.gif) repeat-x;
			padding: 7px 10px;
			color: #fff;
			text-decoration: none;
			-moz-border-radius: 4px;
			-webkit-border-radius: 4px;
			border-radius: 4px;
			opacity:0.8;
			filter:alpha(opacity=80);
		}
		.onethirdwidth a.orangebutton, .onethirdwidth a.greenbutton, .onethirdwidth a.bluebutton, .onethirdwidth a.purplebutton {
			font-size: 13px;
			font-style: normal;
			line-height: 50px; /* Gives additional 10px top & bottom spacing */
			font-weight: normal;
		}
		a.orangebutton:hover, a.greenbutton:hover, a.bluebutton:hover, a.purplebutton:hover {opacity:1.0;filter:alpha(opacity=100);}
		a.orangebutton strong, a.greenbutton strong, a.bluebutton strong, a.purplebutton strong {
			font-weight: bold;
			font-size: 16px;
			text-transform: uppercase;
		}
/* FOOTER */
#footer {
	width: 920px;
	height: 31px;
	overflow: hidden;
	margin: 20px;
	line-height: 31px;
	color: #444;
	font-size: 12px;
}
	#footer img {float: right;}
	#footer a {color: #25a;}
/* TABLES & FORMS */
table {margin: 10px 10px 0 10px;}
table h1, table h2 {margin: 0;}
td, th {
	color: #222;
	font-size: 13px;
	padding: 10px;
	vertical-align: middle;
}
th {
	color: #fff;
	font-weight: bold;
	background: url(images/orangebutton.gif) center repeat-x;
	border: 1px solid #fff;
}
	td.liststyle {border-bottom: 1px solid #666;}
	td .note {
		margin-left: 10px;
		font-weight: bold;
		font-size: 10px;
	}
td.checkbox {color: #25a; font-weight: bold;}
	td.checkbox input {
		border: 0px none;
		background: none;
		margin-right: 10px;
	}
td.grey {color: #666;}
	td .subimage {padding: 4px;}
	td a.delete {opacity:0.6; filter:alpha(opacity=60);}
	td a.delete:hover {opacity:1.0; filter:alpha(opacity=100);}
input, select, textarea {
	-moz-border-radius: 4px;
	-webkit-border-radius: 4px;
	border-radius: 4px;
	border: 1px solid #9b9b9b;
	color: #444;
	font-size: 13px;
	font-family: Arial, Helvetica, sans-serif;
	padding: 3px 5px;
	background: url(images/input-bg.gif) top left no-repeat;
}
input.submit {
	background: url(images/greenbutton.gif) repeat-x;
	padding: 0 10px;
	color: #fff;
	opacity:0.8;
	filter:alpha(opacity=80);
	border: 0px none;
	height: 30px;
	line-height: 30px;
	font-size: 14px;
}
input.purple {background: url(images/purplebutton.gif) repeat-x;}
input.orange {background: url(images/orangebutton.gif) repeat-x;}
input.submit:hover {
	opacity:1.0;
	filter:alpha(opacity=100);
	cursor: pointer;
}
