/* Finca Dida */
/* Design + Code: Michelle Dipp */

/* ------------------------------------------------------------- */
/* CSS_Reset */
/* ------------------------------------------------------------- */
		html, body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, font, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td
                        { margin: 0; padding: 0; border: 0; outline: 0; font-weight: inherit; font-style: inherit; font-size: 100%; font-family: inherit; vertical-align: baseline; }
    blockquote:before,
    blockquote:after,
    q:before, q:after   { content: ""; }
    blockquote, q       { quotes: "" ""; }
    body                { line-height: 1; color: black; background: white; }
    caption, th, td     { text-align: left; font-weight: normal; }
    :focus              { outline: 0; }
    table               { border-collapse: separate; border-spacing: 0; }
    ol, ul              { list-style: none; }



/* ------------------------------------------------------------- */
/* What we always need */
/* ------------------------------------------------------------- */

/* pictures and videos */
video {
 width: 100%;
}

img {
 width: 100%;
}

/* clearfix */
.clearfix:after {
	display: table;
	clear: both;
	content: " ";
}

.clear {
 clear: both;
}

/* link text decoration */
a {
	text-decoration: none;
	color: #0D1D2C;
 }​


/* ------------------------------------------------------------- */
/* Fonts */
/* ------------------------------------------------------------- */

@font-face {
    font-family: 'Saol';
    src: url('media/font/saol.eot') format('embedded-opentype');
		src: url('media/font/saol.woff') format("woff");
    font-weight: normal;
    font-style: normal;
}

/* headlines serif */

.headline {
	font-size: 100px;
}

h1 {
	font-family: 'Saol', serif;
	font-size: 60px;
	letter-spacing: 1pt;
	line-height: 1;
	color: #0D1D2C;
}

h2 {
	font-family: 'Saol', serif;
	font-size: 40px;
	letter-spacing: 1pt;
	line-height: 1.1;
	color: #0D1D2C;
}

h3 {
	font-family: 'Saol', serif;
	font-size: 27px;
	letter-spacing: 1pt;
	line-height: 1.3;
	color: #0D1D2C;
}



/* text sans-serif*/
.texth2 {
	font-family: questa-sans, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 40px;
	text-rendering: optimizeLegibility;
	letter-spacing: 1.1pt;
	line-height: 1.1;
	color: #0D1D2C;
	text-decoration: none;
}

.texth3 {
	font-family: questa-sans, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 27px;
	text-rendering: optimizeLegibility;
	letter-spacing: 1.1pt;
	line-height: 1.3;
	color: #0D1D2C;
	text-decoration: none;
}

body {
	font-family: questa-sans, sans-serif;
	font-weight: 400;
	font-style: normal;
	font-size: 16px;
	text-rendering: optimizeLegibility;
	letter-spacing: 0.9pt;
	line-height: 1.3;
	color: #0D1D2C;
	text-decoration: none;
}

.textSmall {
	font-family: 'Saol', serif;
	font-style: normal;
	font-size: 16px;
	letter-spacing: 0.8pt;
	line-height: 1.3;
	color: #0D1D2C;
}

.textExtraSmall {
	font-family: questa-sans, sans-serif;
	font-style: normal;
	font-size: 11px;
	letter-spacing: 0.8pt;
	line-height: 1.5;
	color: #0D1D2C;
	text-transform: uppercase;
}

.saol {
	font-family: 'Saol', serif;
}

/* text formatierungen */
.alignCenter {
	text-align: center;
}

.fontColor01 {
	color: #A29C94;
}

.fontColor02 {
	color: #42A5CF;
}

.fontColorWhite {
	color: white !important;
}

/* add font */
@font-face {
  font-family: 'Saol';
  src: url('media/font/saol.otf');
  font-weight: normal;
  font-style: normal;
}


/* ------------------------------------------------------------- */
/* Header menu */
/* ------------------------------------------------------------- */
.logo {
	position: fixed;
	z-index: 1;
	max-width: 100%;
	padding:20px;
	width: 150px;
}

.menu {
  position: fixed;
  padding: 20px;
  bottom: 0;
  left: 0;
  right: 0;
}

.footer {
  padding: 20px;
}

.textFooter {
	font-size: 60px;
	font-family: 'Saol', serif;
	font-style: normal;
	letter-spacing: 0.8pt;
	line-height: 1.3;
	color: #0D1D2C;
}


@font-face {
    font-family: 'Saol';
    src: url('media/font/saol.eot') format('embedded-opentype');
		src: url('media/font/saol.woff') format("woff");
    font-weight: normal;
    font-style: normal;
}

/* ------------------------------------------------------------- */
/* Hover */
/* ------------------------------------------------------------- */

 .hoverItalic:hover {
	font-style: italic;
	color: #0D1D2C;
 }

 .italic {
 font-style: italic;
 color: #0D1D2C;
 }

 .hoverOpacity:hover {
 	opacity: 0.8;
 }


 /* ------------------------------------------------------------- */
 /* Background Images & Colors; Icons */
 /* ------------------------------------------------------------- */


	.backgroundImage01 {
		background-image: url(media/img/home-header.jpg);
		background-size: 100%;
		background-color: #E2E0DF;
		background-position: center center;
		background-repeat:  no-repeat;
		background-attachment: fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  margin: auto;
	  min-width: 50%;
	  min-height: 50%;
		height: 100%;
		overflow: hidden;
}

	.backgroundImage02 {
		background-image: url(media/img/finca-header.jpg);
		background-size: 100%;
		background-color: #E2E0DF;
		background-position: center center;
		background-repeat:  no-repeat;
		background-attachment: fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  margin: auto;
	  min-width: 50%;
	  min-height: 50%;
		height: 100%;
		overflow: hidden;
	}

	.backgroundImage03 {
		background-image: url(media/img/croatia-header.jpg);
		background-size: 100%;
		background-color: #E2E0DF;
		background-position: center center;
		background-repeat:  no-repeat;
		background-attachment: fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  margin: auto;
	  min-width: 50%;
	  min-height: 50%;
		height: 100%;
		overflow: hidden;
	}

	.backgroundImage04 {
		background-image: url(media/img/gallery-header.jpg);
		background-size: 100%;
		background-color: #E2E0DF;
		background-position: center center;
		background-repeat:  no-repeat;
		background-attachment: fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  margin: auto;
	  min-width: 50%;
	  min-height: 50%;
		height: 100%;
		overflow: hidden;
	}

	.backgroundImage05 {
		background-image: url(media/img/contact-header.jpg);
		background-size: 100%;
		background-color: #E2E0DF;
		background-position: center center;
		background-repeat:  no-repeat;
		background-attachment: fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  margin: auto;
	  min-width: 50%;
	  min-height: 50%;
		height: 100%;
		overflow: hidden;
	}

	.backgroundImage06 {
		background-image: url(media/img/imprint-header.jpg);
		background-size: 100%;
		background-color: #E2E0DF;
		background-position: center center;
		background-repeat:  no-repeat;
		background-attachment: fixed;
		-webkit-background-size: cover;
		-moz-background-size: cover;
		-o-background-size: cover;
		background-size: cover;
		top: 0;
	  left: 0;
	  right: 0;
	  bottom: 0;
	  margin: auto;
	  min-width: 50%;
	  min-height: 50%;
		height: 100%;
		overflow: hidden;
	}

 /* Background Colors */
	.backgroundColor01 {
		background-color: #E2E0DF;
	}

	.backgroundColor02 {
		background-color: #42A5CF;
	}

	.backgroundColor03 {
		background-color: #A29C94;
	}

	/* Icons */
	 .icon01 {
		 width: 50px;
		 display: inline-block;
			margin-left: 27px;
		 margin-right: 27px;
		 margin-bottom: 7px;
		 border-radius: 50%;
	 }

	 .icon02 {
		 width: 50px;
		 display: inline-block;
	 }


/* ------------------------------------------------------------- */
/* Padding */
/* ------------------------------------------------------------- */

 .paddingTopBottomHeader {
	 padding-top: 330px;
	 padding-bottom: 330px;
 }

 .paddingLeftRight {
	padding-left: 250px;
	padding-right: 250px;
 }

 .paddingLeftRightSmall01 {
 padding-left: 150px;
 padding-right: 250px;
 }

 .paddingLeftRightSmall02 {
 padding-left: 250px;
 padding-right: 150px;
 }

 .paddingLeftRightSmall03 {
 padding-left: 50px;
 padding-right: 50px;
 }

 .paddingLeft200 {
	padding-left: 200px;
 }

 .paddingRight200 {
	padding-right: 200px;
 }

.paddingTopBottomSmall {
 padding-top: 50px;
 padding-bottom: 50px;
}

.paddingTopBottom {
padding-top: 100px;
padding-bottom: 100px;
}

.paddingTop {
padding-top: 100px;
}

.paddingZickZack {
	padding-top: 100px;
}

.paddingTop02 {
padding-top: 200px;
}

.paddingBottom {
padding-bottom: 100px;
}

.paddingBottomSmall {
padding-bottom: 50px;
}

.paddingBottomExtraSmall {
padding-bottom: 25px;
}

.paddingTopMedium {
 padding-top: 50px;
}

.paddingBottomPhone {
 padding-bottom: 0px;
}

.paddingTopSmall {
 padding-top: 25px;
}

.paddingTopExtraSmall {
 padding-top: 7px;
}

.paddingRight50 {
 padding-right: 75px;
}

.paddingLeft50 {
 padding-left: 50px;
}

.paddingLeft25 {
 padding-left: 25px;
}


.paddingRight50 {
 padding-right: 50px;
}

.paddingRight25 {
 padding-right: 25px;
}



/* Responsive Padding */
 .paddingRight25to0 {
	 padding-right: 25px;
 }

 .paddingGrid31 {
	 padding-right: 12px;
	 padding-left: 12px;
 }

 /* ------------------------------------------------------------- */
 /* Grids */
 /* ------------------------------------------------------------- */

.grid31 {
 width: 33%;
 float: left;
}

.grid33 {
	width: 33%;
	float: left;
}

.grid20 {
	width: 20%;
	float: left;
}

.grid25 {
	width: 25%;
	float: left;
}

.grid40 {
	width: 40%;
	float: left;
}

.grid50 {
	width: 50%;
	float: left;
}

.grid50ZickZack {
	width: 50%;
	float: left;
}

.floatRight {
	float: right;
}

#Inhalte-werden-zentriert {
  display: flex;
  align-items: center;
  justify-content: center;
}

 /* div für Tabelle grid100 */
div.table {
	display: table;
	width: calc(100% - 10px);
}

 /* div für Spalten, z.B. grid50 */
div.spalte {
	display: table-cell;
	width: 200px;
}


/* ------------------------------------------------------------- */
/* Buttons */
/* ------------------------------------------------------------- */

.btn {
  border: 1px solid white;
  background-color: #A29C94;
  color: white !important;
  padding: 14px 28px;
  cursor: pointer;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

/* Button01 */
.bookNow {
  border-color: white;
  color: white !important;
}

.bookNow:hover {
  background-color: white;
  color: #A29C94 !important;
}

/* Button02 */
.btnGallery {
  border: 1px solid #A29C94;
  background-color: white;
  color: #A29C94 !important;
  padding: 14px 28px;
  cursor: pointer;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.gallery {
  border-color: #A29C94;
  color: #A29C94 !important;
}

.gallery:hover {
  background-color: #A29C94;
  color: white !important;
}

/* Button03 */
.btnContact {
  border: 1px solid #A29C94;
  background-color: #E2E0DF;
  color: #A29C94 !important;
  padding: 14px 28px;
  cursor: pointer;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.contact {
  border-color: #A29C94;
  color: #A29C94 !important;
}

.contact:hover {
  background-color: #A29C94;
  color: white !important;
}

/* Button04 */
.btnAirbnb {
  border: 1px solid white;
  background-color: #42A5CF;
  color: white !important;
  padding: 14px 28px;
  cursor: pointer;
	margin-left: auto;
	margin-right: auto;
	text-align: center;
}

.airbnb {
  border-color: white;
  color: white !important;
}

.airbnb:hover {
  background-color: white;
  color: #42A5CF !important;
}


.hideOnMac {
		visibility: hidden !important;
		clear: both !important;
		display: none !important;
}
















/* --------------------------------------------------- */
/* RESPONSIVE SETTINGS – BIGGER DEVICES */
/* --------------------------------------------------- */


/* ----------- Laptop, Non-Retina Screens ----------- */
@media screen
  and (min-width: 1200px)
  and (max-width: 1600px)
  and (-webkit-min-device-pixel-ratio: 1) {


	.grid31 {
		width: 33%;
		float: left;
	}



	h1 {
		font-family: 'Saol', serif;
		font-size: 60px;
		letter-spacing: 1pt;
		line-height: 1;
		color: #0D1D2C;
	}

	h2 {
		font-family: 'Saol', serif;
		font-size: 40px;
		letter-spacing: 1pt;
		line-height: 1.1;
		color: #0D1D2C;
	}

	h3 {
		font-family: 'Saol', serif;
		font-size: 27px;
		letter-spacing: 1pt;
		line-height: 1.3;
		color: #0D1D2C;
	}



	/* text sans-serif*/
	.texth2 {
		font-family: questa-sans, sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 40px;
		text-rendering: optimizeLegibility;
		letter-spacing: 1.1pt;
		line-height: 1.1;
		color: #0D1D2C;
		text-decoration: none;
	}

	.texth3 {
		font-family: questa-sans, sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 27px;
		text-rendering: optimizeLegibility;
		letter-spacing: 1.1pt;
		line-height: 1.3;
		color: #0D1D2C;
		text-decoration: none;
	}

	body {
		font-family: questa-sans, sans-serif;
		font-weight: 400;
		font-style: normal;
		font-size: 16px;
		text-rendering: optimizeLegibility;
		letter-spacing: 0.9pt;
		line-height: 1.3;
		color: #0D1D2C;
		text-decoration: none;
	}

	.textSmall {
		font-family: 'Saol', serif;
		font-style: normal;
		font-size: 16px;
		letter-spacing: 0.8pt;
		line-height: 1.3;
		color: #0D1D2C;
	}

	.textExtraSmall {
		font-family: questa-sans, sans-serif;
		font-style: normal;
		font-size: 11px;
		letter-spacing: 0.8pt;
		line-height: 1.5;
		color: #0D1D2C;
		text-transform: uppercase;
	}

	.headline {
		font-size: 100px;
	}

	.grid50ZickZack {
		width: 50%;
		float: left;
	}

	.paddingBottomPhone {
	 padding-bottom: 0px;
	}

	.hideOnMac {
			visibility: hidden !important;
			clear: both !important;
			display: none !important;
	}

	.logo {
		width: 150px;
	}

}


/* ----------- Laptop, Retina Screens ----------- */
@media screen
  and (min-width: 1200px)
  and (max-width: 1600px)
  and (-webkit-min-device-pixel-ratio: 2)
  and (min-resolution: 192dpi) {

		.grid31 {
			width: 33%;
			float: left;
		}


		h1 {
			font-family: 'Saol', serif;
			font-size: 60px;
			letter-spacing: 1pt;
			line-height: 1;
			color: #0D1D2C;
		}

		h2 {
			font-family: 'Saol', serif;
			font-size: 40px;
			letter-spacing: 1pt;
			line-height: 1.1;
			color: #0D1D2C;
		}

		h3 {
			font-family: 'Saol', serif;
			font-size: 27px;
			letter-spacing: 1pt;
			line-height: 1.3;
			color: #0D1D2C;
		}



		/* text sans-serif*/
		.texth2 {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 40px;
			text-rendering: optimizeLegibility;
			letter-spacing: 1.1pt;
			line-height: 1.1;
			color: #0D1D2C;
			text-decoration: none;
		}

		.texth3 {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 27px;
			text-rendering: optimizeLegibility;
			letter-spacing: 1.1pt;
			line-height: 1.3;
			color: #0D1D2C;
			text-decoration: none;
		}

		body {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 16px;
			text-rendering: optimizeLegibility;
			letter-spacing: 0.9pt;
			line-height: 1.3;
			color: #0D1D2C;
			text-decoration: none;
		}

		.textSmall {
			font-family: 'Saol', serif;
			font-style: normal;
			font-size: 16px;
			letter-spacing: 0.8pt;
			line-height: 1.3;
			color: #0D1D2C;
		}

		.textExtraSmall {
			font-family: questa-sans, sans-serif;
			font-style: normal;
			font-size: 11px;
			letter-spacing: 0.8pt;
			line-height: 1.5;
			color: #0D1D2C;
			text-transform: uppercase;
		}

		.headline {
			font-size: 100px;
		}


		.grid50ZickZack {
			width: 50%;
			float: left;
		}

		.paddingBottomPhone {
		 padding-bottom: 0px;
		}

		.hideOnMac {
				visibility: hidden !important;
				clear: both !important;
				display: none !important;
		}

		.logo {
			width: 150px;
		}

}







/* --------------------------------------------------- */
/* RESPONSIVE SETTINGS – SMALLER DEVICES */
/* --------------------------------------------------- */


/* ----------- 500px - iPad 1, 2, Mini and Air ----------- */
/* Portrait and Landscape */
@media only screen
  and (min-width: 500px) /* minimale bildschrimbreite */
  and (max-width: 1024px) /* ipad */
  and (-webkit-min-device-pixel-ratio: 1) {

		h1 {
			font-family: 'Saol', serif;
			font-size: 60px;
			letter-spacing: 1pt;
			line-height: 1;
			color: #0D1D2C;
		}

		h2 {
			font-family: 'Saol', serif;
			font-size: 40px;
			letter-spacing: 1pt;
			line-height: 1.1;
			color: #0D1D2C;
		}

		h3 {
			font-family: 'Saol', serif;
			font-size: 27px;
			letter-spacing: 1pt;
			line-height: 1.3;
			color: #0D1D2C;
		}



		/* text sans-serif*/
		.texth2 {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 40px;
			text-rendering: optimizeLegibility;
			letter-spacing: 1.1pt;
			line-height: 1.1;
			color: #0D1D2C;
			text-decoration: none;
		}

		.texth3 {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 27px;
			text-rendering: optimizeLegibility;
			letter-spacing: 1.1pt;
			line-height: 1.3;
			color: #0D1D2C;
			text-decoration: none;
		}

		body {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 16px;
			text-rendering: optimizeLegibility;
			letter-spacing: 0.9pt;
			line-height: 1.3;
			color: #0D1D2C;
			text-decoration: none;
		}

		.textSmall {
			font-family: 'Saol', serif;
			font-style: normal;
			font-size: 16px;
			letter-spacing: 0.8pt;
			line-height: 1.3;
			color: #0D1D2C;
		}

		.textExtraSmall {
			font-family: questa-sans, sans-serif;
			font-style: normal;
			font-size: 11px;
			letter-spacing: 0.8pt;
			line-height: 1.5;
			color: #0D1D2C;
			text-transform: uppercase;
		}

		.headline {
			font-size: 80px;
		}




		/* padding & grids */
		div.spalte {
				display: inherit;
				width: 100%;
		}

		.paddingRightPhone {
			padding-right: 0px;
		}

		.paddingLeftPhone {
			padding-left: 0px;
		}

		.paddingLeftRight {
		 padding-left: 150px;
		 padding-right: 150px;
		}

		.paddingBottomPhone {
		 padding-bottom: 100px;
		}

		.paddingBottomExtraSmall {
		padding-bottom: 100px;
		}

		.paddingLeftRightSmall01 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.paddingLeftRightSmall02 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.paddingTop02 {
		padding-top: 0px;
		}

		.grid50ZickZack {
			width: 100%;
		}

		.grid31 {
			width: 100%;
		}

		.grid100Phone {
			width: 100%;
		}

		.imgWidthResp {
			max-width: 100%;
			height: auto;
			display: block;
			margin-left: auto;
			margin-right: auto;
		}

		.textWidthResp {
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
		}

		.img100Phone {
		width: 100%;
		height: auto;
	}

		.img80Phone {
		width: 80%;
		height: auto;
	}


		.paddingBottomPhone {
		 padding-bottom: 50px;
		}



		.hideOnMac {
				visibility: hidden !important;
				clear: both !important;
				display: none !important;
		}

		.hideOnIpad {
			visibility: hidden !important;
			clear: both !important;
			display: none !important;
		}

		.showOnIpad {
			visibility: visible !important;
			clear:both !important;
			display: inherit !important;
		}

		.logo {
			width: 150px;
		}
}







/* ----------- 500px - 700px ----------- */
/* minimale Bildschirmbreite - in between  */
@media only screen
  and (min-width: 500px) /* minimale bildschrimbreite */
  and (max-width: 700px) /* in between */
  and (-webkit-min-device-pixel-ratio: 1) {

		h1 {
			font-family: 'Saol', serif;
			font-size: 40px;
			letter-spacing: 1pt;
			line-height: 1;
			color: #0D1D2C;
		}

		h2 {
			font-family: 'Saol', serif;
			font-size: 40px;
			letter-spacing: 1pt;
			line-height: 1.1;
			color: #0D1D2C;
		}

		h3 {
			font-family: 'Saol', serif;
			font-size: 27px;
			letter-spacing: 1pt;
			line-height: 1.3;
			color: #0D1D2C;
		}



		/* text sans-serif*/
		.texth2 {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 40px;
			text-rendering: optimizeLegibility;
			letter-spacing: 1.1pt;
			line-height: 1.1;
			color: #0D1D2C;
			text-decoration: none;
		}

		.texth3 {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 27px;
			text-rendering: optimizeLegibility;
			letter-spacing: 1.1pt;
			line-height: 1.3;
			color: #0D1D2C;
			text-decoration: none;
		}

		body {
			font-family: questa-sans, sans-serif;
			font-weight: 400;
			font-style: normal;
			font-size: 16px;
			text-rendering: optimizeLegibility;
			letter-spacing: 0.9pt;
			line-height: 1.3;
			color: #0D1D2C;
			text-decoration: none;
		}

		.textSmall {
			font-family: 'Saol', serif;
			font-style: normal;
			font-size: 16px;
			letter-spacing: 0.8pt;
			line-height: 1.3;
			color: #0D1D2C;
		}

		.textExtraSmall {
			font-family: questa-sans, sans-serif;
			font-style: normal;
			font-size: 11px;
			letter-spacing: 0.8pt;
			line-height: 1.5;
			color: #0D1D2C;
			text-transform: uppercase;
		}

		.headline {
			font-size: 60px;
		}

		/* padding & grids */
		div.spalte {
				display: inherit;
				width: 100%;
		}

		.paddingRightPhone {
			padding-right: 0px;
		}

		.paddingLeftPhone {
			padding-left: 0px;
		}

		.paddingLeftRight {
			 padding-left: 60px;
			 padding-right: 60px;
		}

		.paddingBottomPhone {
		 padding-bottom: 100px;
		}

		.paddingTop02 {
		padding-top: 0px;
		}

		.paddingLeftRightSmall01 {
		padding-left: 60px;
		padding-right: 60px;
		}

		.paddingLeftRightSmall02 {
		padding-left: 60px;
		padding-right: 60px;
		}

		.grid50ZickZack {
			width: 100%;
		}

		.grid31 {
			width: 100%;
		}

		.grid100Phone {
			width: 100%;
		}

		.imgWidthResp {
			max-width: 100%;
			height: auto;
			display: block;
			margin-left: auto;
			margin-right: auto;
		}

		.textWidthResp {
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
		}

		.img100Phone {
		width: 100%;
		height: auto;
	}

		.img80Phone {
		width: 80%;
		height: auto;
	}

}













/* ----------- iPhone X ----------- */
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 375px)
  and (max-device-width: 812px)
  and (-webkit-min-device-pixel-ratio: 3) {

		/* typo */
		body {
			font-size: 40px;
		}

		.textSmall {
			font-size: 40px;
		}

		.textExtraSmall {
			font-size: 16px;
		}

		.texth3 {
			font-size: 45px;
		}

		h3 {
			font-size: 60px;
		}

		h2 {
			font-size: 60px;
			line-height: 1.2;
		}

		.texth2 {
			font-size: 60px;
			line-height: 1.2;
		}


		/* padding & grids */
		div.spalte {
				display: inherit;
				width: 100%;
		}

		.paddingRightPhone {
			padding-right: 0px;
		}

		.paddingLeftPhone {
			padding-left: 0px;
		}

		.paddingLeftRight {
		 padding-left: 150px;
		 padding-right: 150px;
		}

		.paddingBottomPhone {
		 padding-bottom: 100px;
		}

		.paddingBottomExtraSmall {
		padding-bottom: 100px;
		}

		.paddingLeftRightSmall01 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.paddingLeftRightSmall02 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.paddingTop02 {
		padding-top: 0px;
		}

		.grid50ZickZack {
			width: 100%;
		}

		.grid31 {
			width: 100%;
		}

		.grid100Phone {
			width: 100%;
		}

		.imgWidthResp {
			max-width: 100%;
			height: auto;
			display: block;
			margin-left: auto;
			margin-right: auto;
		}

		.textWidthResp {
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
		}

		.img100Phone {
		width: 100%;
		height: auto;
	}

		.img80Phone {
		width: 80%;
		height: auto;
	}


	/* buttons, images & co */
		.btn {
		  padding: 34px 48px;
		}

		.btnGallery {
		  padding: 34px 48px;
		}

		.btnContact {
		  padding: 34px 48px;
		}

		.btnAirbnb {
		  padding: 34px 48px;
		}

		.logo {
			width: 250px;
		}

		.backgroundImage01 {
			background-attachment: inherit;
	}

	.backgroundImage02 {
		background-attachment: inherit;
	}

	.backgroundImage03 {
		background-attachment: inherit;
	}

	.backgroundImage04 {
		background-attachment: inherit;
	}

	.backgroundImage05 {
		background-attachment: inherit;
	}

	.backgroundImage06 {
		background-attachment: inherit;
	}

	.hideOnPhone {
			visibility: hidden !important;
			clear: both !important;
			display: none !important;
	}

	.hideOnMac {
		visibility: visible !important;
		clear:both !important;
		display: inherit !important;
	}



}

/* ----------- iPhone 6+, 7+ and 8+ ----------- */
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 414px)
  and (max-device-width: 736px)
  and (-webkit-min-device-pixel-ratio: 3) {

		/* typo */
		body {
			font-size: 40px;
		}

		.textSmall {
			font-size: 40px;
		}

		.textExtraSmall {
			font-size: 16px;
		}

		.texth3 {
			font-size: 45px;
		}

		h3 {
			font-size: 60px;
		}

		h2 {
			font-size: 60px;
			line-height: 1.2;
		}

		.texth2 {
			font-size: 60px;
			line-height: 1.2;
		}


		/* padding & grids */
		div.spalte {
				display: inherit;
				width: 100%;
		}

		.paddingRightPhone {
			padding-right: 0px;
		}

		.paddingTop02 {
		padding-top: 0px;
		}

		.paddingLeftPhone {
			padding-left: 0px;
		}

		.paddingLeftRight {
		 padding-left: 150px;
		 padding-right: 150px;
		}

		.paddingBottomPhone {
		 padding-bottom: 100px;
		}

		.paddingBottomExtraSmall {
		padding-bottom: 100px;
		}

		.paddingLeftRightSmall01 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.paddingLeftRightSmall02 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.grid50ZickZack {
			width: 100%;
		}

		.grid31 {
			width: 100%;
		}

		.grid100Phone {
			width: 100%;
		}

		.imgWidthResp {
			max-width: 100%;
			height: auto;
			display: block;
			margin-left: auto;
			margin-right: auto;
		}

		.textWidthResp {
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
		}

		.img100Phone {
		width: 100%;
		height: auto;
	}

		.img80Phone {
		width: 80%;
		height: auto;
	}


	/* buttons, images & co */

		.btn {
		  padding: 34px 48px;
		}

		.btnGallery {
		  padding: 34px 48px;
		}

		.btnContact {
		  padding: 34px 48px;
		}

		.btnAirbnb {
		  padding: 34px 48px;
		}

		.logo {
			width: 250px;
		}

		.backgroundImage01 {
			background-attachment: inherit;
	}

	.backgroundImage02 {
		background-attachment: inherit;
	}

	.backgroundImage03 {
		background-attachment: inherit;
	}

	.backgroundImage04 {
		background-attachment: inherit;
	}

	.backgroundImage05 {
		background-attachment: inherit;
	}

	.backgroundImage06 {
		background-attachment: inherit;
	}

	.hideOnPhone {
			visibility: hidden !important;
			clear: both !important;
			display: none !important;
	}

	.hideOnMac {
		visibility: visible !important;
		clear:both !important;
		display: inherit !important;
	}



}





	/* ----------- iPhone 6, 6S, 7 and 8 ----------- */
/* Portrait and Landscape */
@media only screen
  and (min-device-width: 375px)
  and (max-device-width: 667px)
  and (-webkit-min-device-pixel-ratio: 2) {

		/* typo */
		body {
			font-size: 40px;
		}

		.textSmall {
			font-size: 40px;
		}

		.textExtraSmall {
			font-size: 16px;
		}

		.texth3 {
			font-size: 45px;
		}

		h3 {
			font-size: 60px;
		}

		h2 {
			font-size: 60px;
			line-height: 1.2;
		}

		.texth2 {
			font-size: 60px;
			line-height: 1.2;
		}


		/* padding & grids */
		div.spalte {
				display: inherit;
				width: 100%;
		}

		.paddingRightPhone {
			padding-right: 0px;
		}

		.paddingLeftPhone {
			padding-left: 0px;
		}

		.paddingLeftRight {
		 padding-left: 150px;
		 padding-right: 150px;
		}

		.paddingBottomPhone {
		 padding-bottom: 100px;
		}

		.paddingBottomExtraSmall {
		padding-bottom: 100px;
		}

		.paddingTop02 {
		padding-top: 0px;
		}

		.paddingLeftRightSmall01 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.paddingLeftRightSmall02 {
		padding-left: 150px;
		padding-right: 150px;
		}

		.grid50ZickZack {
			width: 100%;
		}

		.grid31 {
			width: 100%;
		}

		.grid100Phone {
			width: 100%;
		}

		.imgWidthResp {
			max-width: 100%;
			height: auto;
			display: block;
			margin-left: auto;
			margin-right: auto;
		}

		.textWidthResp {
		width: 100%;
		display: block;
		margin-left: auto;
		margin-right: auto;
		}

		.img100Phone {
		width: 100%;
		height: auto;
	}

		.img80Phone {
		width: 80%;
		height: auto;
	}


	/* buttons, images & co */

		.btn {
			padding: 34px 48px;
		}

		.btnGallery {
			padding: 34px 48px;
		}

		.btnContact {
			padding: 34px 48px;
		}

		.btnAirbnb {
			padding: 34px 48px;
		}

		.logo {
			width: 250px;
		}

		.backgroundImage01 {
			background-attachment: inherit;
	}

	.backgroundImage02 {
		background-attachment: inherit;
	}

	.backgroundImage03 {
		background-attachment: inherit;
	}

	.backgroundImage04 {
		background-attachment: inherit;
	}

	.backgroundImage05 {
		background-attachment: inherit;
	}

	.backgroundImage06 {
		background-attachment: inherit;
	}

		.paddingLeftRight {
		 padding-left: 60px;
		 padding-right: 60px;
		}

		.hideOnPhone {
				visibility: hidden !important;
				clear: both !important;
				display: none !important;
		}

		.hideOnMac {
			visibility: visible !important;
			clear:both !important;
			display: inherit !important;
		}




}


	/* PHONE */
	/* ----------- iPhone 5, 5S, 5C and 5SE ----------- */
	/* Portrait and Landscape */
	@media only screen
	  and (min-device-width: 320px)
	  and (max-device-width: 568px)
	  and (-webkit-min-device-pixel-ratio: 2) {

			/* typo */
			body {
				font-size: 40px;
			}

			.textSmall {
				font-size: 40px;
			}

			.textExtraSmall {
				font-size: 16px;
			}

			.texth3 {
				font-size: 45px;
			}

			h3 {
				font-size: 60px;
			}

			h2 {
				font-size: 60px;
				line-height: 1.2;
			}

			.texth2 {
				font-size: 60px;
				line-height: 1.2;
			}


			/* padding & grids */
			div.spalte {
					display: inherit;
					width: 100%;
			}

			.paddingRightPhone {
				padding-right: 0px;
			}

			.paddingLeftPhone {
				padding-left: 0px;
			}

			.paddingLeftRight {
				 padding-left: 60px;
				 padding-right: 60px;
			}

			.paddingBottomPhone {
			 padding-bottom: 100px;
			}

			.paddingBottomExtraSmall {
			padding-bottom: 100px;
			}

			.paddingTop02 {
			padding-top: 0px;
			}

			.paddingLeftRightSmall01 {
			padding-left: 60px;
			padding-right: 60px;
			}

			.paddingLeftRightSmall02 {
			padding-left: 60px;
			padding-right: 60px;
			}

			.grid50ZickZack {
				width: 100%;
			}

			.grid31 {
				width: 100%;
			}

			.grid100Phone {
				width: 100%;
			}

			.imgWidthResp {
				max-width: 100%;
				height: auto;
				display: block;
				margin-left: auto;
				margin-right: auto;
			}

			.textWidthResp {
			width: 100%;
			display: block;
			margin-left: auto;
			margin-right: auto;
			}

			.img100Phone {
			width: 100%;
			height: auto;
		}

			.img80Phone {
			width: 80%;
			height: auto;
		}


		/* buttons, images & co */

			.btn {
				padding: 34px 48px;
			}

			.btnGallery {
				padding: 34px 48px;
			}

			.btnContact {
				padding: 34px 48px;
			}

			.btnAirbnb {
				padding: 34px 48px;
			}

			.logo {
				width: 250px;
			}

			.backgroundImage01 {
				background-attachment: inherit;
		}

		.backgroundImage02 {
			background-attachment: inherit;
		}

		.backgroundImage03 {
			background-attachment: inherit;
		}

		.backgroundImage04 {
			background-attachment: inherit;
		}

		.backgroundImage05 {
			background-attachment: inherit;
		}

		.backgroundImage06 {
			background-attachment: inherit;
		}

		.hideOnPhone {
				visibility: hidden !important;
				clear: both !important;
				display: none !important;
		}

		.hideOnMac {
			visibility: visible !important;
			clear:both !important;
			display: inherit !important;
		}




	}