/*
Grau : #4f4f4e
Lachs: #f6af8c
*/

@import url('https://fonts.googleapis.com/css?family=Ubuntu');
@import url('https://fonts.googleapis.com/css?family=Fira+Sans');

* { font-size: 17px; font-family: 'Fira Sans', sans-serif; box-sizing: border-box; }
body { color: #4f4f4e; background-color: #4f4f4e; margin: 0; font-weight: 300; line-height: 1.5rem; }

@media screen and (max-width: 600px) {
	* { font-size: 16px; }
}

/** NEUES BUCHUNGS WIDGET **/
#booking-tool-iFrame-apartment3333432,
#booking-tool-iFrame-apartment3333437,
#booking-tool-iFrame-apartment3333427,
#booking-tool-iFrame-apartment3333422 {
  left: -10px;
  position: relative;
}
h3.buchen {margin-bottom: 0; margin-top: 1em;}
#check-availability-button {
  background: #f6af8c !important;
  border-color: #f6af8c !important;
}
.section-outer.section-fewo-text.bg-white h2 {
  font-size: 3em;
  font-weight: bold;
	margin-bottom: 10px;
}
.section-outer.section-fewo-text.bg-white h2 + h3 {
  font-size: 2em;
  font-weight: bold;
	color: #f6af8c;
}
/** ENDE NEUES BUCHUNGS WIDET **/

.section-outer { padding: 0 6rem; position: relative; box-sizing: border-box; }
.section-outer.nopadding { padding: 0 0; position: relative; }
.section-inner { position: relative; margin: 0 auto; padding: 4rem 0; max-width: 1200px; box-sizing: border-box;  }
.section-inner.nopadding { padding: 0 0 !important; }

.section-inner.has-top-texture { padding-top: 6.5rem; }
.section-inner.has-bottom-texture { padding-bottom: 6.5rem; }

.section-mood > img { display: block; width: 100%; height: auto;  }

.section-texture { height: 2.5rem; background-repeat: no-repeat; background-size: 100%; box-sizing: border-box; position: absolute; width: 100%; left: 0; z-index: 100; }
.section-texture--top { top: 0; background-position: top; }
.section-texture--bottom { bottom: 0; background-position: bottom; }

.section-texture--theme-top { background-image: url(/assets/images/textures/textur-lachs-oben.png); }
.section-texture--theme-bottom { background-image: url(/assets/images/textures/textur-lachs-unten.png); }
.section-texture--white-top { background-image: url(/assets/images/textures/textur-weiss-oben.png); }
.section-texture--white-bottom { background-image: url(/assets/images/textures/textur-weiss-unten.png); }
.section-texture--grey-top { background-image: url(/assets/images/textures/textur-grau-oben.png);  }
.section-texture--grey-bottom { background-image: url(/assets/images/textures/textur-grau-unten.png); }

@media screen and (max-width: 800px) {
	.section-outer { padding: 0 2rem; }
	.section-inner { padding: 2rem 0; }
	.section-inner.has-top-texture { padding-top: 4rem; }
	.section-inner.has-bottom-texture { padding-bottom: 4rem; }
}

/*Navi Overlay*/
#navi-overlay { position: fixed; top: 0; left: 0; width: 100%; height: 100%; z-index: 1000; box-sizing: border-box; overflow: auto; background-color: #FFF; display: none; }

	.navi-overlay-topbar { box-sizing: border-box; position: fixed; top: 0; left: 0; width: 100%; background-color: #FFF; z-index: 100; border-bottom: 1px solid #E9E9E9; text-align: right; }
	.navi-overlay-topbar-inner { padding: .75rem 2rem; max-width: 1200px; box-sizing: border-box; margin: auto; }
	.navi-overlay-topbar-inner .btn-close-navi { font-size: 1.4rem; cursor: pointer; margin-right: 0; height: 2rem; width: auto; }
	.navi-overlay-topbar-inner .btn-close-navi-small { display: none; } 

	.navi-overlay-inner { padding: 6rem 5%; position: relative; margin: 0 auto; max-width: 1200px; box-sizing: border-box; }
		.navi-overlay-inner .grid { }
		.navi-overlay-inner .grid-cell {  }
		.navi-overlay-inner .grid-cell a { text-align: center; display: block; font-family: 'Ubuntu', sans-serif; font-weight: 700; text-transform: uppercase; width: 100%; text-align: center; padding: 1.5rem 1rem 1em 1rem; text-decoration: none; color: #4f4f4e; }
		.navi-overlay-inner .grid-cell a:hover { background: rgba(233,233,233,0.7); }
		.navi-overlay-inner .grid-cell a .icon-wrapper { display: block; height: 6rem; margin-bottom: 1rem; }
		.navi-overlay-inner .grid-cell a .icon-wrapper img { clear: both; display: inline-block; margin-bottom: 1rem; max-height: 6rem; width: auto; height: auto; }
		.navi-link-label { font-size: 1rem !important; }

	@media screen and (max-width: 500px) {
		.navi-overlay-topbar-inner .btn-close-navi-large { display: none; }
		.navi-overlay-topbar-inner .btn-close-navi-small { display: inline-block; }
		.navi-overlay-inner .grid-cell a .icon-wrapper { height: 4rem; }
		.navi-overlay-inner .grid-cell a .icon-wrapper img { max-width: 70%; max-height: 4rem !important; margin-bottom: 0;}
	}

	@media screen and (max-width: 400px) {
		.navi-overlay-inner .grid-cell--1of4 { -webkit-flex: 0 0 50% !important; -ms-flex: 0 0 50% !important; flex: 0 0 50% !important; }
	}

/*Navi Top-Bar*/
#section-navi { border: 1px solid #FFF; padding-top: 1rem !important; padding-bottom: 1rem !important; }
#section-navi .section-inner {  }
#section-navi img.logo { width: 200px; height: auto; position: relative; float: left; }
#section-navi .btn-show-navi { float: right; display: inline-block; font-size: 1.6rem; margin-top: 1rem; cursor: pointer; width: 100px; height: 3rem; width: auto; }
#section-navi .btn-show-navi-small { display: none; }
#section-navi .btn-show-navi-large {}

#section-navi.section-navi-start {}
#section-navi.section-navi-start .section-inner { text-align: right; padding-left: 300px; padding-top: 2rem !important; }
#section-navi.section-navi-start img.logo { position: absolute; left: 5%; top: -1rem; z-index: 1000; width: 35%; max-width: 300px; height: auto;}
#section-navi.section-navi-start .btn-show-navi { margin: 1rem 0;  }

@media screen and (max-width: 800px) {
	#section-navi.section-navi-start .section-inner { padding-top: 0 !important; }
	#section-navi.section-navi-start img.logo { left: -1rem; top: -1.5rem; width: 55%; }
	#section-navi.section-navi-start .btn-show-navi { margin: 0 0; }
}

@media screen and (max-width: 500px) {
	#section-navi img.logo { width: 150px; }
	#section-navi .btn-show-navi-small { display: inline-block; }
	#section-navi .btn-show-navi-large { display: none; }
}

/*Footer*/
#section-footer { color: #FFF; }
#section-footer .section-inner { padding: 3rem 0; }

	#section-footer img.footer-icon { height: 3rem; margin: 0 2rem 2rem 2rem; width: auto; }
	#section-footer a.footer-meta-link { font-family: 'Ubuntu', sans-serif; color: #FFF; text-decoration: none; text-transform: uppercase; color: #f6af8c; margin: 0 1rem; font-weight: 700; }
	#section-footer a:hover { text-decoration: none; } 

	@media screen and (max-width: 450px) {
		#section-footer a.footer-meta-link { clear: both; display: block; }
		#section-footer img.footer-icon:nth-child(1) { margin-left: 0; }
		#section-footer img.footer-icon:nth-child(3) { margin-right: 0; }
	}

/*Background & Text color*/
.bg-white { background-color: #ffffff; }
.bg-theme { background-color: #f6af8c; }
.text-color-theme { color: #f6af8c; }

/*Flex grid*/
.grid { display: -webkit-flex; display: -ms-flexbox; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; position: relative; }
.grid-cell { -webkit-flex: 1; -ms-flex: 1; flex: 1; box-sizing: border-box; position: relative; }
.grid--gutters { margin: -3rem 0 0 -5rem; }
.grid--gutters > .grid-cell { padding: 3rem 0 0 5rem; }

.grid--bottom-margin { margin-bottom: 6rem; }

.grid-cell--flex { display: -webkit-flex; display: -ms-flexbox; display: flex; }

	/* Alignment per row */
	.grid--top { align-items: flex-start; }
	.grid--bottom { align-items: flex-end; }
	.grid--center {	align-items: center; }

	/* Alignment per cell */
	.grid-cell--top { align-self: flex-start; }
	.grid-cell--bottom { align-self: flex-end; }
	.grid-cell--center { align-self: center; }

	/*Grid cell sizes*/
	.grid-cell--fit { -webkit-flex: 1; -ms-flex: 1; flex: 1; }
	.grid-cell--full { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
	.grid-cell--1of2 { -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%;}
	.grid-cell--1of3 { -webkit-flex: 0 0 33.3333; -ms-flex: 0 0 33.3333; flex: 0 0 33.3333%; }
	.grid-cell--2of3 { -webkit-flex: 0 0 66.6666%; -ms-flex: 0 0 66.6666%; flex: 0 0 66.6666%; }
	.grid-cell--1of4 { -webkit-flex: 0 0 25%; -ms-flex: 0 0 25%; flex: 0 0 25%; }
	.grid-cell--3of4 { -webkit-flex: 0 0 75%; -ms-flex: 0 0 75%; flex: 0 0 75%; }

	@media screen and (max-width: 800px) {
		.grid-cell--1of2 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;  }
		.grid-cell--1of3 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;  }
		.grid-cell--2of3 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%;  }
		.grid-cell--1of4 { -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; }
		.grid-cell--3of4 { -webkit-flex: 0 0 50%; -ms-flex: 0 0 50%; flex: 0 0 50%; }
	}

	@media screen and (max-width: 400px) {
		.grid-cell--1of2 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
		.grid-cell--1of3 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
		.grid-cell--2of3 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
		.grid-cell--1of4 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
		.grid-cell--3of4 { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
	}

/*Typo*/
h1, h2, h3, h4, h5, h6 { font-family: 'Ubuntu', sans-serif; text-transform: uppercase; font-weight: 700; margin-top: 0; line-height: 1.3em; }

h1 { font-size: 1.8rem; }
h2 { font-size: 1.6rem; }
h3 { font-size: 1.4rem; }
h4, h5, h6 { font-size: 1.2rem; } 

.headline-underlined { display: inline-block; position: relative; }
.headline-underlined:after { display: block; content: ' '; background-image: url(/assets/images/textures/underline-navigation.png); background-repeat: no-repeat; 
															position: relative; margin-top: .5rem; bottom: 0; background-size: 100% 100%; width: 100%; clear: both; height: 1rem; }
a { text-decoration: none; color: #f6af8c; }
a:hover { text-decoration: underline; }

a.btn { background-color: #f6af8c; color: #FFF; display: inline-block; padding: 10px 20px; font-weight: bold; text-transform: uppercase; }
a.btn:hover { text-decoration: none; }  

.link-opacity { opacity: 1; -webkit-transition:opacity 100ms ease-in;
											-moz-transition:opacity 100ms ease-in;
											-o-transition:opacity 100ms ease-in;
											transition:opacity 100ms ease-in;}

.link-opacity:hover { opacity: .7; -webkit-transition:opacity 300ms ease-out;
											-moz-transition:opacity 300ms ease-out;
											-o-transition:opacity 300ms ease-out;
											transition:opacity 300ms ease-out; }

.text-color-theme { color: #f6af8c; }
.text-uppercase { text-transform: uppercase; }
.text-large, .text-large * { font-size: 1.1rem; }
.text-centered { text-align: center; }
.text-right { text-align: right; }
.text-ubuntu { font-family: 'Ubuntu', sans-serif; }

p { margin-top: 0; margin-bottom: 1rem; }

/*Aufzählungen*/
ol { margin: 0; padding: 0; }
	ol li { margin-bottom: .5rem; margin-left: 1.25rem; }

/*Allg. Styles*/
hr { margin: 2rem 0; }
.text-centered { text-align: center; }
.clear-float { clear: both; }

.image-full { width: 100%; height: auto; }
.image-teaser { max-width: 100%; height: auto; }

img.border-bottom { border-bottom: 1.5rem solid #F7AE8B; }

/*Startseite*/
#section-start-intro { text-align: center; }
	.section-start-intro-teaser {  }
	.section-start-intro-teaser .img-lust { display: inline-block; vertical-align: top; width: 37.5%; height: auto; float: left; margin-top: 1rem; margin-bottom: 1rem; }
	.section-start-intro-teaser .img-angeln { display: inline-block; vertical-align: top; width: 58.5%; height: auto; float: right; margin-top: 1rem; margin-bottom: 1rem; }
	.section-start-intro-teaser .img-schlafen { display: block; clear: both; float: none; width: 100%; height: auto; }

@media screen and (max-width: 800px) {
	.section-start-intro-teaser { padding: 0; }
	.section-start-intro-teaser .img-schlafen { margin-top: 1rem; }
}

#section-start-teaser {}
	#section-start-teaser .teaser-headline { margin-bottom: 1rem; width: 85%; height: auto; }
	#section-start-teaser a { color: #4f4f4e; text-decoration: underline; }
	#section-start-teaser .teaser-link { font-family: 'Ubuntu', sans-serif; text-transform: uppercase; font-weight: 700; text-decoration: none; color: #4f4f4e; }
	#section-start-teaser .teaser-link:hover { }

/*Forellenhof*/
#section-forellenhof-intro { }
#section-forellenhof-intro .image-teaser { width: 100%; height: auto; box-sizing: border-box;  }

/*Angeln*/
.section-angeln-seen h2 { margin-bottom: .5rem; }
.section-angeln-seen p { margin-top: 0; margin-bottom: 1.5rem; }

.section-angeln-intro-teaser { margin-bottom: 4rem; }
	.section-angeln-intro-teaser .teaser-seen { display: inline-block; width: 23%; height: auto; margin-bottom: 2rem; }
	.section-angeln-intro-teaser .teaser-tiefe { display: inline-block; width: 25%; height: auto; margin: 0 5%; margin-bottom: 2rem; }
	.section-angeln-intro-teaser .teaser-fischarten { display: inline-block; width: 40%; height: auto;  margin-bottom: 2rem; }
	.section-angeln-intro-teaser .teaser-besatz { display: inline-block; width: 47%; height: auto; margin-right: 5%; } 
	.section-angeln-intro-teaser .teaser-ausstattung { display: inline-block; width: 47%; height: auto; } 

@media screen and (max-width: 500px) {
	.section-angeln-intro-teaser .teaser-seen { margin-bottom: 1rem; }
	.section-angeln-intro-teaser .teaser-tiefe { margin-bottom: 1rem; }
	.section-angeln-intro-teaser .teaser-fischarten { margin-bottom: 1rem; }
	.section-angeln-intro-teaser .teaser-besatz { display: block; width: 100%; margin-right: 0; } 
	.section-angeln-intro-teaser .teaser-ausstattung { display: block; width: 100%; } 
}

/*Fischgalerie*/
#section-fischgalerie { border-top: 1px solid #E9E9E9; }
	#section-fischgalerie .section-inner { padding-top: 3rem;  }

	#section-fischgalerie .gallery-items { margin-top: 3rem; }

	#section-fischgalerie .grid-sizer { width: 30.5%; }
	#section-fischgalerie .gutter-sizer { width: 4%; }

	.masonry-item { margin-bottom: 1rem; box-sizing: content-box; width: 30.5%; }
	.masonry-item img { width: 100%; height: auto; }

#section-fischgalerie .teaser-fangen { -webkit-flex: 0 0 53%; -ms-flex: 0 0 53%; flex: 0 0 53%; }
#section-fischgalerie .teaser-fisch { -webkit-flex: 0 0 44%; -ms-flex: 0 0 44%; flex: 0 0 44%; }
	#section-fischgalerie .teaser-fisch img { margin-left: 6%; }

@media screen and (max-width: 500px) {
	#section-fischgalerie .grid-sizer { width: 47%; }
	#section-fischgalerie .gutter-sizer { width: 6%; }
	.masonry-item { width: 47%; }

	#section-fischgalerie .gallery-items { margin-top: 2rem; }
	#section-fischgalerie .teaser-fangen { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
	#section-fischgalerie .teaser-fisch { -webkit-flex: 0 0 100%; -ms-flex: 0 0 100%; flex: 0 0 100%; }
	#section-fischgalerie .teaser-fisch img { margin-left: 0; }
}

/*Textseite*/
#section-text { border-top: 1px solid #E9E9E9; }
		#section-text .section-inner { padding-top: 3rem; padding-right: 20%; }

/*Ferienwohnungen*/
.section-fewo-images { position: relative; height: 300px; }
	.section-fewo-images a { border-right: .3rem solid #FFF; }
	.section-fewo-images img { height: 250px; width: auto; position:relative; border-bottom: 1.5rem solid #F7AE8B; }

	.button-belegungsplan { width: 40%; height: auto; float: right; margin-top: 2rem; }

	.section-fewo-images .slick-prev { position: absolute; left: 1rem; top: 50%; margin-top: -3rem; z-index: 100; background: none; border: none; cursor: pointer; }
	.section-fewo-images .slick-next { position: absolute; right: 1rem; top: 50%; margin-top: -3rem; z-index: 100; background: none; border: none; cursor: pointer; }

	.slick-prev:before { font-family: "FontAwesome"; content: '\f137'; color: rgba(247,174,139,.7); font-size: 3rem; }
	.slick-next:before { font-family: "FontAwesome"; content: '\f138'; color: rgba(247,174,139,.7); font-size: 3rem; }

	.slick-prev:hover:before, .slick-next:hover:before { color: rgba(247,174,139,1); }

.section-fewo-text {}
	.section-fewo-text .section-inner { padding-top: 3rem; }

	@media screen and (max-width: 800px) {
		.section-fewo-images .grid-cell--1of4 { padding-left: 0; }
	}

/*Preise und Öffnungszeiten*/
.table-wrapper { max-width: 100%; overflow: auto; } 

table.preisliste { width: 100%; border-spacing: 10px; border-collapse: separate; }
	table.preisliste td { padding: .0 1rem .25rem 0; vertical-align:top; text-align: right; color: #FFF; font-weight: bold;  border-bottom: 1px solid #ffffff; }
	table.preisliste tr td:first-child { text-align: left; color: #4f4f4e; font-weight: normal; }
	table.preisliste tr.header td { border-bottom: 2px solid #4f4f4e; padding-top: 1.5rem;} 
	table.preisliste tr td.border-white { border-bottom: 1px solid #FFF; text-transform: uppercase; color: #FFF; font-weight: 700; } 
	table.preisliste h3 {color: #4f4f4e; margin-bottom: 0; }
	table.preisliste img { height: 2rem; width: auto; }

/*Kontakt*/
.table-kontakt {}
	.table-kontakt tr td { padding: 0.25rem 1rem 0.25rem 0; }




#banner-message {
    position: fixed;
    bottom: 0;
    z-index: 400;
    background-color: #4f4e4e;
    color: white;
    padding: 1em 2em;
    font-size: .9em;
}
#section-footer {
	margin-bottom: 8em;
}
@media(max-width:1199px) { #section-footer { margin-bottom: 12em; } }
@media(max-width:800px) {#section-footer { margin-bottom: 20em; } }
@media(max-width:370px) {#section-footer { margin-bottom: 32em; } }


.btn.buchungsbutton {
  margin-top: 30px;
  position: absolute;
  right: 0;
  bottom: 24px;
}
@media(max-width:800px) {
.btn.buchungsbutton {
  margin-top: 30px;
  position: relative;
  right: unset;
  bottom: unset;
}
	 }