/* CSS Document */
@charset "utf-8";
@font-face {font-family:'Roboto'; src:url('../fonts/Roboto-Light.ttf') format('truetype'); font-weight:300; font-style:normal; font-display:swap;}
@font-face {font-family:'Roboto'; src:url('../fonts/Roboto-LightItalic.ttf') format('truetype'); font-weight:300; font-style:italic; font-display:swap;}
@font-face {font-family:'Roboto'; src:url('../fonts/Roboto-Regular.ttf') format('truetype'); font-weight:400; font-style:normal; font-display:swap;}
@font-face {font-family:'Roboto'; src:url('../fonts/Roboto-Medium.ttf') format('truetype'); font-weight:500; font-style:normal; font-display:swap;}

html body *:focus {outline:none;}
a {outline:none;}
html, body {padding:0; margin:0; height:100%;}
body {font-family:'Roboto', Arial, Verdana, sans-serif; font-size:12px; line-height:20px; font-weight:300; background:#fff; color:#000;}

.header {position:relative; padding:0; margin:0 auto; width:100%; height:auto; font-size:14px; text-align:center; border-bottom:1px solid #ddd;}
.footer {position:relative; padding:30px 0 30px 0; margin:0 auto; width:100%; height:auto; color:#999; text-align:center; clear:both;}
.main {position:relative; padding:40px 0 0; margin:0 auto; width:auto; max-width:960px; height:auto; text-align:center;}
.text {position:relative; padding:40px 0 0 ; margin:0 auto; width:90%; max-width:660px; height:auto;}
.ausstellung {position:relative; padding:40px 0 0; margin:0 auto; width:100%; max-width:600px; height:auto;}
.clear {clear:both;}
.center {text-align:center;}
strong {font-weight:500;}
hr {height:0px; border:0 none; border-bottom:1px solid #ddd; margin:10px 0 20px;}
sup {line-height:16px;}

table {border:0 none; border-collapse:collapse; margin:0 0 36px 0;}
table td {padding:5px 5px 5px 0; vertical-align:top;}
table td.datum {width:50px; font-weight:400; color:#aaa; text-align:left;}

p, ul, ol {padding:0 0 18px 0; margin:0;}
.footer p {padding:0; margin:0;}

ul, ol {padding:0 0 0 20px; margin:0;}

div.main a img {position:relative; opacity:0.1; width:22%; max-width:200px; margin:20px 1%; box-sizing:border-box;}
div.main a {padding:0; margin:0 auto;}
div.main a:hover {border:0 none; text-decoration:none;}
_:-ms-input-placeholder, :root div.main a:hover {border:0 none; text-decoration:none;}
_:-ms-input-placeholder, :root div.main a:hover img {border:0 none; text-decoration:none; opacity:1;}
div.main a:hover img {opacity:1;}

.text img, .ausstellung img {margin:10px auto 20px; width:100%; display:block;
	-webkit-box-shadow: 1px 2px 5px 0px rgba(00, 00, 00, 0.2);
	box-shadow: 1px 2px 5px 0px rgba(00, 00, 00, 0.2);
}
_:-ms-input-placeholder, :root .ausstellung a img {border:0;}


img.start {margin:60px auto 40px auto; max-width:96%; max-height:auto; display:block;}
a img.start {margin:60px auto 0 auto; padding:0; border:0 none;}
a:hover img.start {border:0 none;}

a:link, a:visited {color:#0be; text-decoration:none;}
a:hover, a:active {color:#0be; text-decoration:underline;}

.footer a:link, .footer a:visited {color:#999; text-decoration:none;}
.footer a:hover, .footer a:active {color:#999; text-decoration:underline;}

.header a:link, .header a:visited {padding:0 10px 20px 10px; margin:0; color:#000; text-decoration:none;}
.header a:hover, .header a:active, .header li.active a {color:#999; text-decoration:none;}

ul.navi {position:relative; padding:0; margin:0 auto; text-align:center; width:auto; height:auto; display:inline;}
ul.navi li {position:relative; padding:0; margin:0; list-style-type:none; line-height:40px; display:inline;}

ul.navi li ul {position:absolute; top:29px; left:-10px; padding:0; margin:0; text-transform:none; z-index:50; display:none;}
ul.navi li ul {position:absolute; top:29px; left:-10px; padding:0; margin:0; text-transform:none; z-index:50; display:none;}
_:-ms-input-placeholder, :root div.header ul.navi li ul {
		position:absolute; top:29px; left:-10px; padding:0; margin:0; text-transform:none; z-index:50; display:none;
}
ul.navi li:hover ul {display:block; border-right:1px solid #ccc; border-bottom:1px solid #ccc; border-left:1px solid #ccc; background:#fff;}
_:-ms-input-placeholder, :root div.header ul.navi li:hover ul {
		display:block; border-right:1px solid #ccc; border-bottom:1px solid #ccc; border-left:1px solid #ccc; background:#fff;
}
ul.navi li ul li {position:relative; padding:0; margin:0; list-style-type:none; display:block; text-align:left; font-size:12px;}
ul.navi li ul li:last-child {padding:0 0 10px 0;}
ul.navi li ul li a {position:relative; width:auto; min-width:70px; line-height:20px; height:auto; min-height:20px; display:block;}
ul.navi li ul li a:link, ul.navi li ul li a:visited {padding:10px 20px 0 20px; margin:0; color:#000; text-decoration:none;}
ul.navi li ul li a:hover, ul.navi li ul li a:active {color:#999; text-decoration:none;}
ul.navi li ul li.active a {color:#000; text-decoration:none;}

a.top {position:fixed; bottom:20px; right:20px; width:38px; height:38px; background:url(../images/top.png); z-index:990;}

h1 {padding:20px 0 10px 0; margin:0 auto; font-size:36px; line-height:48px; font-weight:400; letter-spacing:10px; text-align:center; display:block;}
h2 {padding:0 0 20px 0; margin:0 auto; font-size:24px; line-height:32px; font-weight:400; text-align:center;}
h3 {padding:0; margin:0 0 16px 0; font-size:18px; line-height:24px; font-weight:400;}
h4 {padding:0 0 16px 0; margin:0 0 32px 0; font-size:18px; line-height:24px; font-weight:400; display:block; border-bottom:1px solid #ddd;}
h5 {padding:0; margin:0; font-size:14px; line-height:18px; font-weight:400;}

.totop {position:fixed; bottom:30px; right:30px; width:2px; height:2px; padding:16px 20px 24px; margin:0; 
	border-radius:50%; background:#ddd; z-index:100; opacity:0.5; 
    filter: alpha(opacity=50);} /* For IE8 and earlier */
.totop:hover {opacity:0.9;
    filter: alpha(opacity=90);} /* For IE8 and earlier */
.totop i:before, .totop i:after {content:""; position:absolute; background-color:#fff; width:3px; height:9px;}
.totop i:before {
  -ms-transform: translate(-2px, 0) rotate(45deg); /* IE 9 */
  -webkit-transform: translate(-2px, 0) rotate(45deg); /* Chrome, Safari, Opera */
  transform: translate(-2px, 0) rotate(45deg);
}
.totop i:after {
  -ms-transform: translate(2px, 0) rotate(-45deg);
  -webkit-transform: translate(2px, 0) rotate(-45deg);
  transform: translate(2px, 0) rotate(-45deg);
}

/*///////////////////// IMAGE LIGHTBOX /////////////////////////*/

#imagelightbox {
cursor:pointer; position:fixed; z-index:202;
-ms-touch-action: none; touch-action: none;
-webkit-box-shadow: 0 0 10px rgba( 0, 0, 0, .3 ); /* 50 */
box-shadow: 0 0 10px rgba( 0, 0, 0, .3 ); /* 50 */
}
#imagelightbox-overlay {
background-color:#fff; background-color:rgba(255,255,255,.9);
position:fixed; z-index:201; top:0; right:0; bottom:0; left:0;
}
#imagelightbox-loading, #imagelightbox-loading div {border-radius:50%;}
#imagelightbox-loading {
width: 2.5em; /* 40 */
height: 2.5em; /* 40 */
background-color:#ddd;
position:fixed; z-index:203; top:50%; left:50%; 
padding:0.625em; /* 10 */
margin: -1.25em 0 0 -1.25em; /* 20 */
}
#imagelightbox-loading div {
width: 1.25em; /* 20 */
height: 1.25em; /* 20 */
background-color: #fff;
-webkit-animation: imagelightbox-loading .5s ease infinite;
animation: imagelightbox-loading .5s ease infinite;
}
#imagelightbox-caption {
text-align: center;
color: #fff;
background-color: rgba(0,0,0,0.3);
position: fixed;
z-index: 10001;
left: 0;
right: 0;
bottom: 0;
padding: 0.625em; /* 10 */
}
@-webkit-keyframes imagelightbox-loading {
from { opacity: .5;	-webkit-transform: scale( .75 ); }
50%	 { opacity: 1;	-webkit-transform: scale( 1 ); }
to	 { opacity: .5;	-webkit-transform: scale( .75 ); }
}
@keyframes imagelightbox-loading {
from { opacity: .5;	transform: scale( .75 ); }
50%	 { opacity: 1;	transform: scale( 1 ); }
to	 { opacity: .5;	transform: scale( .75 ); }
}

/*///////////////////////// RESPONSIVE /////////////////////////*/

@media only screen and (max-width: 799px) {
h1 {font-size:30px; line-height:38px; letter-spacing:5px;}

}

@media only screen and (max-width: 399px) {
h1 {font-size:26px; line-height:30px; letter-spacing:3px;}

}