
.fewotrenner {
	background: url(images/trenner.png) no-repeat center center;
	padding: 180px 0;
}
#fewoausgr {
	padding-bottom: 2rem;
}
#fewoausgr .fewotrenner {
	background: url(images/trenner-weiss.png) no-repeat center center;
	background-size: 360px auto;
	padding: 20px 0;
}

#fewotrennergr {
	padding-top: 0px; 
}
#fewotrennerlg {
}
#fewotrennerausst {
	padding: 80px 0;
}
#fewotrennerausst1 {
	padding: 80px 0;
}
#fewotrennerpreise {
	padding: 80px 0;
}
#fewotrennerbuchen {
	padding: 80px 0;
}

#fewobelegung, #fewolage, #fewopreise, #fewobuchen {
	margin: 1rem;
}
#fewobelegung {
}
#fewoaustattungw1,
#fewoaustattung {
	padding: 1rem;
}

#pageHeader h1 {
	text-align: left;
	padding-bottom: 3rem;
}

body.fewo #headerinner {
	position: relative !important;
}

#pageHeader #fewoort {
	position: absolute;
	right: 0px;
	width: 300px;
	height: 64px;
	top: 0;
	text-align: center;
}
#pageHeader #fewoort strong {
	position: absolute;
	top: 30px;
	left: 0;
	width: 100%;
	font-size: 1.8rem;
	font-family: fontheadlines;
	color: #84776A;
}

#fewolinks {
	margin-top: 1rem;
	text-align: center;
}
#fewolinks a {
	font-size: 2rem;
	text-decoration: none;
	margin: 0 0.7rem;
}

#verfuegbarkeit {
	display: inline-block;
	width: 100%;
	margin: 1rem 0;
}
#verfuegbarkeit2 {
	display: inline-block;
	width: 100%;
	margin: 1rem 0;
	text-align: center;
}
#content #verfuegbarkeit #preisabinner {
	width: 99%;
	display: inline-block;
	background: #D1C0B9;
	padding: 0.5rem;
	box-sizing: border-box;
	text-align: left;
}
#verfuegbarkeit a#preisebtn2 {
	width: auto;
	color: #fff;
	padding-left: 25px;
	background: url(images/pfeil-weiter2.png) no-repeat left center #72A741;
	background-size: 20px auto;
}
#verfuegbarkeit a#preisebtn2:hover {
	color: #000;
}
#preisab {
	
}

@media (max-width: 45em) {
	#fewolinks {
		margin-bottom: 2rem;
	}
	#fewolinks a {
		width: 100%;
		display: block;
		margin-bottom: 1rem;
	}
}

#verfuegbarkeit {
	display: inline-block;
	margin: 5%;
	vertical-align: top;
	width: 90%;
	border: 0px solid #273c80;
	text-align: right;
	position: relative;
}
#content #verfuegbarkeit p {
	text-align: right;
	line-height: 1.5rem;
	font-size: 1.3rem;
	color: #000;
}
#verfuegbarkeit a {
	display: inline-block;
	width: 48%;
	padding: 0.2rem 0.5rem;
	text-decoration: none;
	font-size: 1.3rem;
	margin-top: 0rem;
	margin-bottom: 1rem;
	text-transform: uppercase;
	font-family: fontnormal;
	color: #273c80;
	transition-delay: 0ms;
	transition-duration: 300ms;
	transition-property: all;
	transition-timing-function: ease-in;
	-moz-transition-delay: 0ms;
	-moz-transition-duration: 300ms;
	-moz-transition-property: all;
	-moz-transition-timing-function: ease-in;
	-webkit-transition-delay: 0ms;
	-webkit-transition-duration: 300ms;
	-webkit-transition-property: all;
	-webkit-transition-timing-function: ease-in;	
}
.preisebtn {
	padding: 0.2rem 1rem;
	border-radius: 8px;
	color: #273c80;
	background: #ffd218;
	border: 1px solid #273c80;
	transition-delay: 0ms;
	transition-duration: 300ms;
	transition-property: all;
	transition-timing-function: ease-in;
	-moz-transition-delay: 0ms;
	-moz-transition-duration: 300ms;
	-moz-transition-property: all;
	-moz-transition-timing-function: ease-in;
	-webkit-transition-delay: 0ms;
	-webkit-transition-duration: 300ms;
	-webkit-transition-property: all;
	-webkit-transition-timing-function: ease-in;	
	text-decoration: none;
}
.preisebtn:hover {
	background: #465B78;
	color: #fff;
}
#verfuegbarkeit a:hover {
	color: #fff;
}
#verfuegbarkeit .merkebtn {
	position: absolute;
	right: 0.3rem;
	top: 0.3rem;
	min-width: 60px;
	border: 0;
	margin: 0;
	padding: 0;
	height: 60px;
	background: url(images/merkzettel1.png) no-repeat center center;
	z-index: 10;
}
#verfuegbarkeit .gemerkt,
#verfuegbarkeit .merkebtn:hover {
	background: url(images/merkzettel12.png) no-repeat center center !important;
}
#preisebtn {
	display: inline-block;
	margin-bottom: 0.5rem;
	background: url(images/kalsym.png) no-repeat right center #72A741;
	background-size: 20px auto;
	text-align: left;
}
#preisebtn:hover {
}
#verfuegbarkeit #buchenbtn {
	background: url(images/kalsym.png) no-repeat right center #D1C0B9;
	background-size: 20px auto;
	margin-right: 1rem;
	padding-right: 40px;
	text-align: left;
}
#buchenbtn:hover {
}

#abpreis {
	color: #847C6B;
	font-family: fontbold;
	font-size: 1.8rem;
}

#languageChange {
	margin-top: 0;
}
#content #languageChange li::before {
	content: '';
}
#content #languageChange li {
	padding-left: 0;
}

#fewolagedesc, #fewogrundrissdesc {
	padding: 1rem;
}

h2 {
	text-align: left;
}

body .fewoblock h3 {
	font-size: 2.5rem;
}
@media (min-width: 45em) {
	#verfuegbarkeit {
		display: inline-block;
		width: 66%;
		margin: 1rem 2%;
	}
	#verfuegbarkeit2 {
		display: inline-block;
		width: 25%;
		margin: 1rem 2%;
		text-align: left;

	}
	#verfuegbarkeit a {
		width: 18rem;
	}
	#content #verfuegbarkeit #preisabinner {
		width: 18rem;
	}
	#verfuegbarkeit #buchenbtn {
		margin-right: 0;
	}

	h2 {
		text-align: left;
	}
	.fewoblock {
		display: inline;
		float: left;
		width: 48%;
		margin: 0 1% 1rem 0;
		vertical-align: top;
		text-align: left;
	}
	#fewogrundriss, #fewolage {
		margin-top: 100px;
	}
	
	#fewogrundriss img, #fewokarte {
		position: relative;
		display: inline-block;
		width: 50%;
		margin: -100px 4% 1rem 1%;
		margin-bottom: 1rem;
		vertical-align: middle;
	}
	#fewokarte {
		height: 500px;
	}
	#fewogrundriss img {
		margin: -100px 1% 1rem 4%;
		max-width: 60%;
	}
	#fewolagedesc, #fewogrundrissdesc {
		position: relative;
		display: inline-block;
		width: 40%;
		margin-top: 1rem;
		vertical-align: middle;
	}
	#fewogrundrissdesc {
		margin: 0 1% 1rem 0;
		padding: 1rem 1rem 1rem 4%;
		box-sizing: border-box;
		vertical-align: top;
	}
	#fewolinks {
		margin-top: 1rem;
		text-align: right;
		padding-right: 20%; 
	}
	#fewolinks a {
		margin: 0 1.5rem;
		font-size: 1.5rem;
	}
	#pageHeader #fewoort strong {
		top: 40px;
		font-size: 3rem;
	}	
	#pageHeader #fewoort {
		top: 0;
	}
	#pageHeader h1 {
		padding-top: 20px;
	}
	#contentBody #contentInner {
		width: 55%;
		margin-right: 5%;
		display: inline-block;
	}
	
	#header.shrink #headerinner {
		position: fixed !important;
	}
	#header.shrink #headerinner #headerinnercenter {
	}
	#header.shrink #mainnavdesk {
		display: none;
	}
	#fewoheader {
		position: absolute;
		bottom: 0;
		left: 180px;
		height: 100%;
		padding-top: 1.2rem;
	}
	#fewoheader a {
		color: #4F672F;
		font-size: 1.4rem;
		padding: 0.4rem 1rem;
		text-decoration: none;
	}
	#header.shrink #fewoheader {
		display: block;
	}
	#header.shrink #contacthead {
		display: none;
	}
	#shrinktitle {
		font-family: fontbold;
	}
	#fewobilder {
		margin-top: 0;
		padding-bottom: 50px;
	}
	.grid-container {
		padding-bottom: 10px;
	}
}
@media (min-width: 55em) {
	#verfuegbarkeit #buchenbtn {
		margin-right: 1rem;
	}
	.fewoblock {
		width: 32%;
	}
}

#mainnav {
	display: none;
}
.grid-container > .item1 {
  grid-area: firstImg;
  padding: 30% 0;
}
.grid-container > .item3 {
}
.grid-container > .item5 {
}
.grid-container {
  display: grid;
  grid-template-areas:
    'firstImg firstImg . .'
    'firstImg firstImg . .';
  grid-gap: 10px;
  padding: 10px 10px 50px 10px;
}

.grid-container > div {
  text-align: center;
  background-position: center center;
  background-size: cover;
  	background-size: 102% auto;
  padding: 0;
  position: relative;
		transition-delay: 0ms;
		transition-duration: 300ms;
		transition-property: all;
		transition-timing-function: ease-in;
		-moz-transition-delay: 0ms;
		-moz-transition-duration: 300ms;
		-moz-transition-property: all;
		-moz-transition-timing-function: ease-in;
		-webkit-transition-delay: 0ms;
		-webkit-transition-duration: 300ms;
		-webkit-transition-property: all;
		-webkit-transition-timing-function: ease-in;
}
.grid-container > div:hover {
	cursor: pointer;
}
.gallink {
	position: absolute;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	background: rgba(0,0,0,0.0);	
	opacity: 0;
	text-align: center;
	text-decoration: none;
	z-index: 10;
		transition-delay: 0ms;
		transition-duration: 300ms;
		transition-property: all;
		transition-timing-function: ease-in;
		-moz-transition-delay: 0ms;
		-moz-transition-duration: 300ms;
		-moz-transition-property: all;
		-moz-transition-timing-function: ease-in;
		-webkit-transition-delay: 0ms;
		-webkit-transition-duration: 300ms;
		-webkit-transition-property: all;
		-webkit-transition-timing-function: ease-in;
}
#fewobilder div {
	background-repeat: no-repeat;
}
#content .gallink p {
	position: absolute;
	left: 50%;
	top: 50%;
	font-size: 60px;
	font-family: fontbold;
	color: #fff;
	margin-top: -40px;
	margin-left: -30px;
	width: 60px;
	height: 60px;
	z-index: 10;
	background: url(images/lupe-w.png) no-repeat center center;
	background-size: 80% auto;
}
.grid-container > div:hover .gallink {
	background: rgba(0,0,0,0.5);	
	opacity: 1.0;
}
.grid-container > div:hover {
	background-size: 103% auto;
}
#fewoaustattungw1 {
	margin-top: 2rem;
}



iframe::-webkit-scrollbar {
    width: 0px;
    height: 0px;
}

.grid-container div.itemhidden {
	display: none;
}
.grid-container > div.mehrbilder {
	position: absolute;
	z-index: 20;
	right: 20px;
	bottom: 10px;
	width: auto;
	height: 50px;
}

#content .grid-container > div.mehrbilder a {
	text-decoration: none;
}
#content .grid-container > div.mehrbilder span {
	font-size: 20px;
	background: #72A741;
	border-radius: 8px;
	padding: 5px 10px;
	font-family: fontnormal;
	color: #fff;
	text-decoration: none;
	transition-delay: 0ms;
	transition-duration: 300ms;
	transition-property: all;
	transition-timing-function: ease-in;
	-moz-transition-delay: 0ms;
	-moz-transition-duration: 300ms;
	-moz-transition-property: all;
	-moz-transition-timing-function: ease-in;
	-webkit-transition-delay: 0ms;
	-webkit-transition-duration: 300ms;
	-webkit-transition-property: all;
	-webkit-transition-timing-function: ease-in;
}
#content .grid-container > div.mehrbilder span:hover {
	background: #ffd218;
	color: #465B78;
}
#fewobilder {
	position: relative;
}

#fewoaustattung .fewoblock {
	padding-top: 80px;
}
#fewoaustattung .fewoblock1 {
	background: url(images/ausst-schlafen.png) no-repeat center top;	
}
#fewoaustattung .fewoblock2 {
	background: url(images/ausst-bad.png) no-repeat center top;	
}
#fewoaustattung .fewoblock3 {
	background: url(images/ausst-kueche.png) no-repeat center top;	
}
#fewoaustattung .fewoblock4 {
	background: url(images/ausst-wo-allg.png) no-repeat center top;	
}
#fewoaustattung .fewoblock5 {
	background: url(images/ausst-allg.png) no-repeat center top;	
}
.fewoblock {
	text-align: center;
	margin-bottom: 2rem;
}
.fewoblock ul {
	list-style: none;
}
@media (min-width: 45em) {
	.fewoblock {
		text-align: left;
		margin-bottom: 0;
	}
	.fewoblock ul {
		list-style: disc;
	}

	#fewoaustattung .fewoblock {
		padding-top: 0;
		padding-left: 100px;
	}
	#fewoaustattung .fewoblock1 {
		background: url(images/ausst-schlafen.png) no-repeat left top;	
	}
	#fewoaustattung .fewoblock2 {
		background: url(images/ausst-bad.png) no-repeat left top;	
	}
	#fewoaustattung .fewoblock3 {
		background: url(images/ausst-kueche.png) no-repeat left top;	
	}
	#fewoaustattung .fewoblock4 {
		background: url(images/ausst-wo-allg.png) no-repeat left top;	
	}
	#fewoaustattung .fewoblock5 {
		background: url(images/ausst-allg.png) no-repeat left top;	
	}
}

#fewoausgr #fewogrundriss {
	background: #72A741;
}
#content #fewoausgr h2 {
	color: #fff;
}

#fewohead ul li {
	display: inline-block;
	font-size: 1.3rem;
	padding: 0.1rem 1rem 0.5rem 30px;
	color: #000;
}
#fewohead ul {
	margin-bottom: 2rem;
	list-style-position: inside;
}
#fewohead ul li::before {
	content: '';
}
#fewohead ul li.fewopers {
	background: url(images/ikons-fewo-personen.png) no-repeat left top;
	background-size: 30px auto;
	padding-left: 35px;
}
#fewohead ul li.fewogr {
	background: url(images/ikons-fewo-groesse.png) no-repeat left top;
	background-size: 30px auto;
	padding-left: 35px;
}
#fewohead ul li.fewozianz {
	background: url(images/ikons-fewo-grundriss.png) no-repeat left top;
	background-size: 30px auto;
	padding-left: 35px;
}

#preisinfo {
	padding: 1rem;
}




