/*-----------------------------------------------------------------
File: layout.css
Version: 1.0
Date: 17/01/07
Author: Michael Van Dorth
Email: m.vandorth@iberianmedia.com
Description: This is the main layout style sheet that contains all
of the layout rules for the website. It is also the main CSS file
that is called in directly from the XHTML markup and calls in all
other sub CSS files.
-----------------------------------------------------------------*/


/* IMPORT EXTERIOR CSS FILES
-----------------------------------------------------------------*/
@import url(languages.css);


/* NORMALIZE BROWSER ELEMENTS
-----------------------------------------------------------------*/
/* Normalize margin, padding */
body, div, dl, dt, dd, ul, ol, li, h1, h2, h3, h4, h5, h6, pre, form, fieldset, input, p, blockquote, th, td {
	margin : 0; padding: 0;	
}
/* Normalize font-size and weight for headers */
h1, h2, h3, h4, h5, h6 {
	font-size: 100%;
	font-weight: normal;
}
/* Remove list-style from lists */
ul, ol, li {
	list-style-type: none;
}
/* Normalize font-weight and font-style */
address, caption, cite, code, dfn, em, strong, th, var {
	font-style: normal;
	font-weight: normal;
}
/* Remove browser based table border spacing */
table {
	border-collapse: collapse;
	border-spacing: 0;
}
/* Remove borders from images */
img {
	border: 0;
}
/* Left align text in caption and th */
caption, th {
	text-align: left;
}
/* Remove quotation marks from q */
q:before, q:after {
	content: '';
}


/* BASIC LAYOUT RULES
-----------------------------------------------------------------*/

body {
	font-family: Tahoma, Verdana, Arial, Helvetica, sans-serif;
	font-size: 12px;
}

p {
	line-height: 18px;
}

a {
	text-decoration: none;
	color: #013C82;
}

a:hover {
	text-decoration: underline;
}

strong {
	font-weight: bold;
}

#wrapper {
	width: 766px;
	margin: 0px auto 18px auto;
	background-image: url(../graphics/wrapper_backGround.jpg);
	background-repeat: no-repeat;
	background-position: center bottom;
}

.clear {
	clear: both;
	height: 0px;
}

.panelTypeA, .panelTypeB {
	width: 247px;
	background-repeat: no-repeat;
	background-position: center bottom;
	margin-bottom: 9px;
}

.panelTypeA .content, .panelTypeB .content {
	background-repeat: no-repeat;
	background-position: center top;
	padding: 18px;
}

.panelTypeA .content dl.dates, .panelTypeB .content dl.dates {
	font-size: 10px;
	margin-bottom: 14px;
}

.panelTypeA .content ul li, .panelTypeB .content ul li {
	margin-bottom: 7px;
}

.panelTypeA {
	background-image: url(../graphics/panelTypeA_backGround.gif);
}

.panelTypeA .content {
	background-image: url(../graphics/panelTypeA_content_backGround.gif);
}

.panelTypeB {
	background-image: url(../graphics/panelTypeB_backGround.gif);
}

.panelTypeB .content {
	background-image: url(../graphics/panelTypeB_content_backGround.gif);
}

.panelTypeC .content {
	padding: 0px 18px 18px 18px;
}

#localData #ourSurroundings {
	height: 15px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 14px;
}

#localData .content ul li {
	margin-bottom: 20px;
	float: left;
	width: 104px;
	text-align: center;
	border-left-style: solid;
	border-left-width: 1px;
	border-left-color: #000;
}

#localData .content ul li.first {
	border-left-style: none;
	width: 105px;
}

#localData .content ul li a {
	float: left;
	display: block;
	width: 104px;
	padding-top: 50px;
	text-align: center;
	background-repeat: no-repeat;
	background-position: center top;
	font-size: 10px;
	font-weight: bold;
	color: #000;
}

#localData .content ul li a.map {
	background-image: url(../graphics/mapIcon.gif);
}

#localData .content ul li a.weather {
	background-image: url(../graphics/weatherIcon.gif);
}

p.viewMore {
	text-align: right;
	clear: both;
}

p.viewMore a {
	padding-left: 10px;
	background-image: url(../graphics/plusIcon.gif);
	background-repeat: no-repeat;
	background-position: 0px 5px;;
	font-size: 10px;
	font-weight: bold;
	color: #000;
}

dl.dates dt, dl.dates dd {
	display: inline;
}

dl.dates dt {
	font-weight: bold;
}

dl.dates dd {
	margin-right: 8px;
}

dl.contact dt, dl.contact dd {
	display: inline;
}

dl.contact dt {
	font-weight: bold;
	margin-right: 5px;
}

.dataTable {
	width: 100%;
	margin-bottom: 20px;
}

.dataTable th, .dataTable td {
	padding: 6px;
}

.dataTable th.last, .dataTable td.last {
	text-align: right;
}

.dataTable thead tr th {
	background-image: url(../graphics/dataTable_header_backGround.gif);
	background-repeat: repeat-x;
	background-position: left bottom;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	font-weight: bold;
	vertical-align: top;
	color: #013C82;
	border-bottom-color: #5786A5;
}

.dataTable thead tr th em {
	display: block;
	margin-top: 8px;
	font-size: 9px;
}

.dataTable tbody tr td {
	padding-top: 10px;
	padding-bottom: 10px;
	border-top-style: solid;
	border-top-width: 1px;
	border-top-color: #CCC;
}

.dataTable tbody tr.first td {
	border-top-style: none;
}

.dataTable tfoot tr td {
	background-image: url(../graphics/dataTable_footer_backGround.gif);
	background-repeat: repeat-x;
	background-position: left top;
	border-top-style: solid;
	border-top-width: 1px;
	border-top-color: #5786A5;
	text-align: center;
}

.dataTable tfoot tr td ul li {
	display: inline;
	margin-left: 6px;
	padding-left: 10px;
	border-left-style: solid;
	border-left-width: 1px;
	border-left-color: #5786A5;
}

.dataTable tfoot tr td #weatherLinks li {
	font-size: 10px;
}

.dataTable tfoot tr td ul li.first {
	border-left-style: none;
	margin-left: 0px;
	padding-left: 0px;
}

.dataList {
	margin-bottom: 20px;
}

.dataList dt {
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #5786A5;
	font-weight: bold;
	color: #5786A5;
	padding-bottom: 6px;
	margin-bottom: 6px;
	margin-top: 10px;
	clear: both;
}

.dataList dd {
	margin-top: 10px;
	margin-bottom: 20px;
}

.dataList dd dl {
	margin-left: 20px;
}

.dataList dd dl dt {
	border-bottom-style: none;
	margin-top: 0px;
	float: left;
	width: 70px;
	font-weight: normal;
}

.dataList dd dl dd {
	float: right;
	width: 340px;
	margin-top: 0px;
	margin-bottom: 0px;
}

.dataList dd ul li {
	list-style: disc;
	padding-left: 20px;
	list-style-position: inside;
}

/* RESERVATION LINK */

a.reservationLink {
	background: url('../graphics/reservationLink_backGround.gif') no-repeat left center;
	display: block;
	line-height: 38px;
	height: 38px;
	width: 155px;
	padding: 0px 20px;
	color: #FFF;
	font-weight: bold;
}

/* FORMS */

form {
	background: url('../graphics/form_backGround.gif') no-repeat center bottom;
}
form h2 {
	background: url('../graphics/form_content_backGround.gif') no-repeat center top;
	padding: 15px 20px 0px 20px;
}
form fieldset {
	border: none;
	padding: 0px 20px;
}
form label,
form input,
form textarea {
	display: block;
}
form label {
	margin-bottom: 2px;
	color: #5B4E37;
}
form label.error {
	color: #600;
}
form input {
	font-size: 12px;
	line-height: 20px;
	height: 20px;
}
form input,
form textarea {
	width: 422px;
}
form textarea {
	height: 120px;
}
form #dates,
form #occupants {
	overflow: hidden;
	padding-bottom: 10px;
}
form #dates p,
form #occupants p {
	width: 90px;
	float: left;
	margin-right: 10px;
}
form #dates input {
	width: 80px;
}
form #submission {
	padding-bottom: 20px;
}
form #submission input {
	width: auto;
	display: inline;
	line-height: normal;
	height: auto;
}

#primaryContent #googleMap {
	width: 462px;
	height: 500px;
	border-style: solid;
	border-width: 2px;
	border-color: #0066CC;
}

#secondaryContent #mapControl {
	font-size: 11px;
	margin-top: 10px;
	background-image: url(../graphics/mapControl_backGround.gif);
	background-repeat: no-repeat;
	background-position: center top;
	padding: 10px;
}

#secondaryContent #mapControl #directions {
	height: 18px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 14px;
}

#secondaryContent #mapControl p.left {
	float: left;
}

#secondaryContent #mapControl p.right {
	float: right;
}

#secondaryContent #mapControl p select, #secondaryContent #mapControl p input {
	font-size: 11px;
}

#secondaryContent #googleDir {
	clear: both;
	height: 431px;
	overflow-y: auto;
	padding-left: 10px;
	padding-right: 10px;
	background-image: url(../graphics/googleDir_backGround.gif);
	background-repeat: repeat-y;
	background-position: center top;
	font-size: 11px;
}

#secondaryContent #googleDirCap {
	height: 30px;
	background-image: url(../graphics/googleDirCap_backGround.gif);
	background-repeat: no-repeat;
	background-position: center bottom;
}

/* HEADER RULES
-----------------------------------------------------------------*/

#header {
	position: relative;
	height: 320px;
	background-image: url(../graphics/indexHeader_backGround.jpg);
	background-repeat: no-repeat;
	background-position: center top;
}

.page #header, .admin #header {
	height: 150px;
	background-image: url(../graphics/header_backGround.jpg);
}

#header h1 {
	position: absolute;
	top: 0px;
	left: 54px;
	width: 161px;
	height: 188px;
	text-indent: -9999px;
	background-image: url(../graphics/logoLarge.gif);
	background-repeat: no-repeat;
}

.page #header h1, .admin #header h1 {
	left: 25px;
	width: 96px;
	height: 96px;
	background-image: url(../graphics/logoSmall.gif);
}

#header .navigation {
	position: absolute;
	top: 105px;
	left: 11px;
	width: 744px;
}

.index #header .navigation {
	top: 276px;
}

.admin #header .navigation {
	top: 40px;
	left: 150px;
}

#header .navigation li {
	float: left;
	position: relative;
}

#header .navigation li a {
	display: block;
	width: 123px;
	line-height: 46px;
	background-image: url(../graphics/navigation_backGround_center.gif);
	background-repeat: repeat-x;
	background-position: 0px -46px;
	border-left-style: solid;
	border-left-width: 1px;
	border-left-color: #7EABC2;
	text-align: center;
	font-size: 12px;
	font-weight: bold;
	color: #FFF;
}

#header .navigation li.first a {
	background-image: url(../graphics/navigation_backGround_left.gif);
	background-repeat: no-repeat;
	border-left-style: none;
	width: 124px;
}

#header .navigation li.last a {
	background-image: url(../graphics/navigation_backGround_right.gif);
	background-repeat: no-repeat;
	background-position: right -46px;
}

#header .navigation li a:hover, #header .navigation li a.selected {
	background-position: 0px 0px;
	text-decoration: none;
}

#header .navigation li.last a:hover, #header .navigation li.last a.selected {
	background-position: right 0px;
}

#header .navigation li ul {
	position: absolute;
	left: 5px;
	top: 46px;
	display: none;
	width: 200px;
}

#header .navigation li:hover ul,
#header .navigation li.over ul {
	display: block;
}

#header .navigation li ul li {
	float: none;
}
#header .navigation li ul li a,
#header .navigation li.first ul li a,
#header .navigation li.last ul li a {
	display: block;
	width: 200px;
	height: 30px;
	line-height: 30px;
	padding: 0px 10px;
	background-image: none;
	background-color: #7EABC2;
	text-align: left;
}
#header .navigation li ul li a:hover,
#header .navigation li.first ul li a:hover,
#header .navigation li.last ul li a:hover {
	background-color: #013C82;
}

#header .language {
	position: absolute;
	top: 254px;
	left: 560px;
	width: 170px;
}

#header .language li {
	float: left;
}

#header .language li a {
	display: block;
	margin-left: 10px;
	padding-left: 10px;
	border-left-style: solid;
	border-left-width: 1px;
	border-left-color: #013C82;
	font-size: 12px;
}

#header .language li.first a {
	margin-left: 0px;
	padding-left: 0px;
	border-left-style: none;
}

#header a.homeLink {
	position: absolute;
	top: 32px;
	left: 670px;
	height: 13px;
	width: 65px;
	background-image: url(../graphics/homeIcon.gif);
	background-repeat: no-repeat;
	background-position: center -100px;
	padding-top: 45px;
	text-align: center;
	font-weight: bold;
}

#header a.homeLink:hover {
	background-position: center 0px;
	text-decoration: none;
}

/* CONTENT RULES
-----------------------------------------------------------------*/

/* PRIMARY CONTENT */

#primaryContent {
	width: 486px;
	float: left;
	padding-left: 11px;
	padding-top: 11px;
}

.page #primaryContent {
	width: 466px;
	padding-left: 20px;
}

.admin #primaryContent {
	width: 733px;
	margin-left: 11px;
	float: none;
}

#primaryContent .gallery {
	overflow: hidden;
	margin-top: 20px;
}
#primaryContent .gallery li {
	float: left;
	margin: 0px 5px 5px 0px;
}
#primaryContent .gallery li a {
	display: block;
	width: 146px;
	height: 110px;
}

#primaryContent ul.displayList {
	margin-left: 20px;
}

#primaryContent ul.displayList li {
	list-style: disc;
	margin-bottom: 10px;
}

#primaryContent #welcome {
	background-image: url(../graphics/welcome_backGround.gif);
	background-repeat: no-repeat;
	background-position: 0px 0px;
	border-style: solid;
	border-width: 1px;
	border-color: #999;
	padding: 38px 25px 38px 129px;
	margin-bottom: 11px;
}

#primaryContent #notice {
	border-style: solid;
	border-width: 1px;
	border-color: #999;
	padding: 20px;
	margin-bottom: 11px;
	background-color: #FFC;
}

#primaryContent #welcome #welcomeToHotelCaribe {
	height: 16px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 7px;
}

#primaryContent #welcome #locatedOnTheCostaDelSol {
	height: 15px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 14px;
}

#primaryContent #localData, #primaryContent #servicesData {
	float: left;
}

#primaryContent #servicesData {
	width: 230px;
}

#primaryContent #servicesData #ourServices {
	height: 15px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 7px;
	margin-top: 7px;
}

#primaryContent #servicesData #whatWeOffer {
	height: 15px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 14px;
}

#primaryContent #servicesData ul li {
	padding-left: 13px;
	margin-bottom: 12px;
	background-image: url(../graphics/plusIcon.gif);
	background-repeat: no-repeat;
	background-position: 0px 4px;
}

.page #primaryContent h2, .admin #primaryContent h2 {
	font-size: 18px;
	margin-top: 14px;
	padding-bottom: 4px;
	margin-bottom: 8px;
	color: #013C82;
	
}

.page #primaryContent p {
	margin-bottom: 16px;	
}

/* SECONDARY CONTENT */

#secondaryContent {
	width: 247px;
	float: right;
	padding-right: 11px;
	padding-top: 11px;
}

#secondaryContent #latestOffer {
	height: 19px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 4px;
	padding-bottom: 4px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #013C82;
}

#secondaryContent #moreOffers {
	height: 18px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 8px;
	padding-bottom: 4px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #013C82;
}

#secondaryContent #pointsOfContact {
	height: 15px;
	text-indent: -9999px;
	background-repeat: no-repeat;
	background-position: 0px 0px;
	margin-bottom: 8px;
	padding-bottom: 4px;
	border-bottom-style: solid;
	border-bottom-width: 1px;
	border-bottom-color: #013C82;
}

#secondaryContent dl.contact dt {
	width: 55px;
	display: block;
	float: left;
	margin-bottom: 8px;
}

#secondaryContent dl.contact dd {
	width: 140px;
	display: block;
	float: right;
	text-align: right;
	margin-bottom: 8px;
}

/* FOOTER RULES
-----------------------------------------------------------------*/

#footer {
	clear: both;
	border-bottom-style: solid;
	border-bottom-width: 2px;
	padding-bottom: 27px;
	padding-top: 50px;
	border-bottom-color: #013C82;
	text-align: center;
	font-size: 10px;
}

#footer ul li {
	display: inline;
	padding-left: 10px;
	margin-left: 9px;
	border-left-style: solid;
	border-left-width: 1px;
	border-left-color: #013C82;
}

#footer ul li.first {
	padding-left: 0px;
	margin-left: 0px;
	border-left-style: none;
}

/* LEGAL NOTICE RULES
-----------------------------------------------------------------*/

#legalTexts {
	padding: 20px;
}
#legalTexts h1 {
	font-size: 16px;
	font-weight: bold;
	margin-bottom: 15px;
}