/* FARBEN

#504335 - rgba(80, 66, 52, 1) - dunkelbraun
#ddab5d - rgba(222, 173, 93, 1) - beigegelb
#81414a - rgba(130, 65, 74, 1) - rot

*/

@font-face {
  font-family: 'Forum';
  font-style: normal;
  font-weight: 400;
  src: url('/fonts/forum-v8-latin-regular.eot'); /* IE9 Compat Modes */
  src: local('Forum'),
       url('/fonts/forum-v8-latin-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/forum-v8-latin-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/forum-v8-latin-regular.woff') format('woff'), /* Modern Browsers */
       url('/fonts/forum-v8-latin-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/forum-v8-latin-regular.svg#Forum') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 300;
  src: url('/fonts/roboto-v18-latin-300.eot'); /* IE9 Compat Modes */
  src: local('Roboto Light'), local('Roboto-Light'),
       url('/fonts/roboto-v18-latin-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v18-latin-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/roboto-v18-latin-300.woff') format('woff'), /* Modern Browsers */
       url('/fonts/roboto-v18-latin-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/roboto-v18-latin-300.svg#Roboto') format('svg'); /* Legacy iOS */
}
@font-face {
  font-family: 'Roboto';
  font-style: normal;
  font-weight: 500;
  src: url('/fonts/roboto-v18-latin-500.eot'); /* IE9 Compat Modes */
  src: local('Roboto Medium'), local('Roboto-Medium'),
       url('/fonts/roboto-v18-latin-500.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('/fonts/roboto-v18-latin-500.woff2') format('woff2'), /* Super Modern Browsers */
       url('/fonts/roboto-v18-latin-500.woff') format('woff'), /* Modern Browsers */
       url('/fonts/roboto-v18-latin-500.ttf') format('truetype'), /* Safari, Android, iOS */
       url('/fonts/roboto-v18-latin-500.svg#Roboto') format('svg'); /* Legacy iOS */
}

* {
	font-family: "Roboto", serif;
	font-weight: 300;
	box-sizing: border-box;
	text-decoration: none;
	line-height: 150%;
}
html, body {
	background-color: white;
	padding: 0;
	margin:0;
}


/* TYPO */

a {
	color: inherit;
}
a:hover {
	color: inherit;
	text-decoration: underline;
}


h2 {
	letter-spacing: 2px;
	font-weight: 400;
	margin: 0;
	font-size: 36px;
	text-transform: uppercase;
	font-family: "Forum", serif;
}
b, strong {
	font-weight: 700;
	letter-spacing: 2px;
	text-transform: uppercase;
}
/* SPRACHWAHL */
#sprachwahl {
	position: absolute;
	top:10px;
	right:0px;
}
#sprachwahl ul {
	padding: 0;
	margin:0;
	list-style-type: none;
}
#sprachwahl ul li {
	display: inline-block;
	text-transform: uppercase;
	padding-left: 20px;
	padding-right: 20px;
	border-left: 1px solid rgba(255,255,255,0.4);
	font-size: 18px;
}
#sprachwahl ul li:first-child{
	border-left: 0px;
}
#sprachwahl ul li a {
	color:#504335;
}
#sprachwahl ul li a:hover {
	color:white;
	text-decoration: none;
}
#sprachwahl ul li.active a {
	color:#ddab5d;
}

/* NAVI */
div#menu {
	height:auto;
}
nav {
	background-color: #504335;
	width:100%;
	z-index: 99998;
}
nav.sticky {
	position: fixed;
	top: 0;
}
nav ul {
	width:100%;
	padding: 0;
	margin:0;
	display: flex;
	flex-direction: row;
}
nav li {
	list-style: none;
	flex-grow:1;
}
nav li.nav_16 {
	background-color: rgba(0,0,0,0.2);
	background-color: #81414a;
}
nav li.nav_16:hover,
nav li.nav_16.active {
/* 	background-color: rgba(0,0,0,0.4); */
}
nav li a {
	font-size: 24px;
	color: #ddab5d;
	padding: 20px 0;
	display: block;
	text-align: center;
	letter-spacing: 1px;
	text-transform: uppercase;
	font-family: "Forum", serif;
}
nav li.nav_16 a {
/* 	color:white; */
}
nav li a:hover,
nav li.active a {
	text-decoration: none;
	color: white;
}

/* GRID */

.row {
	display: flex;
	flex-direction: row;
	padding: 0;
	margin: 0;
	flex-wrap: nowrap;
}
.hyphens {
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
	hyphenate-limit-chars: auto 5;
	hyphenate-limit-lines: 2;
}
.col-12 {
	width:100%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-10 {
	width:83%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-9 {
	width:75%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-8 {
	width:66%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-6 {
	width:50%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-4 {
	width:33%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-3 {
	width:25%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-2 {
	width:17%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-offset-left-1 {
	padding-left: 7%;
}
.col-offset-right-1 {
	padding-right: 7%;
}
.col-offset-left-5 {
	padding-left: 5%;
}
.col-offset-right-5 {
	padding-right: 5%;
}
.col-offset-left-10 {
	padding-left: 10%;
}
.col-offset-right-10 {
	padding-right: 10%;
}
.text-center {
	text-align: center;
}
.text-left {
	text-align: left;
}

.text-right {
	text-align: right;
}




/* SLIDER */

.slickslider {
	height:300px;
	width: 100%;
	overflow: hidden;
}


/* STARTFOTO */

#startfoto {
	background-size:cover;
	background-position: center center;
	background-repeat: no-repeat;
	width:100vw;
	height:100vh;
	display: block;
	position: relative;
}
#startfoto img#logo {
	width:100%;
	max-width: 500px;
	height:auto;
	position: absolute;
	bottom:20px;
	left:20px;
}

/* IMPRESSUM */

#impressumzeile {
	background-color: #504335;
	min-height: 50px;
	color:#ddab5d;
	padding-top: 10px;
	width: 100%;
}
#impressum_link1,
#impressum_link2,
#impressum_link3,
#impressum_link4 {
	float:left;
	padding: 0 0 0 5%;
	text-transform: uppercase;
}
#impressum_link1 a,
#impressum_link2 a,
#impressum_link3 a,
#impressum_link4 a {
	text-decoration: none;
	line-height: 36px;
}
#impressum_link1 a:hover,
#impressum_link2 a:hover,
#impressum_link3 a:hover,
#impressum_link4 a:hover {
	color:white;
}
.socialmedia_link {
	float: right;
	padding: 0 0 0 5px;
}
.socialmedia_link a img {
	width: 30px;
	height:30px;
}

#impressum_top {
	float:right;
	padding: 6px 5%;
}
#toptop {
	display: block;
	position: relative;
	border-color: #ddab5d;
	height: 15px;
	width: 15px;
	background: none;
	border-top: 3px solid #ddab5d;
	border-left: 3px solid #ddab5d;
	border-radius: 0;
	transform: rotate(45deg);
	margin: auto;
	top: 7px;
}
#impressum_top:hover #toptop {
	border-top: 3px solid white;
	border-left: 3px solid white;
}

#impressum_inhalt1,
#impressum_inhalt2,
#impressum_inhalt3,
#impressum_inhalt4 {
	padding: 70px 0;
	background-color: rgba(80, 67, 53, 0.9);
	color:white;
	display: none;
	min-height: 100vh;
}

/* SONDERFAELLE */

.hauptbereich, .bereich {
	background-position: center center;
	background-size: cover;
}
 #kaufen div a {
	 display: inline-block;
	 padding: 10px 20px;
	 border: 1px solid #ddab5d;
	 color:#ddab5d;
	 border-radius: 5px;
 }

#kaufen div a img {
	 max-width:100%;
	 height:auto;
 }
  #kaufen div a:hover {
	 display: inline-block;
	 padding: 10px 20px;
	 border: 1px solid #504335;
	 color:#504335;
	 background-color: #ddab5d;
	 text-decoration: none;
 }
#kaufen div a.video {
	 display: inline-block;
	 padding: 0;
	 border: 0;
	 color:#ddab5d;
	 border-radius: 0;
 }
   #kaufen div a.video:hover {
	 display: inline-block;
	 padding: 0;
	 border: 0;
	 color:#504335;
	 background-color: transparent;
	 text-decoration: none;
 }
#kontakt div div.spalte-1 {
	text-align: right;
}
#kontakt div div.spalte-2 {
	text-align: left;
	padding-top: 40px;
}

/* IMAGE LIGHTBOX SELECTOR */

		#imagelightbox
		{
			cursor: pointer;
			position: fixed;
			z-index: 99999;

			-ms-touch-action: none;
			touch-action: none;

			-webkit-box-shadow: 0 0 3.125em rgba( 0, 0, 0, .75 ); /* 50 */
			box-shadow: 0 0 3.125em rgba( 0, 0, 0, .75 ); /* 50 */
		}

		#imagelightbox-caption
		{
			text-align: center;
			color: #ddab5d;
			background-color: #504335;
			position: fixed;
			z-index: 100001;
			left: 0;
			right: 0;
			bottom: 0;
			padding: 0.625em; /* 10 */
		}
#bestellformular span {
	color:#ddab5d;	
}

#bestellformular input {
	width:100%;
	background-color: rgba(222, 173, 93,0.4);
	border: 1px solid #ddab5d;
	border-radius: 5px;
	padding: 10px 15px;
	margin-bottom: 5px;
	color:white;	
	font-size: 16px;
/* 	text-align: center; */
}		
#bestellformular select {
	width:100%;
	background-color: rgba(222, 173, 93,0.4);
	border: 1px solid #ddab5d;
	border-radius: 5px;
	padding: 10px 15px;
	margin-bottom: 5px;
	color:white;
	font-size: 16px;
/* 	text-align: center; */
	-moz-appearance: none; 
	-webkit-appearance: none; 
	appearance: none;
}
#bestellformular button {
	width:100%;
	background-color: #ddab5d;
	border: 1px solid #ddab5d;
	border-radius: 5px;
	padding: 10px 15px;
	margin-bottom: 5px;
	color:#81414a;
	
	font-size: 16px;
	font-weight: 500;
	text-transform: uppercase;
	letter-spacing: 1px;
}
#bestellformular button:hover {
	background-color: white;
	color: #81414a;
}
#bestellformular ::placeholder {
  color: white;
  opacity: 0.5;
}
#bestellformular :-ms-input-placeholder { /* Internet Explorer 10-11 */
  color: white;
}

#bestellformular ::-ms-input-placeholder { /* Microsoft Edge */
  color: white;
}

/* ################################### RESPONSIVE ################################### */

@media only screen and (max-width: 680px) {

nav li a {
	font-size: 18px;
	padding: 25px 0;
}
.row {
	flex-direction: column;
}
.col-12,
.col-10,
.col-9,
.col-8,
.col-6,
.col-4,
.col-3,
.col-2 {
	width:100%;
	flex-grow: 1;
	padding: 0 1%;
}
.col-offset-left-1,
.col-offset-right-1 {
	padding-left: 7%;
	padding-right: 7%;
}
.col-offset-left-5,
.col-offset-right-5 {
	padding-left: 5%;
	padding-right: 5%;
}
.col-offset-left-10,
.col-offset-right-10 {
	padding-left: 10%;
	padding-right: 10%;
}
.gap {
	display: none;
}

}


@media only screen and (max-width: 480px) {

nav li a {
	font-size: 12px;
	padding: 10px 0;
}
#impressumzeile a {
	font-size: 12px;
}
#impressum_link1, #impressum_link2, #impressum_link3 {
	padding: 0 2%;
}
#impressum_link1, #impressum_link2, #impressum_link3 {
	padding: 0 2%;
	display: block;
	float: none;
}
.text_foto {
	flex-direction: column-reverse;
}
/* SONDERFAELLE */

#kontakt div div.spalte-1 {
	background-position: center center !important;
}
#kontakt div div.spalte-2 {
	text-align: center;
}
.socialmedia_link {
	float: none;
	display: inline-block;
	padding: 0 0 0 5px;
	margin-top: 10px;
	margin-bottom: 10px;
}

}


@media only screen and (max-width: 360px) {
nav li a {
	font-size: 10px;
	padding: 10px 0;
}
#impressum_link1, #impressum_link2, #impressum_link3 {
	padding: 0 2%;
	display: block;
	float: none;
}
#impressumzeile a {
	font-size: 12px;
}
#startfoto img#logo {
	max-width: 280px;
}
.socialmedia_link {
	float: none;
	display: inline-block;
	padding: 0 0 0 5px;
	margin-top: 10px;
	margin-bottom: 10px;
}
}