body {
		width:100.0%;
		font-family:"ModernFlat Book",Helvetica,Roboto,Arial,sans-serif;
		font-size:100%;
		min-width:990px;
		min-height:1000px;
		margin-top:0px;
		margin-left:auto;
		margin-right:auto;
	} 

	#alert_box {
	    padding: 20px;
	    opacity: 0;
	    font-weight: 600;
	    transition: opacity 0.8s;
	    margin-bottom: 15px;
	    width: 33%;
	    position: fixed;
	    top: 10%;
	    left: 50%;
	    transform: translateX(-50%);
	    text-align: center;
	    z-index: 999;
	}
	
	div#imprint_linkbox {
	    /*position: absolute;*/
	    right: 0;
	    padding: 5px;
	    left: 0;
	}
	
	a{
		outline-style:none;
	}	
	
	a.normal {
		font-family:"ModernFlat Book",Helvetica,Roboto,Arial,sans-serif;
	    text-decoration: none;
 	}
	
	div.main{
		/*background: white;*/
		/*width: 99%;*/
		padding-left:5px;
		padding-right:5px;
		padding-bottom:10px;
		min-width:990px;
		margin: 0 auto;
		border: 0px;
	}

				
	.navigation {
		background: transparent;
		position: absolute;
		right:1.5%;
		padding-left:10px;
		-webkit-padding-start:10px;
		-moz-padding-start: 10px;
	}


	.navigation:after {
	    clear: both;
	    content: " ";
	    display: block;
	    font-size: 0;
	    height: 0;
	    visibility: hidden;
	}

	.nav_entry {
		display: block;
		padding-top:1.2%;
		padding-left: 12px;
		font-family:"ModernFlat Book",Helvetica,Roboto,Arial,sans-serif;
		float:left;
	}

	.nav_text {
		text-decoration: none;
		font-weight: normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;
		font-size:96%;
		padding-top:1%;
		height: 2.5%;
		padding-bottom: .2%;
	}
	
	.no_click {
		pointer-events: none;
   		cursor: default;
	}
	
	.nav_entry:hover > .submenu {
	    visibility: visible;
	}
	.submenu{
	    visibility: hidden;
	    position: absolute;
	    padding:.5%;
	    z-index:1000;
	    margin-left: -.5%;
	   /* border-bottom: 1px solid rgb(160,160,160);
		border-left: 1px solid rgb(160,160,160);
		border-right: 1px solid rgb(160,160,160);*/
	}
	.sub_nav_entry{
		display:block;
		text-align: left;
		padding-top:.5%;
		float: none;
	}

	.sub_nav_text {
		text-decoration: none;
		font-weight: normal;
		font-family:"ModernFlat Book",Helvetica,Roboto,Arial,sans-serif;
		font-size:90%;
		padding-top:1%;
		height: 2.5%;
		padding-bottom: .2%;
	}
	/*Navigation ende*/
	
	div#title {
		font-family:"ModernFlat Book",Helvetica,Roboto,Arial,sans-serif;
		font-size: 195%;
		float:left;
		vertical-align:middle;
		/*position: absolute;*/
	}

	h1{
		width: auto;
		/*max-height: 150px;*/
		font-size:0.8em;
		font-weight:normal;
		border:0px;
		margin:0px;
		padding:0px;
		height:100%;
	}
	
	h2{
		width: auto;
		font-size:1em;
		font-weight:normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;
		border:0px;
		margin:0px;
		padding:0px;
		height:100%;
	}
	
	h3{
		width: auto;
		font-size:1.3em;
		font-weight:normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;		
		border:0px;
		margin-top:0px;
		height:100%;
	}

	h4{
		width: auto;
		font-size:1.1em;
		font-weight:normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;		
		border:0px;
		margin-top:0px;
		height:100%;
	}
	
	h5{
		width: auto;
		font-size:1.0em;
		font-weight:normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;		
		border:0px;
		margin-top:0px;
		height:100%;
	}

	p.fett {
		font-size:11pt;
		font-weight:normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;
		padding-top:0px;
		padding-bottom:0px; 
		margin-top:0px;
		text-align:left;
	}

	p.pagetitle {
		font-size:16pt;
		font-weight:normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;
		padding-top:0px;
		padding-bottom:0px; 
		margin-top:0px;
		text-align:left;
	}
	
	div.subtitle {
		padding-top:.3%;
		/*font-size: smaller;*/
		padding-left:.5%;
	}

	div.leftTop {
		margin-top: 0px;
		padding: 0px;
		height:19.2%;
		width:23.5%;
		float:left;
		position:relative;
		margin-right:.5%;
	}

	#box{
		position: relative;
		width: 100%;
		margin-top: 0px;		
	}
	#box:before{
		content: "";
		display: block;
		padding-top: 24.964%; 	
	}
	
	.centerimage{
		position:  absolute;
		top: 0;
		left: 0;
		bottom: 0;
		right: 0;
		background-color: rgb(220, 220, 220);
		border: 0;
	}
	
	img.centerimage {
		margin-left: auto;
	  	margin-right: auto;
	  	display: block;
	  	height:100%
	}
	
	.slideImageTextBox {
		width: calc(100% / 3 - 40px);
	    height: calc(100% / 3 - 40px);
		margin: 20px;
		display: flex;
    	position: absolute;
    	z-index: 100;
	}
	
	#slideImageTextBoxTL{
		justify-content: flex-start;
    	align-items: flex-start;
    	text-align:left;
	}
	#slideImageTextBoxTC{
		left: calc(100% / 3);
		justify-content: center;
    	align-items: flex-start;
    	text-align:center;
	}
	#slideImageTextBoxTR{
		right: 0;
		justify-content: flex-end;
    	align-items: flex-start;
    	text-align:right;
	}
	#slideImageTextBoxCL{
		top: calc(100% / 3);
		justify-content: flex-start;
    	align-items: center;
    	text-align:left;
	}
	#slideImageTextBoxCC{
		top: calc(100% / 3);
		left: calc(100% / 3);
		justify-content: center;
    	align-items: center;
    	text-align:center;
	}
	#slideImageTextBoxCR{
		top: calc(100% / 3);
		right: 0;
		justify-content: flex-end;
    	align-items: center;
    	text-align:right;
	}
	#slideImageTextBoxBL{
		bottom: 0;
		justify-content: flex-start;
    	align-items: flex-end;
    	text-align:left;
	}
	#slideImageTextBoxBC{
		bottom: 0;
		left: calc(100% / 3);
		justify-content: center;
    	align-items: flex-end;
    	text-align:center;
	}
	#slideImageTextBoxBR{
		bottom: 0;
		right: 0;
		justify-content: flex-end;
    	align-items: flex-end;
    	text-align:right;
	}
	
	.slideImageText{
		margin:0;
		font-size:2.5em;
	}
		
	div.leftmain {
		float:left;
		width:20%;
	}

	.brochure_img{
		max-width: 80%;
	}

	div.centermain {
		width: 990px;
		display: block;
		margin-left: auto;
		margin-right: auto;
	}

	#start, #contact, #map, #gallery, #imprint {
		margin-left:auto;
		margin-right:auto;
		padding: 2%;
	}
	#booking{
		width:600px;
		margin-left: auto;
		margin-right:auto;
	}
	#messageBoxes{
	   	width: 70%;
	}
	#contact p a{
		word-wrap:break-word;
	}

	div.about{
		float: right;
		padding-left: 3%;
		margin-top: 2%;
		margin-right: 2%;
		max-width: 31%;
		max-height: 21%;
	}
	
	span#serviceFreitext {
		color: #828282;
	}

	input[type="text"],input[type="email"]{
		margin-bottom: 1%;
		width:100%;
	}

	textarea {
		width: 40%;
		width:100%;
	}

	.mailResponse {
		text-decoration: none;
		font-weight: normal;
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;
		padding-top:15px;
		padding-left:20px;	
	}
	
	.ueberschriften {
		font-weight: normal; 
		font-family:"ModernFlat Heavy",Helvetica,Roboto,Arial,sans-serif;
	}
	
	div#map-canvas{ 
		width:100%;
		height: 400px;	
	 }
	
	.openinghours{
		margin-top: 0px;
		margin-bottom: .2%;
 	}
	
	/*anfang Bildergallery*/
	
	.pictures{
		margin-left: 20% !important;
		margin-right:20% !important;
	}
	
	/*
	div#bigImageContainer {
		margin-top: 0px;
		position:relative;
	}
	
	div#inImageBtnLeft {
	    cursor: pointer;
	    position: absolute;
	    left: 0;
	    top: 0;
	    width: 25%;
	    height: 100%;
	    z-index: 2;
	}
	
	#inImageBtnLeft:hover #inImageBtnLeftInner {
	    background-color: rgba(240, 240, 240, 0.6);
	}
		
	div#inImageBtnRight {
	    cursor: pointer;
	    position: absolute;
	    right: 0;
	    top: 0;
	    width: 25%;
	    height: 100%;
	    z-index: 2;
	}
	
	#inImageBtnRight:hover #inImageBtnRightInner {
	    background-color: rgba(240, 240, 240, 0.6);
	}
	
	div#inImageBtnLeftInner {
       	position: absolute;
	    left: 0;
	    top: 50%;
	    margin-top: -48px;
	    height: 96px;
	    width: 45%;
	    opacity: 0.8;
	    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	    filter: alpha(opacity=80);
	    background-size: 70%;
	    background-image: url(/layout/images/icons/circle_back_arrow.png);
	    background-repeat: no-repeat;
	    background-position: center;
	}
	
	div#inImageBtnRightInner {
    	position: absolute;
	    right: 0;
	    top: 50%;
	    margin-top: -48px;
	    height: 96px;
	    width: 45%;
	    opacity: 0.8;
	    -ms-filter: "progid:DXImageTransform.Microsoft.Alpha(Opacity=80)";
	    filter: alpha(opacity=80);
	    background-size: 70%;
	    background-image: url(/layout/images/icons/circle_next_arrow.png);
	    background-repeat: no-repeat;
	    background-position: center;
	}
	
	img.gallery_bilder_gross {
		max-width: 100%;
		background: white;
		border: 1px solid #929292;
		margin: 0 auto;
	}
	
	#picture_preview_overflow{
		margin-top: 1%;
		overflow-x:hidden;
		overflow-y:hidden;
		float:left;
	}

	input#right-button {
	    float: left;
	    margin-top: 1%;
	    width:37px;
	    margin-left:5px;
	}
    input#left-button {
	    float: left;
	    margin-top: 1%;
	    width:37px;
	    margin-right:5px;
    }
	.gallery_bilder_klein {
		width:128px;
		height:96px;
		border: 1px solid #929292;
		padding: 5px;
		background: white;
		cursor: pointer;
		float:left;
		margin-right:5px;	
	}
	
	/*ende Bildergallery*/
	
	.userContentTable {
		margin-top: 2%;
		margin-left: 35%;
		padding: 2%;
	}
	
	div#videoContainer{
		margin-top: 1%;
	}
	
	video{
		width: 100%;
	}
	
	p.description{
		font-size:small; 
		margin-top:.5%; 
		margin-bottom:0;
	}

	 /* Modal Box für Bild Zoom in Custom User Tables */
	 
	 .modalDialog {
		font-family:"ModernFlat Book",Helvetica,Roboto,Arial,sans-serif;
	}
	
	.modalDialog > div {
		/*min-width: 53%;
		min-height: 34%;*/
		max-width: 100%;
		max-height: 80%;
	}
	
	.bigImage{
		max-width:100%;
		max-height: 80%;
	}
	 
	 /* Modal Box ende */

	.placeholder { color: #aaa; }
	
	/*shop*/
	#orderbasket_product_list{
		width: 100%;
	}
	#orderprocess_product_list{
		width: 100%;
	}
	#orderprocess_customerdata_table {
	    width: 100%;
	}
	.orderprocess_order_btn {
		font-family:"ModernFlat Book",Helvetica,Roboto,Arial,sans-serif;
	}
@media screen and (min-width: 1400px) {

	div.leftlogo {
		margin-top: 0px;
		padding-top: 0.8%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:.5%;
		height: 10%;
		width: 160px;
		float:left;
		position: relative;
	}

	.leftlogoimg {
		max-width:150px;
		max-height:100px; 
		padding-right:2px;
	}
		
	div.rightfromlogo {
		float:left; 
		width:87%; 
		min-width:1230px;
	}
		
	div.leftheader {
		margin-top: 0px;
		padding-top: 1%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:.5%;
		height: 10%;
		width: 33%;
		float:left;
		position: relative;
	}

	/* Navigation */
	nav.rightheader {
		margin-top: 0px;
		padding-left: .5%;
		padding-right:.5%;
		width:64%;
		float:left;
		position: relative;
	}
	

	div.leftheaderwithlogo {
		margin-top: 0px;
		padding-top: 1%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:.5%;
		height: 10%;
		width: 35%;
		float:left;
		position: relative;
	}

	/* Navigation */
	nav.rightheaderwithlogo {
		margin-top: 0px;
		padding-left: .5%;
		padding-right:.5%;
		width:50%;
		float:left;
		position: relative;
	}

	.nav_entry {
		padding-left:30px;
	}
}

@media screen and (min-width: 1020px) and (max-width: 1399px) {

	div.leftlogo {
		margin-top: 0px;
		padding-top: 0.8%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:0px;
		height: 10%;
		width: 120px;
		float:left;
		position: relative;
	}

	.leftlogoimg {
		max-width:100px;
		max-height:100px; 
		padding-right:2px;
	}

	div.rightfromlogo {
		float:left; 
		/*width:84%; 
		min-width:840px;*/
	}
		
	div.leftheader {
		margin-top: 0px;
		padding-top: 1%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:.5%;
		height: 10%;
		width: 33%;
		float:left;
		position: relative;
	}

	/* Navigation */
	nav.rightheader {
		margin-top: 0px;
		padding-left: .5%;
		padding-right:.5%;
		width:62%;
		float:left;
		position: relative;
	}
	

	div.leftheaderwithlogo {
		margin-top: 0px;
		padding-top: 1%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:.5%;
		height: 10%;
		width: 33%;
		float:left;
		position: relative;
	}

	/* Navigation */
	nav.rightheaderwithlogo {
		margin-top: 0px;
		padding-left: .5%;
		padding-right:.5%;
		width:52%;
		float:left;
		position: relative;
	}
		
}

@media screen and (max-width: 1019px) {
	div.leftlogo {
		display:none;
	}

	div.leftheader {
		margin-top: 0px;
		padding-top: 1%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:.5%;
		height: 10%;
		width: 33%;
		float:left;
		position: relative;
	}

	/* Navigation */
	nav.rightheader {
		margin-top: 0px;
		padding-left: .5%;
		padding-right:.5%;
		width:64%;
		float:left;
		position: relative;
	}
	

	div.leftheaderwithlogo {
		margin-top: 0px;
		padding-top: 1%; 
		padding-left: .5%;
		padding-bottom: .5%;
		padding-right:.5%;
		height: 10%;
		width: 33%;
		float:left;
		position: relative;
	}

	/* Navigation */
	nav.rightheaderwithlogo {
		margin-top: 0px;
		padding-left: .5%;
		padding-right:.5%;
		width:64%;
		float:left;
		position: relative;
	}
		
}