/* Farben */
body {background: #f7f7f7;}
.headerbg {background: #b1b1b1;;}
.footer, .footer p {background:#b1b1b1;color: #fff!important;}
h1, h2, h3, h4, h5, h6, p, ul, ol {color: #666;}
.nav, .nav a {color: #777;}
body.home nav.nav a {color: #fff}
body.home nav.nav.full {background:rgba(0,0,0,0.85);color: #fff;}
body.home .katalog {background:#b1b1b1;}
body.home .katalog h3 {color:#fff;}
body.home .header {background:#bbb;}
body.home .header h1 {color: #fff;}

@media(min-width: 768px){
.header  {color: #fff;background: none}
.header * {color: #fff;}
}


/* Layout */
body {margin: 0;padding: 0px;}
.content{width: 100%; max-width: 1060px;padding-bottom: 5px}
.header {padding: 20px 10px 6px;background: url(/images/opera-contemporary_white.png) no-repeat 95% 20%;background-size: 90px}
.footer {padding: 15px 0;margin-top: 5px;}
.footer p {margin: 0;}
.footer span {white-space:nowrap}
@media(min-width:992px){
	.footer {padding: 20px 0;margin-top: 5px;}

}
.headerbg {position:absolute;height: 140px;width: 100%;z-index: -1;}
a.nolink {cursor:default}
.content{width: 100%;max-width: 1100px;padding-bottom: 5px;}
.textpic {margin: 4px 20px 15px 0}
.float-left {float:left}
.smartnav {position:absolute;right: 15px;top: 45px;}
img#smartnav, img#smartnav-close {width: 30px}
img#smartnav-close {display:none;}
.invisible,.invisible * {display:none!important}
.col-sm-10 {padding-right: 10px;}
h1, h2, h3, h4, h5, h6, p, ul, ol {font-family:Arial, Helvetica, sans-serif;font-weight: normal;}
h1 {font-size: 24px;}
h2 {font-size:20px;}
h3 {font-size: 18px;}
h4 {font-size: 16px;}
h5 {font-size: 14px;}
h6 {font-size: 12px;}
p, ul, ol {font-size: 15px;}
.headertext {padding-top: 25px;}
.container {text-align: left;width: 100%;max-width: 1260px;padding: 0;}
.nav {margin: 10px 0 0 0;display:none;position:absolute;z-index: 1;background: #f7f7f7;width: 100%;}
.nav>div {}
.nav ul {padding:0;margin: 5px 0 0 0;list-style-type: none;}
.nav ul li {border-top: 1px solid #aaa;padding: 5px 10px;}
.nav a {display:block;line-height: 20px;text-decoration:none;}
.nav .kataloge {border-top: 1px solid #aaa;padding: 10px;}
.nav .kataloge ul {margin: 5px 0 0 -10px;}
.nav .kataloge ul li  {margin-bottom: 1px;padding: 5px 20px;}

body.nav-in .container-fluid,
body.nav-in .pictures,
body.nav-in .footer {opacity:0.5!important}

.text {margin: 0 10px;}
.text p {line-height: 1.5em;}
.text .bildleiste {width:100%}
.text .bildleiste img {width: 18%;margin-left: 1%;height:auto;}
.text .bildleiste img:first-child {margin-left: 0;}
.text .haendler {margin-bottom: 20px; line-height: 1.5em}
.text .haendler p {margin-bottom: 0px;}

.pictures img {width:100%;}
.pictures a {position:relative;float:left;width: 100%;padding: 5px;overflow: hidden;display: block;}

.pictures .overlay {position:absolute;width: calc(100% - 10px);height: calc(100% - 10px);opacity: 0;text-align: center;left:5px;bottom:5px;display: block;background:rgba(0,0,0,0.5);}
.pictures .capture {position:absolute;width: 100%;text-align: center;left:0;bottom: 0;display: block;line-height: 30px;margin-bottom: 30%;color: #fff;opacity:0;text-transform: uppercase;}

/*
.pictures .overlay {position:absolute;width: 100%;height:100%;opacity: 0;text-align: center;left:0;bottom:0;display: block;background: rgba(255,255,255,0.9);}
.pictures .capture {position:absolute;width: 100%;text-align: center;left:0;bottom: 0;display: block;line-height: 30px;margin-bottom: 30%;color: #444;opacity:0;font-size: 16px;text-transform: uppercase;}
*/

.pictures.uebersicht .overlay {position:absolute;width: calc(100% - 10px);height: calc(100% - 10px);opacity: 1;text-align: center;left: 5px;bottom: 5px;display: block;background: rgba(0,0,0,0.3);}
.pictures.uebersicht .capture {font-size: 24px;letter-spacing: 0.1em;text-transform:uppercase;margin-bottom: 26%;opacity: 1;color:#fff}


.pictures a:hover .overlay,
.pictures a:focus .overlay {
   animation-name: dark-overlay;
   animation-duration: 0.5s;
   animation-fill-mode: forwards;
}
@keyframes dark-overlay {
    from { opacity: 0) }
    to   { opacity: 1 }
}
.pictures a:hover .capture,
.pictures a:focus .capture {
   animation-name: capture-in;
   animation-duration: 1s;
   animation-delay: 0.1s; 
   animation-fill-mode: forwards;
}
@keyframes capture-in {
    from { opacity: 0) }
    to   { opacity: 1 }
}



.pictures {margin: 10px 10px 0 5px;overflow: hidden;}
.pictures p.beschreibung {margin-left: 5px;}{margin: 10px 10px 0 0;}
.pictures.uebersicht a {display:block;float:left;width: 100%;}
.pictures.uebersicht img {width: 100%;height: auto;}
.pictures .old {clear:left}
.pictures .old img {margin: 5px 6px;height:auto}

img.weiter {
	width: 140px;
	margin: 10px
}
@media(min-width: 585px){
.pictures a {width: auto;}
.pictures a.w33,.pictures div.w33 {width: 33.33%;}
.pictures a.w33.center,.pictures div.w33.center {margin:0 33%}
.pictures a.w50 {width: 50%}
.pictures a.w50.center {margin:0 25%}
.pictures a.w66 {width: 66.66%}
.pictures a.w66.center {margin:0 16.5%}
.pictures img {width:100%;}
.pictures .old img.w33 {width:calc(33% - 13px);}
.pictures .old img.w50 {width: calc(50% - 16px)}
.pictures .old img.w66 {width: calc(66% - 16px)}

.footer p {font-size: 1em;}
img.weiter {
	width: auto;
	margin: 30px;
}
div.w33 {float:left; margin-bottom: 7px}
div.w33 a {padding: 0;}

}

@media(min-width: 768px){
.header  {background: none}
div.nav {display:block!important; position:static; background: none; margin-left: 10px}
.nav>div, .nav ul {margin:0;}
.nav ul li,
.nav .kataloge {border-top: none;padding: 3px 0 0 0;}
.nav .kataloge {padding: 8px 0 0 0;}
.nav .kataloge ul {margin: 1px 0 0 10px;}
.nav .kataloge ul li  {margin-bottom: 1px;padding: 0;}
.headertext {padding-top: 58px;}
.col-sm-2 {
	display:block;
	width: 180px;
}
.smartnav {display:none}
.nav {display:block;}
.nav .main:after {
  content:"";
  display:block;
  width: 100%;
  height: 45px;
  position:relative;
  left:-10px;
  top: 0;
  background:url(/images/menutrenner.svg);
  background-repeat: no-repeat;
  background-position: bottom center;
}
        img#smartnav, img#smartnav-close {display:none}
.col-sm-10 {width: calc(100% - 180px);padding-right: 0;}
.text {margin: 15px 40px 0 10px;}
.text .bildleiste img {width: 18.5%;margin-left: 1%;height:auto;}
.text .meldung {padding-bottom: 10px}
.text .meldung:before {
  content:"";
  display:block;
  width: 100%;
  height: 35px;
  position:relative;  top:0px;
  background:url(/images/menutrenner.svg);
	background-repeat: no-repeat;
	background-position: bottom center;
}
.text .meldung:first-child::before {display:none;}
.pictures {margin: 10px 20px 0 5px;max-width: 836px;}
.pictures p.beschreibung {margin-left: 5px;}
.pictures.uebersicht a {display:block;float:left;width: calc(50% - 10px);}
}

@media(min-width: 1060px){
.pictures.uebersicht img {width: 100%;height: auto;}
}
@media (min-width:1270px){
.text {margin: 15px 0 0 0;}
.textpic {margin: 4px 30px 20px 0}
.pictures {margin: 10px 20px 0 -5px;}
.nav {margin: 10px 0 0 0;}
}

/* Startseite */
body.home.nav-in .container-fluid {display:none;}
body.home nav.nav.full {display:none;margin:0;/* min-height: 100vh; */padding: 25px 25px 0 25px;}
body.home .nav-bg {margin-top: 0)}
body.home nav.nav>div>ul,
body.home nav.nav div.kataloge {width: calc(100% - 50px)}
body.home .video,
body.home .katalog .col-sm-6,
body.home .pic, body.home .logo {padding:0}
body.home .pic img{width: 100%}
body.home .logo img{width: 90%;margin: 4% 5%;}
body.home .katalog h3 {margin:0;line-height: 60px;font-size:20px}
body.home .pic.top,body.home .pic.bottom {margin-bottom: 4px}
@media(min-width:768px) {
  body.home .katalog a {
    display:block;
    float:left;
    width:33%;
   padding:5%;
  }
body.home .pic.bottom {/* margin-bottom: 0px */}

 }
  body.home .katalog a {
    display:block;
    float:left;
    width:33%;
   padding:1%;
    margin-bottom: 5px;
  }

body.home .katalog a img{width:100%;box-shadow:rgba(0,0,0,0.25)0px 3px 5px}
body.home .responsive-video iframe {
position: absolute;
top: 0;
left: 0;
width: 100%;
height: 100%;
}
body.home .responsive-video {
position: relative;
padding-bottom: 56.25%; /* Default for 1600x900 videos 16:9 ratio*/
padding-top: 0px;
height: 0;
overflow: hidden;
}

@media(min-width:500px){
	body.home .header {text-align:center;}
	body.home .header h1 {margin: 0; line-height: 40px; font-size: 22px}
}

@media(min-width:600px){
body.home .nav-bg {margin-top: calc(50vh - 15em)}
body.home nav.nav.full {padding:25px;height: 100vh;}
body.home nav.nav>div>ul {width: 30%; float:left}
body.home nav.nav .kataloge,
body.home nav.nav ul li {border:none;padding: 5px 0;text-align: center;}
}
body.home div.smartnav,
body.home img#smartnav {display:block;cursor:pointer}
body.home div.smartnav {position:absolute;right: 15px;top: 12px;z-index: 1;}
body.home div.smartnav #smartnav{margin-top:7px}
body.home .header {padding: 10px 15px}
body.home .header h1 {margin: 0; line-height: 40px;font-size: 15px}



div.pp_default .pp_content_container .pp_description {text-align:center;padding: 10px 65px 5px 100px;}
@media only screen and (max-width: 767px) {
	 .pp_pic_holder{ left: 0% !important; width: 100% !important;  margin-left: 5px !important; }
	 div.pp_default .pp_content_container .pp_right{ padding-right: 21px !important; }
	 .pp_content, #pp_full_res img{ width: 100% !important; height: 100% !important; }
	 div.pp_default .pp_content_container .pp_details {margin-top: 20px !important;width:99%!important }
}