* {
	box-sizing: border-box;
}

a {
	color: rgb(0,0,108);
	text-decoration: underline;
	transition: background 0.5s ease;
}

a:hover {
	background-color: skyblue;
	color: white;
}



header {
	background: url(../bilder/dunesheader.jpg) no-repeat center;
	background-size: cover;
}

.headertitle{
	width:600px;
	height:150px;
	margin-top:10px;
	margin-left:200px;
	margin-bottom: 5px;
	padding-top: 5px;
	background-color: white;
	border-radius: 15px;
	opacity: 0.8;
}

.headertitle h1{
	margin-top: 5px;
	margin-bottom:5px;
}


.navi {
	background-color: rgb(0, 0, 108);
	border: 1px solid rgb(0, 0, 108);
}


.navi li a {
	color: white;
}

.navi li a:hover {
	background-color: skyblue;
}

li a:hover:not(.active .inaktiv) {
	background-color: skyblue;
}

.active {
	background-color: skyblue;
}

footer {
	border-top: 1px solid black;
	background-color: rgb(0, 0, 108);

}

.dot {
	background-color: skyblue;
}

.dot:hover{
	background-color: rgb(0, 0, 108);
}

.dot.active {
	background-color: rgb(0, 0, 108);
}

.buchungslink {
	background-color: rgb(0, 0, 108);
	color: white;
}

.buchungslink:hover {
	background-color: rgb(0, 0, 108);
}

th{
	background-color: mediumblue;
	color:white;
}

tr:nth-child(8){
	background-color: skyblue;
}



/* Small devices (portrait tablets and large phones) */
@media only screen and (min-width: 0px) {
	header{
		height: 270px;
		border-bottom: 1px solid black;
		margin: 0px;
	}
	
	.headertitle{
		width:auto;
		margin:25px;
		height:auto;
		padding: 25px;
	}

	.headertitle h1{
		font-size:32px;
		margin-top: 5px;
		margin-bottom:5px;
	}
	
	.headertitle h2{
		font-size: 24px;
	}
} 

/* Medium devices (landscape tablets, 768px and up) */
@media only screen and (min-width: 768px) {
		header{
		height: 400px;
	}	
	
	.headertitle {
		margin-left:12%;
		margin-top:70px;
		padding-top: 20px;
		height: auto;
	}
	
	.headertitle h1{
		font-size:52px;
	}
	
	.headertitle h2{
		font-size: 42px;
	}
	
} 

/* Large devices (laptops/desktops, 992px and up) */
@media only screen and (min-width: 992px) {

} 

/* Extra large devices (large laptops and desktops, 1200px and up) */
@media only screen and (min-width: 1200px) {...}