@font-face{
	font-family: 'OpenSans';
	src: url('fonts/OpenSans/OpenSans-Light.ttf');
}


.slides {
   display: none;
   width: 95%;   
}
.animate{
   opacity: 1;
   animation: fadein 12s ease 0s 1 normal forwards;
}
@keyframes fadein{
  0%{ opacity: 0;}
  50% { opacity: 1;} 
  100%{ opacity: 0;}
}

.slideTextContainer{
   position:absolute;
   top:100px;
   left:100px;   
}
.slidesText{
   font-size:40px;
   padding:20px;
   background-image:url("images/white.png");
   max-width:800px;
}
.text{
   opacity:1.0;
}



body{
	font-family:Times New Roman, Serif;
	font-size:22px;
	color: #495b71;
	background-color:white;
	margin:0px;
	background: url(images/bg.jpg) no-repeat center center fixed;
	
}

a{
	color: #495b71;
	text-decoration:underline;
}


img#nixe{
	position:absolute; 
	left:5px; 
	top:0px; 
	box-shadow:none !important; 
	height:700px;
}


div#frame{
	width:1100px;
  	margin:0 auto;
}

div#topper{
	color: black;
	height:30px;
	width:99%;
	text-align:right;
	font-size:smaller;
	padding:5px;
	text-align:left;
	background-color:lime;
}
div#topper a{

}
div#topper a:hover{

}
div#topper img{

}

div#head{
	width:100%;
	height:100px;
	background-color:white;
}
div#head img{
	float:left; 
	position:absolute; 
	margin-top:-30px; 
	height:35px;
}

div#mainmenu{
	width:100%;
	z-index:100;
	position:relative;
	margin-left:0px;	
}
ul.mainmenu{
	width:100%;
}
ul.mainmenu li:hover > ul{
	display:block;
}
ul.mainmenu li{
	list-style:none;	
}
ul.mainmenu li a{
	text-decoration: none;
	color:#495b71;	
	font-weight:bold;
}
ul.mainmenu.level1{
	
}
ul.mainmenu.level1 li{
	text-align:center;
	width:145px;
	height:40px;
	float:left;
	margin-top:40px;
}

ul.mainmenu.level1 li:nth-child(1){
	width:80px;
}

ul.mainmenu.level1 li:nth-child(2){
	width:200px;
}

ul.mainmenu.level1 li:nth-child(3){
	width:70px;
}

ul.mainmenu.level1 li:nth-child(4){
	width:170px;
}

ul.mainmenu.level1 li:nth-child(5){
	width:200px;
}

ul.mainmenu.level1 li:nth-child(6){
	width:120px;
}

ul.mainmenu.level1 li:nth-child(7){
	width:120px;
}

ul.mainmenu.level1 li a{
	font-size:22px;
}
ul.mainmenu.level1 li a:hover{
	color: #495b71;
	box-shadow:0px 0px 5px silver;
	padding:5px;	
}
ul.mainmenu.level2{
	margin-left:0px;
	margin-top:10px;
	display:none;
	position:absolute;
	width:200px;
	box-shadow:0px 0px 4px 1px silver;
	background-color:white;
}
ul.mainmenu.level2 li{
	float:none;
	padding:5px;
	padding-top:11px;
	margin:10px;
	width:200px;
	height:25px;
	margin-left:-20px;
	border:none;
}
ul.mainmenu.level2 li a{
	font-size:20px;
}
ul.mainmenu.level2 li:hover{
	background-color: #4c6e87;
	color:white;
}
ul.mainmenu.level2 li:hover a{
	color:white;
	box-shadow: none;
}
ul.mainmenu.level2 li:nth-child(1){
	width:200px;
}

ul.mainmenu.level2 li:nth-child(2){
	width:200px;
}

ul.mainmenu.level2 li:nth-child(3){
	width:200px;
}

ul.mainmenu.level2 li:nth-child(4){
	width:200px;
}
ul.mainmenu.level2 li:nth-child(5){
	width:200px;
}
ul.mainmenu.level3{
	margin-left:165px;
	margin-top:-32px;
	width:170px;	
	display:none;
	position:absolute;
	box-shadow:0px 0px 4px 1px silver;
	background-color:white;	
}

ul.mainmenu.level3 li{
	padding:5px;
	padding-top:11px;
	margin:10px;
	width:160px;
	height:25px;
	margin-left:-20px;	
	border:none;
}
ul.mainmenu.level3 li a{
	color:black !important;
}
ul.mainmenu.level3 li:hover{
	background-color: #d61111;
	color:white;
}
ul.mainmenu.level3 li:hover a{
	color:white !important;
}

div#content{
	position:relative;
	width:100%;
	min-height:530px;
	position:relative;
	margin-left:0px;
	z-index:0;	
	background: rgba(255, 255, 255, 0.8);
}
div#innercontentleft{
	width:100px;
	height:100%;
	float:left;
}
div#innercontentright{
	padding-left:50px;
	padding-right:50px;
	padding-top:1px;
	padding-bottom:30px;
	height:100%;
}

a.bookingbutton{
	width:400px;
	height:20px;
	background-color: #495b71;
	color:white;
	padding:10px;
	box-shadow: 0px 0px 5px black;
	font-size:26px;
	cursor:pointer;
	text-decoration: none;
}

div#content img{
	box-shadow:0px 0px 5px black;
	margin: auto auto;
}
img.detailbild{
	height:300px;
	margin-right:40px;
}

div#content h1{
	font-size:28px;
	font-style:italic;
	font-weight:bold;
}

div#content h2{
	font-size:24px;
	font-weight:bold;
}

div.content_short{
	width:420px;
	height:510px;
	border-radius:0px;
	box-shadow:0px 0px 5px silver;
	padding:30px;
	margin:10px;
	float:left;
	overflow: auto;
	float:left;
	background-color:white;
	color: #495b71;	
	font-size:18px;
}


div#footer{
	clear:left;
	color: #495b71;	
	height:100px;
	width:100%;
	position:relative;
	top:90%;
	background-color: white;

}	

ul.footmenu{
	margin:0 auto;
	width:1100px;
	padding-top:30px;
	
}
ul.footmenu li{
	width:100px;
	float:left;
	list-style:none;
}

ul.footmenu li:nth-child(1){
	width:130px;
}

ul.footmenu li:nth-child(2){
	width:150px;
}

ul.footmenu li:nth-child(3){
	width:180px;
}

ul.footmenu li a{
	text-decoration:none;
	color:#495b71;
}

ul.footmenu li a:hover{
	text-decoration:none;
	color:#495b71;
	box-shadow:0px 0px 5px silver;
	padding:8px;
}


table#preise{
	clear:both;
	margin-top:20px;
}

table#preise th{
	text-align: left;
	vertical-align: top;
	padding:10px;
	background-color:#495b71;
	color:white;
}

table#preise td{
	text-align: left;
	vertical-align: top;
	padding: 10px;
}

table.calendar{
	border-collapse: collapse;
	border:1px solid silver;
	margin-bottom:30px;
}
table.calendar th{
	border:1px solid silver;
	background-color: #495b71;
	color:white;
	padding:5px;
}

table.calendar td{
	border: 1px solid silver;
	background-color: white;
	padding:5px;
}

table#vergleich{
	border-collapse: collapse;
	border:1px solid #495b71;
}
table#vergleich th{
	background-color: #495b71;
	border:1px solid white;
	color:white;
	padding:5px;
	text-align:left;
}
table#vergleich td{
	border:1px solid #495b71;
	text-align: right;
}
table#vergleich th img{
	height:30px;
	box-shadow:none;
}

fieldset{
	margin-bottom:10px;
	border:none;
	box-shadow:0px 0px 5px grey;
}
legend{
	background: rgba(76, 110, 135, 0.8);
	color:white;
	padding:3px;
	border-radius: 5px;
}

label{
	display:block;
	width:250px;
	float:left;
	padding: 5px;
}
select, input, textarea, input[type=date]{
	font-family:Times New Roman, Serif;
	font-size:22px;
	color: #495b71;
	border:1px solid lightgrey;
	padding:5px;
	background: rgba(255, 255, 255, 0.5);
}
input[type=submit]{
	font-family:Times New Roman, Serif;
	background-color:#495b71; 
	color:white; 
	width:300px; 
	text-align:center; 
	padding:3px; 
	box-shadow:0px 0px 5px grey; 
	cursor:pointer;
	font-size:24px;
}
input[type=text], input[type=tel], input[type=email]{
	width:400px;
}
input[type="date"]{
	width:150px;
}
input[type=checkbox]{
	width:20px;
	height:20px;
}
textarea{
	width:80%;
	height:200px;
}


p#home_image_2{
    width:55%; 
    float:left; 
    margin-top:50px;
}


img#ferienwohnungen_img_1{
    width:400px; 
    margin-right:30px !important;
    float:left;
}

div#Ferienwohnungen ul{
    list-style-position: inside;
}

div#Preise img{
    width:450px; 
    float:left; 
    margin-right:20px;
}
div.bookingCalendar{
	padding:5px;
	margin:5px;
	box-shadow: 0px 0px 5px silver;
	background-color: white;
	float:left;
	text-align: center;
	width: 470px;
	height: 320px;
}
div.bookingCalendar table{
	border-collapse: collapse;
	margin:auto;

}
div.bookingCalendar table th{
	border:1px solid #495b71;
	background-color:  #495b71;
	color:white;
	font-size:17px;
	padding:3px;
	
}
div.bookingCalendar table td{
	border:1px solid #495b71;
	padding:3px;
	font-size:17px;
}
div.bookingCalendar table td a{ 
	text-decoration: none;
}


/* Admin */




body#admin{
	font-size:16px;
}


body#admin div#head{
	height:50px;
	background-color:silver;
	padding:10px;
	font-family:Arial, Sans-serif;
}
body#admin a{
	text-decoration:underline;
	color:black;
}

body#admin div#mainmenu{
	padding-top:20px;
}

body#admin div#mainmenu a{
	margin:10px;
	color:white;
}

body#admin div#content{
	border-bottom:1px solid silver;
	font-family:Arial, Sans-serif;
	padding:10px;
}

body#admin div#footer{
	position:relative;
	padding:10px;
	font-family:Arial, Sans-serif;
}


body#admin table{
	
	border-collapse: collapse;
}
body#admin table th{
	background-color: rgba(76, 110, 135, 0.8);
	color:white;
	border:1px solid silver;
	padding:5px;
}
body#admin table td{
	border:1px solid silver;
	padding:5px;
}

body#admin select, body#admin textarea, body#admin input{
	font-family: Arial, Helvetica, sans-serif;
	font-size: 16px;
	margin-top:-4px;
}
body#admin textarea{
	height:100px;
}

body#admin input[type=submit]{
	background-color:#495b71; 
	color:white; 
	width:300px; 
	text-align:center; 
	padding:3px; 
	box-shadow:0px 0px 5px grey; 
	cursor:pointer;
	font-size:18px;
}

body#admin label{
	display:block;
	width:150px;
	float:left;
	background-color: rgba(76, 110, 135, 0.8);
	color:white;
	padding-right: 5px;
}

body#admin div.value{
	margin-left:160px;
	padding:5px;
}



/* Mobile */


@media only screen and (max-width: 600px){
    
    body#admin div#head{
        height:110px;
        background-color:silver;
        padding:10px;
        font-family:Arial, Sans-serif;
    }    
    body#admin div#head a{
        font-size:20px;
    }
    body#admin select{
        width:140px;
    }	
    
	.slideTextContainer{
	   position:absolute;
	   top:20px  !important;
	   left:0px !important;  
	}	
	
	.slidesText{
	   font-size:20px !important;
	   padding:20px;
	   background-image:url("images/white.png");
	}
	
	img#nixe{
		display:none;
	}

    div#frame{
        width:90%;
    }    	
	div#topper{
		height:80px;
	}

	div#topper a{
		font-size:18px;
	}	
	div#head{
		height:230px;
		text-align:justify;		
		background-color: white;
		height:380px;
	}
	div#topper img{
		float:none; 
		width:95%;
		margin-top:40px;		
	}
	
	ul.mainmenu li:hover > ul{
		display:none;
	}

	div#mainmenu{
		width:100%;
		z-index:100;
		position:relative;
		margin-left:0px;	
		margin-top:20px;
	}
	ul.mainmenu.level1{
		margin-left:-20px;
	}
	ul.mainmenu.level1 li{
		font-weight:bold;
		font-size:30px;
		float:none;
		margin-top:10px;
		width:100% !important;
	}
	ul.mainmenu.level1 li a{
		font-size:30px;
	}
	ul.mainmenu.level1 li:nth-child(1){
		padding-top:20px;
	}

	ul.mainmenu.level2{
		display:none;
	}
	ul.mainmenu.level3{
		margin-left:0px;
		margin-top:30px;		
	}	
	
	div#content{
		margin-top:0px;
		margin-left:0px;
	}
	div#content img{
		width:100%;
	}	
	div#content h1{
		width:100%;
		text-align:center;
		font-size:30px;
	}
	div.content_short{
        margin-left:-10%;
		width:100%;
		height:350px;
	}	
    div.content_short p{
        font-size:17px !important;
    }

	div.content_short img:nth-child(1){
        width:30px !important;
        height:30px !important;
	}
    
    div.content_short table img:nth-child(1){
        width:20px !important;
        height:20px !important;
	}

	div.content_short img.background{
		display: inline;
		box-shadow:none !important; 
		width:300px !important;
		height:300px !important;
		position:absolute; 
		margin-top:30px; 
		opacity:0.2;
	}
    
    
    table#vergleich{
        font-size:13px;
    }
    
    table#preise{
        margin-left:-15%;
        font-size:13px;
    }    


	ul.footmenu{
		width:100%;
	}
	


	select, input, textarea{
		font-family:Times New Roman, Serif;
		font-size:22px;
		color: #495b71;
		border:1px solid #495b71;
		border:none;
		padding:5px;
		background: rgba(255, 255, 255, 0.5);
		width:95%;
	}
	input[type=text], input[type=tel], input[type=email]{
		width:95%;
	}
	input[type="date"]{
		width:95%;
	}
	input[type=checkbox]{
		width:20px;
		height:20px;
	}
	textarea{
		width:95%;
		height:200px;
	}	
    
    img#home_image_1{
        width:100%;
    }

    p#home_image_2{
        width:100%;
        margin-top:50px;
    }
    
    div#Ferienwohnungen ul{
        list-style-position: outside;
    }
    
    div#Preise img{
        width:100%;
        margin-bottom:20px;
    }

	div.bookingCalendar{
		padding:5px;
		margin:10px;
		margin-left:-10px;
		box-shadow: 0px 0px 5px silver;
		background-color: white;
		float:left;
		text-align: center;
		width: 110%;
		height: 350px;
	}
	div.bookingCalendar table{
		border-collapse: collapse;
		margin:auto;
	
	}
	div.bookingCalendar table th{
		border:1px solid #495b71;
		background-color:  #495b71;
		color:white;
		font-size:14px;
		padding:3px;
		
	}
	div.bookingCalendar table td{
		border:1px solid #495b71;
		padding:3px;
		font-size:14px;
	}	
	
	
}