/*----------------------------------------------------------------------------------------------------
GLOBAL SETTINGS
----------------------------------------------------------------------------------------------------*/

body {
	background: #EBEFEE;
}

h1 {
	font-family: adrianna-condensed;
	font-size: 120px;
	font-style: normal;
	font-weight: 700;
	line-height: 0.8;
	color: #FFFFFF;
	margin: 0;
	padding: 80px 0 5px 0;
}

h2 {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 400;
	line-height: 1.3;
	color: #FFFFFF;
	margin: 0;
	padding: 0 10px 0 0;
}

h3 {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 0.8;
	color: #2A3935;
	margin: 0;
	padding: 20px 0 0 20px;
}

h4 {
	font-family: ronnia-condensed;
	font-size: 60px;
	font-style: normal;
	font-weight: 700;
	line-height: 1.3;
	text-align: right;
	color: #2A3935;
	margin: 0;
	padding: 0 5px 0 20px;
}

p {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 300;
	line-height: 1.3;
	color: #2A3935;
	margin: 0;
	padding: 0 0 10px 20px;
}

b {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.3;
	color: #2A3935;
}

/*----------------------------------------------------------------------------------------------------
WEATHER BOX
----------------------------------------------------------------------------------------------------*/

#weather {
	position: relative;
	float: left;
	width: 250px;
	height: 130px;
	padding: 20px;
	margin: 2px 2px 2px 0;
	background: #FFFFFF;
}

#weather .content {
	width: 250px;
	height: 130px;
	background: #F3F6F5;
}

#weather .content #weather_icon {
	position: absolute;
	float: left;
	width: 55px;
	height: 55px;
	padding: 15px 0 0 15px;
}

#weather .content #weather_temperature {
	position: relative;
	float: right;
	font-family: ronnia-condensed;
	font-size: 120px;
	font-style: normal;
	font-weight: 700;
	line-height: 0.8;
	color: #2A3935;
	padding: 19px 15px 0 0;
}

#weather .content h3 {
	line-height: 1.5;
}

/*----------------------------------------------------------------------------------------------------
SWELL BOX
----------------------------------------------------------------------------------------------------*/

#swell {
	position: relative;
	float: left;
	width: 391px;
	height: 130px;
	padding: 20px;
	margin: 2px 2px 2px 0;
	background: #FFFFFF;
}

#swell .content {
	width: 391px;
	height: 130px;
	background: #F3F6F5;
}

#swell .content #swell_icon {
	position: absolute;
	float: left;
	width: 41px;
	height: 41px;
	padding: 17px 0 0 15px;
}

#swell .content #swell_left {
	position: relative;
	float: left;
	height: 130px;
	width: 285px;
	padding: 19px 0 0 15px;
}

#swell .content #swell_right {
	position: relative;
	float: right;
	height: 130px;
	padding: 20px 25px 0 0;
}

#swell .content #swell_left #swell_size {
	position: relative;
	float: right;
	font-family: ronnia-condensed;
	font-size: 120px;
	font-style: normal;
	font-weight: 700;
	line-height: 0.8;
	color: #2A3935;
}

#swell .content #swell_left #swell_size_unit {
	position: relative;
	float: right;
	font-family: ronnia-condensed;
	font-size: 60px;
	font-style: normal;
	font-weight: 700;
	line-height: 0.6;
	color: #2A3935;
	padding: 0 0 0 10px;
}

#swell .content #swell_right #swell_direction_header {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.3;
	color: #2A3935;
	margin: 0;
	padding: 0 0 3px 0;
}

#swell .content #swell_right #swell_direction {
	font-family: ronnia-condensed;
	font-size: 25px;
	font-style: normal;
	font-weight: 700;
	line-height: 0.8;
	color: #2A3935;
	padding: 0 0 8px 0;
}

#swell .content #swell_right #swell_period_header {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.3;
	color: #2A3935;
	margin: 0;
	padding: 0 0 3px 0;
}

#swell .content #swell_right #swell_period {
	font-family: ronnia-condensed;
	font-size: 25px;
	font-style: normal;
	font-weight: 700;
	line-height: 0.8;
	color: #2A3935;
	padding: 0;
}

#swell .content h3 {
	line-height: 1.5;
}

/*----------------------------------------------------------------------------------------------------
MISCELLANY BOX
----------------------------------------------------------------------------------------------------*/

#miscellany {
	position: relative;
	float: left;
	width: 175px;
	height: 130px;
	padding: 20px;
	margin: 2px 0 2px 0;
	background: #FFFFFF;
}

#miscellany .content {
	width: 175px;
	height: 130px;
	background: #F3F6F5;
}


#miscellany .content #phone {
	position: relative;
	float: left;
	width: 141px;
	padding: 16px 20px 15px 15px;
	border-bottom: 1px solid #FFFFFF;
}

#miscellany .content #phone_icon {
	position: relative;
	float: left;
}

#miscellany .content #phone_number {
	position: relative;
	float: right;
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.3;
	color: #2A3935;
	padding: 2px 0 0 0;
}

#miscellany .content #languages {
	position: relative;
	float: left;
	padding: 10px 0 0 16px;
}

#miscellany .content #languages_icon {
	position: relative;
	float: left;
}

#miscellany .content #languages_choices {
	position: relative;
	float: right;
	font-family: ronnia-condensed;
	font-size: 13px;
	font-style: normal;
	font-weight: 300;
	line-height: 1.3;
	color: #2A3935;
	padding: 0 0 0 11px;
}

#miscellany .content #languages_choices a {
	color: #BAC7C3;
	text-decoration: none;
}

#miscellany .content #languages_choices a:hover {
	color: #3DB6E3;
	text-decoration: none;
}

/*----------------------------------------------------------------------------------------------------
VILLA BOXES
----------------------------------------------------------------------------------------------------*/

#villa {
	position: relative;
	float: left;
	width: 400px;
	height: 230px;
	padding: 20px 20px 20px 40px;
	margin: 0 2px 2px 0;
	background: #2A3935;
}

#villa_calendar {
	position: relative;
	float: left;
	width: 438px;
	height: 230px;
	padding: 20px;
	margin: 0 0 2px 0;
	background: #FFFFFF;
}

#villa_calendar .ui-datepicker {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 600;
	line-height: 1.3;
	color: #2A3935;
}

#villa_calendar .ui-datepicker-prev {
	width: 23px;
	height: 23px;
	padding: 15px 0 0 15px;
	background: #F3F6F5 url(../images/button_left.png) no-repeat right bottom;
	cursor: pointer;
	cursor: hand;
}

#villa_calendar .ui-datepicker-prev span {
	display: none;
}


#villa_calendar .ui-datepicker-next {
	width: 23px;
	height: 23px;
	padding: 15px 15px 0 0;
	background: #F3F6F5 url(../images/button_right.png) no-repeat left bottom;
	cursor: pointer;
	cursor: hand;
}

#villa_calendar .ui-datepicker-next span {
	display: none;
}

#villa_calendar .ui-datepicker-header {
	padding: 20px 20px 10px 20px;
	/*text-transform: uppercase;*/
}

#villa_calendar .ui-datepicker-calendar {
	line-height: 1.75;
	text-align: right;
}

#villa_calendar table {
	width: 418px;
	color: #2A3935;
}

#villa_calendar th {
	font-weight: 600;
	text-align: right;
	/*text-transform: uppercase;*/
	padding-right: 20px;
	border-right: 1px solid #D8E0DE;
}

#villa_calendar table th span {
	color: #2A3935;
}

#villa_calendar td {
	font-weight: 300;
	text-align: right;
	padding-right: 20px;
	border-right: 1px solid #D8E0DE;
	cursor: pointer;
}

#villa_calendar table td span {
	color: #FFFFFF;
	cursor: pointer;
}

#villa_calendar table td a {
	color: #2A3935;
	text-decoration: none;
	cursor: pointer;
}

#villa_calendar table td.partly_booked a {
	font-weight: 300;
	color: #3DB6E3;
	cursor: pointer;
}

#villa_calendar table td.fully_booked a {
	font-weight: 300;
	color: #D8E0DE;
	cursor: pointer;
}

#villa_calendar .content {
	width: 438px;
	height: 230px;
	background: #F3F6F5;
}

#villa_slideshow {
	position: relative;
	float: left;
	width: 940px;
	height: 540px;
	padding: 0;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#villa_slideshow .content {
	width: 940px;
	height: 540px;
	background: #F3F6F5;
	overflow: hidden;
}

#villa_slideshow .content .slideshow {
	width: 940px;
	height: 540px;
	padding: 0;
}

#villa_details {
	position: relative;
	float: left;
	width: 900px;
	height: auto;
	padding: 20px;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#villa_details .content {
	width: 900px;
	height: auto;
	background: #F3F6F5;
	overflow: hidden;
}

#villa_details .content .left {
	width: 410px;
	height: auto;
	background: #F3F6F5;
	float: left;
	padding: 0 10px 20px 0;
}

#villa_details .content .right {
	width: 430px;
	height: auto;
	background: #F3F6F5;
	float: right;
	padding: 0 30px 20px 0;
}

#villa_details .content a {
	text-decoration: none;
}

#villa_details .content a:hover {
	text-decoration: none;
}

button.view {
	font-family: ronnia-condensed;
	font-size: 14px;
	font-style: normal;
	font-weight: 300;
	color: #F3F6F5;
	padding: 5px 15px;
	margin: 5px 3px 5px 0;
	-moz-border-radius: 30px;
    -webkit-border-radius: 30px;
    -khtml-border-radius: 30px;
	border-radius: 30px;
	background-color: #2A3935;
	border: 0px solid #2A3935;
	cursor: pointer;
	text-decoration: none;
}

/*----------------------------------------------------------------------------------------------------
SPECIALS BOXES
----------------------------------------------------------------------------------------------------*/

#special {
	position: relative;
	float: left;
	width: 566px;
	height: 230px;
	padding: 20px 20px 20px 40px;
	margin: 0 2px 2px 0;
	background: #2A3935;
}

#special_voucher {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 0 2px 0;
	background: #FFFFFF;
}

#special_voucher .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#special_voucher .content .bottom {
	position: absolute;
	bottom: 25px;
	right: 25px;
	float: right;
	font-family: ronnia-condensed;
	font-size: 30px;
	font-style: normal;
	font-weight: 700;
	line-height: 0.8;
	color: #2A3935;
	text-align: right;
}

#special_voucher .content a {
	color: #BAC7C3;
	text-decoration: none;
}

#special_voucher .content a:hover {
	color: #3DB6E3;
	text-decoration: none;
}

/*----------------------------------------------------------------------------------------------------
ACTIVITIES BOXES
----------------------------------------------------------------------------------------------------*/

#activities {
	position: relative;
	float: left;
	width: 566px;
	height: 230px;
	padding: 20px 20px 20px 40px;
	margin: 0 2px 2px 0;
	background: #2A3935;
}

#activities h1 {
	padding: 60px 0 5px 0;
}

#activities_beaches {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 0 2px 0;
	background: #FFFFFF;
}

#activities_beaches .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_beaches .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_beaches .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_surfing {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#activities_surfing .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_surfing .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_surfing .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_walking {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#activities_walking .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_walking .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_walking .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_sightseeing {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 0 2px 0;
	background: #FFFFFF;
}

#activities_sightseeing .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_sightseeing .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_sightseeing .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_golf {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#activities_golf .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_golf .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_golf .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_spa {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#activities_spa .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_spa .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_spa .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_children {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 0 2px 0;
	background: #FFFFFF;
}

#activities_children .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_children .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_children .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_shopping {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#activities_shopping .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_shopping .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_shopping .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_gastronomy {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 2px 2px 0;
	background: #FFFFFF;
}

#activities_gastronomy .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_gastronomy .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_gastronomy .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

#activities_culture {
	position: relative;
	float: left;
	width: 312px;
	height: 270px;
	padding: 0;
	margin: 0 0 2px 0;
	background: #FFFFFF;
}

#activities_culture .content {
	position: absolute;
	top: 20px;
	left: 20px;
	width: 252px;
	height: 230px;
	background: #F3F6F5;
	z-index: 0;
	padding: 0 20px 0 0;
}

#activities_culture .slide {
	position: absolute;
	top: 0;
	left: 0;
	width: 312px;
	height: 270px;
	background: #F3F6F5;
	z-index: 50;
	padding: 0;
}

#activities_culture .controls {
	position: absolute;
	top: 20px;
	left: 270px;
	width: 23px;
	height: 23px;
	z-index: 100;
}

/*----------------------------------------------------------------------------------------------------
CONTACT BOXES
----------------------------------------------------------------------------------------------------*/

#contact {
	position: relative;
	float: left;
	width: 566px;
	height: 230px;
	padding: 20px 20px 20px 40px;
	margin: 0 2px 2px 0;
	background: #3DB6E3;
}

#contact .button_map {
	float: right;
	width: 23px;
	height: 23px;
}

#contact_details {
	position: relative;
	float: left;
	width: 272px;
	height: 230px;
	padding: 20px;
	margin: 0 0 2px 0;
	background: #FFFFFF;
}

#contact_details .content {
	width: 272px;
	height: 210px;
	padding: 20px 0 0 0;
	background: #F3F6F5;
}

#contact_details #social {
	padding: 5px 0 0 20px;
}

#contact_details #social a {
	margin: 0 2px 0 0;
}

#contact_details .content a {
	color: #BAC7C3;
	text-decoration: none;
}

#contact_details .content a:hover {
	color: #3DB6E3;
	text-decoration: none;
}

/*----------------------------------------------------------------------------------------------------
CALENDAR BOX
----------------------------------------------------------------------------------------------------*/

.ui-datepicker-header {
	position: relative;
}
.ui-datepicker .ui-datepicker-prev, .ui-datepicker .ui-datepicker-next {
    height: 20px;
    position: absolute;
    top: 2px;
    width: 40px;
}

.ui-datepicker .ui-datepicker-prev {
    left: 2px;
}

.ui-datepicker .ui-datepicker-next {
    right: 2px;
}

.ui-datepicker .ui-datepicker-title {
    line-height: 25px;
    margin: 0 40px;
    text-align: center;
}

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

#footer {
	position: relative;
	float: left;
	width: 880px;
	height: 50px;
	margin: 0;
	padding: 10px 20px 20px 40px;
}

#footer .left {
	float: left;
	z-index: 0;
	padding: 10px 0 0 0;
}

#footer .button_up {
	float: right;
	width: 23px;
	height: 23px;
	z-index: 100;
	padding: 5px 0 0 0;
}

/*----------------------------------------------------------------------------------------------------
CURSORS
----------------------------------------------------------------------------------------------------*/