* { margin:0; padding:0; }

@font-face {
    font-family: 'ibm_plex_serifbold';
    src: url('fonts/IBM_Plex_Serif/ibmplexserif-bold-webfont.woff2') format('woff2'),
         url('fonts/IBM_Plex_Serif/ibmplexserif-bold-webfont.woff') format('woff'),
         url('fonts/IBM_Plex_Serif/IBMPlexSerif-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'ibm_plex_serifregular';
    src: url('fonts/IBM_Plex_Serif/ibmplexserif-regular-webfont.woff2') format('woff2'),
         url('fonts/IBM_Plex_Serif/ibmplexserif-regular-webfont.woff') format('woff'),
         url('fonts/IBM_Plex_Serif/IBMPlexSerif-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;

}

@font-face {
    font-family: 'ibm_plex_serifitalic';
    src: url('fonts/IBM_Plex_Serif/ibmplexserif-italic-webfont.woff2') format('woff2'),
         url('fonts/IBM_Plex_Serif/ibmplexserif-italic-webfont.woff') format('woff'),
         url('fonts/IBM_Plex_Serif/IBMPlexSerif-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'tinosbold';
    src: url('fonts/Tinos/tinos-bold-webfont.woff2') format('woff2'),
         url('fonts/Tinos/tinos-bold-webfont.woff') format('woff'),
         url('fonts/Tinos/Tinos-Bold.ttf') format('truetype');
    font-weight: bold;
    font-style: normal;

}

@font-face {
    font-family: 'tinositalic';
    src: url('fonts/Tinos/tinos-italic-webfont.woff2') format('woff2'),
         url('fonts/Tinos/tinos-italic-webfont.woff') format('woff'),
         url('fonts/Tinos/Tinos-Italic.ttf') format('truetype');
    font-weight: normal;
    font-style: italic;

}

@font-face {
    font-family: 'tinosregular';
    src: url('fonts/Tinos/tinos-regular-webfont.woff2') format('woff2'),
         url('fonts/Tinos/tinos-regular-webfont.woff') format('woff'),
         url('fonts/Tinos/Tinos-Regular.ttf') format('truetype');
    font-weight: normal;
    font-style: normal;
    }



html, body { color: #484848; font-family: 'ibm_plex_serifregular', serif; height: 100%; font-weight: normal; background-color: white; position: relative; }
/* html { background-size: 100%; } */
.main {height: 100%; }
p { font-size: 0.9em; hyphens: auto; font-weight: normal; line-height: 1.5em; text-align: left; letter-spacing: 0; column-count: 1; column-width: 200px; column-gap: 30px; column-rule: 0px solid red; word-wrap: break-word; }
.impressum { font-size: 1em; }

td {}

#menudivwrapper { width: 100%; border-top: 1px solid #666; border-bottom: 1px solid #666; }
#menudiv { text-align: center; width: 1006px; height: 50px; order-top-style: solid; }

#Bildbox{
width:99%;
}

strong, b { color: #b99330; font-family: 'ibm_plex_serifbold'; font-weight: bold; }
i, em { font-family: 'ibm_plex_serifitalic'; font-weight: normal; }

.italic { font-family: 'ibm_plex_serifitalic'; font-weight: normal; font-style: italic; }
.bold { font-family: 'ibm_plex_serifbold'; font-weight: bold; font-style: normal; }

#container { width: 100%; margin:0 auto; }
#header { width:100%; margin-top: 3%; margin-bottom: 3%; }

.datenschutz { border-top: 1px solid #969696; float: left; color: #484848; font-size: 0.7em; padding-top: 2px; }
.datenschutz a:link { color: #7d5d00 !important; font-family: 'ibm_plex_serifbold'; font-weight: bold; text-decoration: none; }
.datenschutz a:visited { color: #7d5d00 !important; text-decoration: none; }

.datenschutzliste ul { font-size: 1.05em; list-style-type: square; margin:0; padding: 0 0 0 1em; position: relative; }
.datenschutzliste ul li { display: list-item; float: inherit; }

.termine { min-height: auto; display: flex; column-count: 1; }
.termine ul { position: relative; width: auto; font-size: 0.9em; hyphens: auto; font-weight: normal; line-height: 1.5em; text-align: left; letter-spacing: 0; word-wrap: break-word; list-style: square outside; padding-left: 15px; column-count: 1; }
.termine ul li { display: list-item; float: inherit; hyphens: none; }
.termine ul a { line-height: initial; font-weight: bold; text-decoration: none; text-transform: none; letter-spacing: 0em; display: initial; hyphens: none; background: none; background-color: none; }
.va-bild { width: 100%; height: auto; margin: 22px 0px 20px 0px; }



.clearfix::after {
  content: "";
  clear: both;
  display: block;
}

.logoleiste { display: flex;
flex-wrap: wrap;
justify-content: center; }

.teaser { width: 49%; }
.teaser3 { width: 32.5%; }
.partner { padding-top: 15px; }
.firmenname { font-family: 'Tinos', serif; font-size: 2.15em; text-transform: uppercase; text-align: center; letter-spacing: 0.17em; float: left; margin: 20px 30px; padding-top: 10px; padding-bottom: 5px; padding-left: 2px; }
.blocker { clear: both; margin-bottom: 2px; }
.img-galerie { width: 49%; margin-top: 0.3%; margin-right: 0.3%; }
.img-werbung { width: 48%; margin-top: 0.1%; margin-right: 0.1%; border: solid 1px #969696; }
.img-kuenstler { width: 49%; margin-top: 2%; margin-bottom: 2%; margin-right: 0.3%; }

/* #content { background-color: white; float:left; width:60%; min-height: 200px; margin-bottom: 2%; padding: 2% 2% 2%; font-size: 1.05em; } */
h1 { font-family: 'Tinos', serif; color: #b99330; font-size: 1.35em; font-weight: normal; font-style: normal; text-transform: uppercase; letter-spacing: 0.08em; }
strong.h1 { color: #fff !important; }
h3 { font-family: 'Tinos', serif; color: #967726; font-size: 1.35em; font-weight: normal; font-style: normal; line-height: 1.4em; text-decoration: none; text-transform: uppercase; letter-spacing: 0.08em; margin-top: 0em; margin-bottom: 0.55em; border-bottom: 1px solid #969696; }
h2 { color: #b99330; font-size: 1.25em; font-weight: normal; }

#pdf { width: 350px; background-image: url(pics/pdf.png); background-repeat: no-repeat; background-position: left center; min-height: 90px; padding-top: auto; padding-bottom: 0; padding-left: 110px; margin-bottom: 20px; margin-top: 20px;}
#jpg { width: 350px; background-image: url(pics/jpg.png); background-repeat: no-repeat; background-position: left center; min-height: 90px; padding-top: auto; padding-bottom: 0; padding-left: 110px; margin-bottom: 20px; margin-top: 20px;}
#yt { width: 350px; background-image: url(pics/yt.png); background-repeat: no-repeat; background-position: left center; min-height: 90px; padding-top: auto; padding-bottom: 0; padding-left: 110px; margin-bottom: 20px; margin-top: 20px;}
#flexcont {
	
   display: -webkit-flex;
   display: -ms-flex;
   display: flex;
   -webkit-flex-wrap: wrap;
   -ms-flex-wrap: wrap;
   flex-wrap: wrap;
    -webkit-box-align: center;
    /* -webkit-align-items: center; */
     -ms-flex-align: center;
    /* align-items: center; */
     -webkit-box-pack: center;
     -webkit-justify-content: center;
     -ms-flex-pack: center;
     justify-content: center;
     margin-bottom: 40px;
}


.panel-1 {
  
  /*display: -webkit-flex; 
  display: -ms-flexbox; 
  display: flex;*/
  border-radius: 0px; width: 45%; padding: 30px; float: left; }

.panel-1 a:link { color: #7d5d00 !important; font-family: 'ibm_plex_serifbold', serif; font-weight: bold; text-decoration: none; }
.panel-1 a:visited { color: #7d5d00 !important; text-decoration: none; }
.panel-1 a:hover { color: #009ee0 }
.panel-1 a:active { color: #009ee0 }


.panel-2 {
  
 /* display: -webkit-flex; 
  display: -ms-flexbox; 
  display: flex;*/
  border-radius: 0px; color: #fff; width: 20%; padding: 15px 30px 30px; float: left; border-left: 1pt solid #969696; }

.panel-2 li { width: 100%; padding-right: 2%; border: none; }
.panel-2 li a { font-family: 'ibm_plex_serifregular', serif; font-weight: normal; font-size: 0.9em; font-variant: normal; line-height: 1.45em; height: 35px; text-align: left; background-size: 100% 100%; background-repeat: no-repeat; background-position: left center; text-transform: none; letter-spacing: normal; width: 94%; margin-bottom: 10px; }
.panel-2 li:hover a { color: #b99330; font-family: 'ibm_plex_serifregular', serif; background-color: transparent; background-size: 100% 100%; }



/*Strip the ul of padding and list styling*/
ul { font-size: 14px; list-style-type:none; margin:0; padding:0; position: absolute; }

/*Create a horizontal list with spacing*/
li {
	display:inline-block;
	float: left;
	margin-right: 1px;
}

/*Style for menu links*/
li a { color: #666; display:block; min-width: 125px; height: 50px; font-family: 'Tinos', serif; text-align: center; line-height: 50px; font-weight: bold; text-decoration: none; text-transform: uppercase; letter-spacing: 0.1em; }

/*Hover state for top level links*/
li:hover a { background-color: #d6d6d6; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; }

li:visited a { color: #fff; background-image: none; background-repeat: repeat; background-attachment: scroll; background-position: 0 0; }


/*Style for dropdown links*/
li:hover ul a { background: #b99330; color: #fff; height: 50px; line-height: 46px; text-align: center; min-width: 125px; }

/*Hover state for dropdown links*/
li:hover ul a:hover {
	background: #967726;
	color: #fff;
}

/*Hide dropdown links until they are needed*/
li ul {
	display: none;
}

/*Make dropdown links vertical*/
li ul li {
	display: block;
	float: none;
}

/*Prevent text wrapping*/
li ul li a {
	width: auto;
	min-width: 10px;
	padding: 0 0px;
}

/*Display the dropdown on hover*/
ul li a:hover + .hidden, .hidden:hover {
	display: block;
}



/*Style 'show menu' label button and hide it by default*/
.show-menu { font-family: 'Tinos', serif; text-decoration: none; color: #000; font-size: 1.5em; text-align: center; letter-spacing: 0.5em; padding: 10px 0; display: none; }

/*Hide checkbox*/
input[type=checkbox]{
    display: none;
}

/*Show menu when invisible checkbox is checked*/
input[type=checkbox]:checked ~ #menu{
    display: block;
}


.clearfix::before,
.clearfix::after {
  content: " ";
  display: table;
} 

.clearfix::after {
  clear: both;
}

.clearfix {
  *zoom: 1; /* FÃ¼r den IE6 und IE7 */
}

 

/*    Ab nur noch 1027 px Breite    */
@media screen and (max-width: 1027px){
	
	p { font-size: 1.05em; }
	#header { text-align: right; width: 95%; padding-right: 5%; padding-top: 2%; }
	.logo { width: 35%; height: 35%; }
	.logoleiste { text-align: center; margin-left: 0pt; padding-left: 5%; }
	.firmenname { width: 100%; font-family: 'Tinos', serif; font-size: 2.15em; text-transform: uppercase; text-align: center; letter-spacing: 0.17em; float: left; }
	#container { width: 100%; margin: 0px; }
	.panel-1 { width: 80%; }
	.panel-2 { width: 80%; border-top: 1px solid #969696; border-left-color: none ; border-left-width: 0; }
.datenschutz { width: 300px; border-top: 1px solid #969696; border-left-color: none ; border-left-width: 0; } 
	#menudivwrapper { width: 100%; margin-top: 10px; margin-bottom: 8px; padding-right: 0; padding-left: 0; }
	#menudiv { text-align: center; width: auto; height: 50px; }
	.img-galerie { width: 49%; margin-top: 0.3%; margin-right: 0.3%; }
	
	.teaser3 { width: 100%; }
	
	.termine { margin-bottom: inherit; }
	.termine ul { width: auto; }
	.termine ul li { display: list-item; float: inherit; }
	
	#menudiv ul {
		position: static;
		display: none;
	}
	/*Create vertical spacing*/
	li {
		
	}
	/*Make all menu links full width*/
	ul li, li a { width: 100%; }
	/*Display 'show menu' link*/
	.show-menu {
		display:block;
	}
	
	/*Style for dropdown links*/
	li:hover ul a { background: #b99330; color: #fff; height: 50px; line-height: 46px; text-align: center; min-width: 125px; }
	li:hover ul a:hover { background: #967726; color: #fff; }

}


