* {
  margin: 0;
  padding: 0;
  -webkit-box-sizing:border-box;
    -moz-box-sizing: border-box;
         box-sizing: border-box;
}

body {
	background-color:#ffffff;
  }

h1{
	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 55px;
  	line-height: 65px;
	margin-bottom: 30px;
	color:#947b59;
}

h2,
h3{
	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 45px;
  	line-height: 55px;
	margin-bottom: 20px;
	color:#947b59;
}

h4{
	font-family: 'Vollkorn', sans-serif;
	font-weight:700;
	font-size: 20px;
  	line-height: 30px;
	color:#947b59;
}


p{
  	font-family: 'Heebo', sans-serif;
	font-weight:400;
	font-size: 17px;
  	line-height: 28px;
	color:#3e4f58;
}

li{
  	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 20px;
  	line-height: 32px;
	color:#3e4f58;
}

b {
  	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 20px;
  	line-height: 30px;
	color:#3e4f58;
}

a {
  	font-family: 'Heebo', sans-serif;
	font-weight:400;
	font-size: 17px;
  	line-height: 28px;
	text-decoration:none;
	color:#947b59;
}

a:hover {
	text-decoration: underline;
}


@media (max-width: 768px) {
	
	
h1{
	font-size: 32px;
  	line-height: 42px;
	margin-bottom: 30px;
}

h2,
h3{
	font-size: 26px;
  	line-height: 36px;
	margin-bottom: 20px;
}


p,
a{
	font-size: 15px;
  	line-height: 25px;
}

li,
b{
	font-size: 16px;
  	line-height: 26px;
}


}



.wrapper {
  height: 100vh;
  width: 100vw;
  
}



/******************** Header ********************/

header {
	position:fixed;
	width: 100%;
	height: 80px;
	background: #002147;
	margin-top: 0;
	padding: 25px 0;
	z-index:8888;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}


header .container {
  	width: 95%;
	}
	
	
/******************** Header - Logo ********************/

.logo{
	float: left;
}

.logo img{
	width:auto;
	height: 25px;
}


/******************** Header - Navigation ********************/





.toggle,
[id^=drop] {
	display: none;
}

nav { 
	margin:0;
	padding: 0;
}

nav:after {
	content:"";
	display:table;
	clear:both;
}

nav ul {
	float: right;
	padding:0;
	margin:0;
	list-style: none;
	position: relative;
}
	
nav ul li {
	margin: 0px;
	display:inline-block;
	float: left;
}

nav ul li .selected,
nav ul li ul li .selected {
	color:#947b59;
	text-decoration:none;
}
	
nav a {
	font-family: 'Vollkorn', sans-serif;
	font-weight:700;
	font-size: 20px;
  	line-height: 29px;
	color:#fff;
	
	display:block;
	padding:5px 25px;	
	text-decoration:none;
}

nav ul li ul li:hover { 
	color:#947b59;
	text-decoration:none;
}

nav a:hover { 
	color:#947b59;
	text-decoration:none;
}

nav ul ul {
	display: none;
	position: absolute; 
	top: 40px; 
	background-color: #002147;
}
	
nav ul li:hover > ul {
	display:inherit;
}
	
nav ul ul li {
	width:200px;
	float:none;
	display:list-item;
	position: relative;
	list-style:none;
}

nav ul ul li a {
	font-family: 'Vollkorn', sans-serif;
	font-weight:400;
	font-size: 17px;
  	line-height: 27px;
	color:#fff;
	letter-spacing: 0.3px;
	text-transform:none;
	padding: 10px 20px;
}





@media all and (max-width : 1500px) {

	nav {
		margin: 0;

	}

	.toggle + a,
	.menu {
		display: none;
	}
	
	.menu {
		margin-top: 12px;
		float:left;
		width: 100%;
	}

	.toggle {
		font-family: 'Vollkorn', sans-serif;
		font-weight:700;
		font-size: 17px;
  		line-height: 26px;
		color:#fff;
		
		display: block;
		padding: 6px 24px;	
		
		text-decoration:none;
		border:none;
	}
	
	.toggle span{
		font-size:30px;
		font-weight:bold;
		float:right;
		margin-right: -20px;
	}

	.toggle:hover {
		color:#947b59;
	}
	

	[id^=drop]:checked + ul {
		display: block;
	}
	
	nav ul {
		background-color:#002147;
	}

	nav ul li {
		display: block;
		width: 100%;
		padding-top: 3px;
		padding-bottom: 3px;
	}

	nav ul ul .toggle,
	nav ul ul a {
		padding: 0 40px;
	}

  
	nav ul li ul li .toggle,
	nav ul ul a,
  	nav ul ul ul a{
		padding:14px 20px;	
		color:#FFF;
		font-size:17px; 
	}

  
	nav ul li ul li .toggle,
	nav ul ul a {
		background-color: #002147;
	}

	nav ul ul {
		float: none;
		position:static;
		color: #ffffff;
	}
		
	nav ul ul li:hover > ul,
	nav ul li:hover > ul {
		display: none;
	}
		
	nav ul ul li {
		display: block;
		width: 100%;
		padding-left: 30px;
	}


}


@media screen and (max-width: 1100px) {
	
	.menu {
		margin-top: 9px;
	}
	
	header {
		height: 55px;
		margin-top: 0;
		padding: 6px 0;
	}

	header .container {
  		width: 85%;
	}

	.logo img{
		width:auto;
		height:20px;
		margin-top: 11px;
	}
	
	.toggle span{
		margin-top: 2px;
	}

}


@media screen and (max-width: 768px) {
	
	header .container {
  		width: 90%;
	}
	

	.toggle,
	nav a {
		font-size: 15px;
	}

	nav ul ul li a {
		font-size: 14px;
		padding: 8px 20px;
	}
	
	nav ul li {
		padding-top: 0;
		padding-bottom: 0;
	}
	
	.logo img{
		width:auto;
		height:17px;
		margin-top: 13px;
	}
	
	.toggle span{
		font-size:27px;
	}

}

@media all and (max-width : 330px) {

	nav ul li {
		display:block;
		width: 94%;
	}

}






/******************** Icons ********************/

.icons {
	width: 100%;
	height: 100%;
	z-index:8888;
	
	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;
	
	-webkit-justify-content: flex-end;
	-moz-justify-content: flex-end;
	-ms-justify-content: flex-end;
	justify-content: flex-end;
}

.icons .container {
	width: 70px;
	height: 100%;
	position:fixed;
	
	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;
	
	-webkit-align-items: flex-end;
	-moz-align-items: flex-end;
	-ms-align-items: flex-end;
	align-items: flex-end;
}

.icons .container .calender{
	position:fixed;
	width: 70px;
	height: 70px;
	background-color: #947b59;
}

.icons .container .calender img{
	width: 100%;
	height: auto;	
}

.icons .container .calender:hover{
	background-color: #002147;

}




@media screen and (max-width: 768px) {

	
.icons .container {
	width: 50px;
}
	
.icons .container .calender{
	width: 50px;
	height: 50px;
}



}





/* Imagebild + Text*/

.home {
	width: 100%;
	height: 100vh;
	background: url('../img/casa-lanzarote-ferienhaeuser-spanien.jpg') no-repeat center center;
  	background-size: cover;
  	background-position: center;
	
  	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}

.home .container{
	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
	
	-webkit-align-items: flex-end;
	-moz-align-items: flex-end;
	-ms-align-items: flex-end;
	align-items: flex-end;
	margin-bottom: 120px;
}

.home .container .box {
	margin: 0 auto 250px auto;
	text-align:left;
}

.home .container .box p{
	font-family: 'Vollkorn', sans-serif;
	font-weight:700;
	font-size: 230px;
  	line-height: 52px;
	color:#fff;
	letter-spacing: -5px;
}


@media (max-width: 1300px) {
	
	.home .container .box {
		margin: 0 auto 100px auto;
	}

	.home .container .box p{
		font-size: 150px;
  		line-height: 250px;
	}

}


@media screen and (max-width: 768px) {
	
	.home .container .box {
		margin: 0 auto 150px auto;
	}

	.home .container .box p{
		font-size: 45px;
  		line-height: 55px;
		letter-spacing: 0px;
	}

}




.lanzarote{
	background: url('../img/header/lanzarote-casa-lanzarote-spanien.jpg') no-repeat center center;
}

.ferienhaeuser{
	background: url('../img/header/ferienhaeuser-casa-lanzarote-spanien.jpg') no-repeat center center;
}

.ferienwohnung{
	background: url('../img/header/ferienwohnung-casa-lanzarote-spanien.jpg') no-repeat center center;
}

.villa{
	background: url('../img/header/villa-casa-lanzarote-spanien.jpg') no-repeat center center;
}

.finca{
	background: url('../img/header/finca-casa-lanzarote-spanien.jpg') no-repeat center center;
}

.ferienhaus{
	background: url('../img/header/ferienhaus-casa-lanzarote-spanien.jpg') no-repeat center center;
}

.casa-lanzarote{
	background: url('../img/header/ueber-casa-lanzarote-spanien.jpg') no-repeat center center;
}

.kontakt-lanzarote{
	background: url('../img/header/kontakt-casa-lanzarote-spanien.jpg') no-repeat center center;
}



.lanzarote,
.ferienhaeuser,
.ferienwohnung,
.villa,
.finca,
.ferienhaus,
.casa-lanzarote,
.kontakt-lanzarote{
	width: 100%;
	height: 700px;
  	background-size: cover;
  	background-position: center;
	
  	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;
	
	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}


@media only screen and (max-width: 1100px) {


}

@media (max-width: 768px) {
	

.lanzarote{
	background: url('../img/header/lanzarote-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}

.ferienhaeuser{
	background: url('../img/header/ferienhaeuser-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}

.ferienwohnung{
	background: url('../img/header/ferienwohnung-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}

.villa{
	background: url('../img/header/villa-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}

.finca{
	background: url('../img/header/finca-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}

.ferienhaus{
	background: url('../img/header/ferienhaus-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}

.casa-lanzarote{
	background: url('../img/header/ueber-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}

.kontakt-lanzarote{
	background: url('../img/header/kontakt-casa-lanzarote-spanien-mobil.jpg') no-repeat center center;
}
	
.lanzarote,
.ferienhaeuser,
.ferienwohnung,
.villa,
.finca,
.ferienhaus,
.casa-lanzarote,
.kontakt-lanzarote{
		width: 100%;
		height: 350px;
  		background-size: cover;
  		background-position: center;
	
  		-webkit-display: flex;
		-moz-display: flex;
		-ms-display: flex;
		display: flex;
	
		-webkit-justify-content: center;
		-moz-justify-content: center;
		-ms-justify-content: center;
		justify-content: center;

}

}




/******************** Header 2 ********************/

.header {
	position:absolute;
	width: 100%;
	z-index:8888;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}

.header .container {
  	width: 95%;
	}

.header .logo{
	float: left;
}

.header .logo img{
	width:auto;
	height: auto;
	margin-top: 20px;
}


}


@media screen and (max-width: 1000px) {
	
	.header .container {
  		width: 85%;
	}
}


@media screen and (max-width: 768px) {
	
	.header {
		height: 130px;
		background-color: #FFF;
	}
	
	.header .container {
  		width: 90%;
	}
	
	.header .logo img{
		width:120px;
		margin-top: 10px;
		height: auto;
	}

}


/********************* Anfangstext  *********************/


main{
	width: 100%;
	margin: 140px 0 140px 0;
	background-color:#FFF;
}


main .container {
	width: 65%;
	margin: 0 auto 0 auto;
	text-align:left;
}

main .container ul{
	margin: 30px 0 45px 0;
}
  
main .container li{
	list-style-type: none;
	margin-bottom: 6px;
}

main .container li img{
	margin-right: 10px;
	margin-bottom: -5px;
}

main .container h4{
	color:#3e4f58;
}

main .container strong{
  	font-family: 'Heebo', sans-serif;
	font-weight:400;
	color:#3e4f58;
}





main .container .image {
	margin: 30px 0;
	
	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
}

main .container .image .article{
  	width: 30%;
	margin-bottom: 30px;
}

main .container .image .article  img{
  	width: 100%;
}


@media only screen and (max-width: 1200px) {
	
	main{
		margin: 100px 0 100px 0;
	}

	main .container{
		width: 85%;
	}
	
	main .container .image .article{
  		width: 47%;
		margin-bottom: 30px;
	}
}

@media (max-width: 768px) {
	
	main{
		margin: 70px 0 70px 0;
	}
	
	main .container{
		width: 90%;
	}
	
	main .container li{
		list-style-type: none;
		margin-bottom: 4px;
	}
	
	main .container li img{
		width: 25px;
		margin-right: 10px;
		margin-bottom: -5px;
	}
	
	main .container .image .article{
  		width: 100%;
		margin-bottom: 30px;
	}
	
}





/********************* Anfangstext  *********************/


.main{
	width: 100%;
	padding: 200px 0 120px 0;
	background-color:#FFF;
}

.main .container {
	width: 65%;
	margin: 0 auto 0 auto;
	text-align:left;
}
  
.main .container h4{
	margin-top: 30px;
}



@media only screen and (max-width: 1200px) {
	
	.main{
		padding: 160px 0 100px 0;
	}

	.main .container{
		width: 85%;
	}
}

@media (max-width: 768px) {
	
	.main{
		padding: 120px 0 70px 0;
	}
	
	.main .container{
		width: 90%;
	}
	
	
	
}



/********************* Artikel  *********************/


article{
	width: 100%;
}

article .container {
	width: 100%;
	margin: 0 auto 0 auto;
	background: #002147;
	text-align:left;
}

article .container .text {
	width: 65%;
	margin: 0 auto 0 auto;
	padding: 140px 0;
}

article .container .text p{
	color:#FFF;
}


article .container-right,
article .container-left {
	width: 100%;
	margin: 0 auto -3px auto;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;
	
	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;
}

article .container-left {
	-webkit-flex-direction: row;
	-moz-flex-direction: row;
	-ms-flex-direction: row;
	flex-direction: row;
}

article .container-right .img,
article .container-left .img{
	width: 50%;
}

article .container-right .img img,
article .container-left .img img{
	width: 100%;
}

article .container-right .text,
article .container-left .text{
	width: 50%;
	
	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;
	
	-webkit-align-items: center;
	-moz-align-items: center;
	-ms-align-items: center;
	align-items: center;
}

article .container-right .text .middle,
article .container-left .text .middle{
	padding: 0 100px;
}


article .container-right .text .middle ul,
article .container-left .text .middle ul{
	margin: 30px 0 45px 0;
}
  
article .container-right .text .middle li,
article .container-left .text .middle li{
	list-style-type: none;
	margin-bottom: 6px;
}

article .container-right .text .middle li img,
article .container-left .text .middle li img{
	margin-right: 10px;
	margin-bottom: -5px;
}



@media only screen and (max-width: 1400px) {
	
	article .container-right .text .middle,
	article .container-left .text .middle{
		padding: 0 50px;
	}
	
}
	


@media only screen and (max-width: 1200px) {
	

	article .container .text {
		width: 85%;
		margin: 0 auto 0 auto;
		padding: 100px 0;
	}
	

	article .container-right,
	article .container-left {
		width: 100%;
		margin: 0 auto 100px auto;
	}
	
	article .container-right,
	article .container-left {
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
	}

	article .container-right .img,
	article .container-left .img{
		width: 100%;
	}


	article .container-right .text,
	article .container-left .text{
		width: 100%;
		margin-top: 80px;
		
		-webkit-align-items: flex-start;
		-moz-align-items: flex-start;
		-ms-align-items: flex-start;
		align-items: flex-start;
	}

	article .container-left {
		-webkit-flex-direction: column-reverse;
		-moz-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}
	
	article .container-right .text .middle,
	article .container-left .text .middle{
		margin-left: 7%;
		margin-right: 7%;
		padding: 0 0px;
	}


	
}

@media (max-width: 768px) {
	
	article .container .text {
		width: 90%;
		margin: 0 auto 0 auto;
		padding: 70px 0;
	}
	
	article .container-right,
	article .container-left {
		margin: 0 auto 70px auto;
	}
	
	article .container-right .text,
	article .container-left .text{
		margin-top: 40px;
	}
	
	article .container-right .text .middle,
	article .container-left .text .middle{
		margin-left: 5%;
		margin-right: 5%;
		padding: 0 0px;
	}
	
	article .container li,
	article .container-right .text .middle li,
	article .container-left .text .middle li{
		list-style-type: none;
		margin-bottom: 4px;
	}
	
	article .container-right .text .middle li img,
	article .container-left .text .middle li img{
		width: 25px;
		margin-right: 10px;
		margin-bottom: -5px;
	}
	
	
}





/********************* button  *********************/


.button {
	visibility:visible;
	margin-right: 10px;
	margin-bottom:10px;
  	background-color: #947b59;
  	border: none;
  	padding: 8px 20px 5px 20px;
  	text-align: center;
  	text-decoration: none;
  	display: inline-block;
}

.button:hover {
  	background-color: #002147;
}

.button a {
  	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 20px;
  	line-height: 30px;
	color:#fff;
}

.button a:hover {
	text-decoration:none;
}


@media (max-width: 768px) {
	
	.button a {
		font-size: 16px;
  		line-height: 26px;
	}

	
}





/********************* Bewertungen  *********************/

.rating {
	width: 100%;
	padding: 140px 0 90px 0;
	background-color: #002147;
}

.rating .headline{
	width: 100%;
	margin: 0 auto 0 auto;
	text-align:center;
}

.rating .headline .background{
	width: 450px;
	padding: 25px 0;
	margin: 0 auto 0 auto;
	background-color:#FFF;
	border: 3px solid;
	border-color: #947b59;
}

.rating .headline .background h3{
	margin-bottom: 0px;
}

.rating .container {
	width: 65%;
	margin: 60px auto 0 auto;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
}

.rating .container .article{
  	width: 45%;
}

.rating .container .article p,
.rating .container .article b{
	color:#FFF;
}
.rating .container .article hr{
	border:solid;
	color:#44586f;
	border-width: 1px;
	margin: 50px 0;
}



.rating .container .article2{
  	width: 100%;
}

.rating .container .article2 p,
.rating .container .article2 b{
	color:#FFF;
}
.rating .container .article2 hr{
	border:solid;
	color:#44586f;
	border-width: 1px;
	margin: 50px 0;
}




.rating .container .article2 .accordion {
  	visibility:visible;
	margin-right: 10px;
	margin-bottom:10px;
  	background-color: #947b59;
  	border: none;
  	padding: 8px 20px 5px 20px;
  	text-align: center;
  	text-decoration: none;
  	display: inline-block;
}

.rating .container .article2 .accordion:hover {
  	background-color: #fff;
}

.rating .container .article2 .accordion a{
	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 20px;
  	line-height: 30px;
	color:#fff;
}

.rating .container .article2 .accordion a:hover {
	text-decoration:none;
	color:#947b59;
}

.rating .container .article2 .active .accordion:hover {
 	background-color: #002147;
}

.rating .container .article2 .panel {
  padding: 20px 0 0 0;
  display: none;
  overflow: hidden;
}





@media only screen and (max-width: 1200px) {
	
	.rating {
		padding: 100px 0 50px 0;
	}
	
	.rating .container{
		width: 85%;
		margin: 50px auto 0 auto;
	}
	
	.rating .container{
		margin: 40px auto 0 auto;
	}
	
}

@media (max-width: 768px) {
	
	.rating{
		padding: 80px 0 70px 0;
	}
	
	.rating .headline .background{
		width: 90%;
		padding: 25px 0;
	}
	
	.rating .container{
		width: 90%;
		margin: 40px auto 0 auto;
	}

	.rating .container .article{
		margin-top: 20px;
  		width: 100%;
	}
	
	.rating .container .article hr {
		visibility:hidden;
		margin: 10px 0;
	}
	
}




/********************* Über  *********************/

.about {
	width: 100%;
	margin: 140px 0 140px 0;
	background-color: #fff;
}


.about .container {
	width: 65%;
	margin: 0 auto 0 auto;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
}

.about .container .article{
  	width: 45%;
}

.about .container .article  img{
  	width: 100%;
}


@media only screen and (max-width: 1200px) {
	
	.about {
		margin: 100px 0 100px 0;
	}
	
	.about .container{
		width: 85%;
		margin: 50px auto 0 auto;
	}
	
}

@media (max-width: 768px) {
	
	.about{
		margin: 80px 0 50px 0;
	}
	
	.about .container{
		width: 90%;
	}

	.about .container .article{
		margin-top: 20px;
  		width: 100%;
		margin-bottom: 30px;
	}
	
}





/********************* Über Lanzarote  *********************/

.more {
	width: 100%;
	padding: 140px 0;
	background: url('../img/insel-lanzarote-spanien.jpg') no-repeat center center;
  	background-size: cover;
  	background-position: center;
}

.more .container {
	width: 65%;
	margin: 0 auto 0 auto;
	text-align:center;
}

.more .container h2,
.more .container p{
	color:#FFF;
}

.more .container h2,
.more .container p{
	color:#FFF;
}


.more .container p {
  	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 20px;
  	line-height: 30px;
}

@media only screen and (max-width: 1200px) {
	
	.more {
		padding: 100px 0;
	}
	
	.more .container{
		width: 85%;
	}
	
}

@media (max-width: 768px) {
	
	.more{
		padding: 70px 0;
		background: url('../img/insel-lanzarote-spanien-mobil.jpg') no-repeat center center;
	}
	
	.more .container{
		width: 90%;
	}
	
	.more .container p{
		font-size: 16px;
  		line-height: 26px;
	}
	
}



/********************* Über  *********************/

.info {
	width: 100%;
	margin: 140px 0 140px 0;
	background-color: #fff;
}

.info .headline{
	width: 90%;
	margin: 0 auto 0 auto;
	text-align:center;
}

.info .container {
	width: 65%;
	margin: 0 auto 0 auto;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
}

.info .container .article{
  	width: 20%;
	margin-top: 20px;
}

.info .container .article  img{
  	width: 100%;
}


@media only screen and (max-width: 1200px) {
	
	.info {
		margin: 100px 0 100px 0;
	}
	
	.info .container{
		width: 85%;
	}
	
}

@media (max-width: 768px) {
	
	.info{
		margin: 80px 0 80px 0;
	}
	
	.info .container{
		width: 90%;
	}

	.info .container .article{
  		width: 40%;
	}
	
}





/********************* Bewertungen  *********************/

.gallery {
	width: 100%;
	padding: 140px 0 140px 0;
	background-color: #f2f3f5;
}

.gallery .headline{
	width: 100%;
	margin: 0 auto 0 auto;
	text-align:center;
}

.gallery .container {
	width: 65%;
	margin: 0 auto 0 auto;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
	
	position: relative;
}




.gallery .container .mySlides {
  display: none;
  width: 100%;
  margin-bottom: 20px;
}

.gallery .container .cursor {
  cursor: pointer;
}

.gallery .container .prev,
.gallery .container .next {
  cursor: pointer;
  position: absolute;
  top: 40%;
  width: auto;
  padding: 16px;
  margin-top: -50px;
  color: white;
  font-weight: bold;
  font-size: 20px;
  border-radius: 0 3px 3px 0;
  user-select: none;
  -webkit-user-select: none;
}

.gallery .container .next {
  right: 0;
  border-radius: 3px 0 0 3px;
}

.gallery .container .prev:hover,
.gallery .container .next:hover {
  background-color: rgba(0, 33, 71, 0.8);
}

.gallery .container .numbertext {
  color: #f2f2f2;
  font-size: 15px;
  padding: 8px 12px;
  position: absolute;
  top: 0;
}

.gallery .container .row:after {
  content: "";
  display: table;
  clear: both;
}

.gallery .container .column {
  float: left;
  width: 10%;
  padding: 1px 2px;
}

.gallery .container .demo {
  opacity: 0.6;
}

.gallery .container .active,
.gallery .container .demo:hover {
  opacity: 1;
}









@media only screen and (max-width: 1200px) {
	
	.gallery {
		padding: 100px 0 100px 0;
	}
	
	.gallery .container{
		width: 85%;
	}
	
	.gallery .container .column {
  		width: 12.5%;
	}
	
}

@media (max-width: 768px) {
	
	.gallery{
		padding: 80px 0 80px 0;
	}

	.gallery .container{
		width: 90%;
	}
	
	.gallery .container .column {
  		width: 20%;
	}

	
}






/********************* Details  *********************/

.details {
	width: 100%;
	margin: 140px 0 140px 0;
	background-color: #fff;
}

.details .headline{
	width: 65%;
	margin: 0 auto 100px auto;
	text-align:left;
}

.details .map{
	width: 65%;
	margin: 0 auto 100px auto;
	text-align:left;
}

.details .container {
	width: 65%;
	margin: 0 auto 0 auto;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
}

.details .container hr{
	width: 100%;
	border: 1px solid #828e94;
	margin: 50px 0 70px 0;
}

.details .container .article{
  	width: 28%;
}

.details .container p{
	margin-bottom: 20px;
}
  
.details .container .article li{
	list-style-type: none;
	margin-bottom: 10px;
}

.details .container .article li img{
	margin-right: 10px;
}

.details .container .article2{
  	width: 100%;
	margin-top: 40px;
}



@media only screen and (max-width: 1200px) {
	
	.details {
		margin: 100px 0 100px 0;
	}
	
	.details .map,
	.details .headline{
		margin: 0 auto 80px auto;
	}
	
	.details .map,
	.details .headline,
	.details .container{
		width: 85%;
	}
	
}

@media (max-width: 768px) {
	
	.details{
		margin: 80px 0 80px 0;
	}
	
	.details .map,
	.details .headline{
		margin: 0 auto 60px auto;
	}

	.details .map,
	.details .headline,
	.details .container{
		width: 90%;
	}

	.details .container hr{
		margin: 30px 0 40px 0;
	}

	.details .container .article{
  		width: 100%;
	}
	
	.details .container p{
		margin-bottom: 10px;
	}

}





/********************* kontaktformular *********************/

.form1 {
	width: 100%;
	margin: 0 0 140px 0;
  	}

.form1 .container {
	width: 65%;
	margin: 0 auto 0 auto;
	text-align:left;
}

.form1 .container p{
	font-family: 'Heebo', sans-serif;
	font-weight:400;
	font-size: 17px;
  	line-height: 28px;
	color:#3e4f58;
	margin-top: 40px;
	margin-bottom: 10px;
}

.form1 .container .btn {
	font-family: 'Vollkorn', sans-serif;
	font-weight:600;
	font-size: 20px;
  	line-height: 30px;
	color:#fff;
	
  	background-color: #947b59;
  	border: none;
	text-align: center;

  	padding: 8px 20px 5px 20px;
	margin-top: 30px;
  	text-decoration: none;
}

.form1 .container li {
	color: #c00d0d;
	margin-left: 17px;
}

.form1 .container .btn:hover {
  	color:#fff;
  	background-color: #002147;
}



@media only screen and (max-width: 1100px) {
	
	.form1{
		margin: 0 0 80px 0;
	}
	
	.form1 .container{
		width: 85%;
		
		-webkit-flex-direction: column-reverse;
		-moz-flex-direction: column-reverse;
		-ms-flex-direction: column-reverse;
		flex-direction: column-reverse;
	}

	.form1 .container  hr{
		width: 30%;
	}

}

@media (max-width: 768px) {
	
	.form1{
		margin: 0 0 60px 0;
	}
	
	.form1 .container{
		width: 90%;
	}
	
	.form1 .container p,
	.form1 .container .btn{
		font-size: 16px;
  		line-height: 26px;
  	}

}



/* ================  	Kontaktformular  ===================== */


.form{
	min-height:20px;
	margin-bottom:30px;
	margin-top: 30px;
	}
	
		
.form label {
	font-family: 'Heebo', sans-serif;
	font-weight:400;
	font-size: 17px;
  	line-height: 28px;
	color:#3e4f58;
	margin-top: 40px;
	margin-bottom: 10px;
	
  	display: inline-block;
  	margin: 0 0;
  	padding: 25px 0 0 0;
  	border: 1px solid transparent;
}

textarea.form-control {
    height: auto;
}

.form label a {
	font-family: 'Heebo', sans-serif;
	font-weight:400;
	font-size: 17px;
  	line-height: 28px;
	color:#947b59;
	text-decoration:none;
 }
  
.form label a:hover {
	color:#002147;
	text-decoration:none;
}

.form-control {
    display: block;
    width: 100%;
    height: 35px;
    padding: 10px;
	
	font-family: 'Heebo', sans-serif;
	font-weight:400;
	font-size: 14px;
  	line-height: 30px;
	color: #87979f;
	
    background-color: #fff;
    background-image: none;
    border: 1px solid #ccc;
    border-radius: 4px;
    -webkit-box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    box-shadow: inset 0 1px 1px rgba(0,0,0,.075);
    -webkit-transition: border-color ease-in-out .15s,-webkit-box-shadow ease-in-out .15s;
    -o-transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
    transition: border-color ease-in-out .15s,box-shadow ease-in-out .15s;
}

.form-radio {
	font-family: 'Heebo', sans-serif;
	font-weight:400;
	font-size: 17px;
  	line-height: 28px;
	color:#3e4f58;
}

textarea {
    font-family: inherit;
	overflow: auto;
	margin: 0;
	font: inherit;
}



@media (max-width: 768px) {
	

	.form label,
	.form label a{
		font-size: 17px;
  		line-height: 26px;
		letter-spacing: 0.2px;
  	}

}





/********************* Kalender  *********************/

.calendar {
	width: 100%;
	padding: 140px 0 140px 0;
	background-color: #f2f3f5;
}

.calendar .headline{
	width: 65%;
	margin: 0 auto 40px auto;
	text-align:center;
}

.calendar .container {
	width: 65%;
	height: auto;
	margin: 0 auto 0 auto;
	background-color: #fff;
	padding: 40px;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	display: -webkit-flex;
    -webkit-flex-wrap: wrap;
    display: flex;  
    flex-wrap: wrap;
}


@media only screen and (max-width: 1200px) {
	
	.calendar {
		padding: 100px 0 100px 0;
	}
	
	.calendar .container{
		width: 85%;
	}
	
}

@media (max-width: 768px) {
	
	.calendar{
		padding: 80px 0 80px 0;
	}

	.calendar .container{
		width: 90%;
		padding: 20px;
	}

	
}


/********************* Footer  *********************/

.footer {
	width: 100%;
	padding: 80px 0 80px 0;
	background-color: #002147;

  	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: center;
	-moz-justify-content: center;
	-ms-justify-content: center;
	justify-content: center;
}

.footer .container{
	width: 80%;

	-webkit-display: flex;
	-moz-display: flex;
	-ms-display: flex;
	display: flex;

	-webkit-justify-content: space-between;
	-moz-justify-content: space-between;
	-ms-justify-content: space-between;
	justify-content: space-between;

	-webkit-align-items: flex-start;
	-moz-align-items: flex-start;
	-ms-align-items: flex-start;
	align-items: flex-start;
}

.footer .container .footer-item-1{
	width: 30%;
}

.footer .container .footer-item-1 .image img{
	width: auto;
}

.footer .container .footer-item-2 {
	width: 70%;
	text-align:right;
}

.footer .container .footer-item-2 a{
	margin-left: 20px;
	color:#FFF;
}

.footer .container .footer-item-2 a:hover{
	color:#947b59;
	text-decoration:none;
}


@media only screen and (max-width: 1200px) {
	.footer {
		padding: 60px 0 60px 0;
	}

	.footer .container {
		width: 85%;
	}
	
}

@media (max-width: 768px) {
	
	.footer{
		padding: 40px 0 40px 0;
	}
	
	.footer .container {
		width: 90%;
		
		display: -webkit-flex;
    	-webkit-flex-wrap: wrap;
    	display: flex;  
    	flex-wrap: wrap;
		
		-webkit-flex-direction: column;
		-moz-flex-direction: column;
		-ms-flex-direction: column;
		flex-direction: column;
	}
	
	.footer .container .footer-item-1,
	.footer .container .footer-item-2{
		width: 100%;
	}
	
	.footer .container .footer-item-1{
		margin-bottom: 20px;
	}
	
	.footer .container .footer-item-1 .image img{
		width: 160px;
	}
	
	.footer .container .footer-item-2 {
		text-align:left;
	}
	
	.footer .container .footer-item-2 a{
		margin-left: 0px;
		margin-right: 20px;
	}

}
