body { font-family: 'Muli'; line-height: 1.5em; position: relative; font-size: 120%; color: #000; margin: 50px; }

.container { width: 100%; margin: 0 auto 90px auto; max-width: 1800px; padding: 2%; border: 3px solid #8e1b2a; border-radius: 20px; }

.clearfloat { clear:both; height:0; font-size: 1px; line-height: 0px; }
.clearfix:before,.clearfix:after { content: " "; display: table; }  
.clearfix:after { clear: both; }  
.clearfix { *zoom: 1; }

h1, h2, h3, h4 { font-family: 'ff-meta-serif-web-pro'; font-weight: 700; color: #8e1b2a; }
h1 { line-height: 40px; }
h3 { margin: 20px 0 5px 0; }
h4 { margin: 0 0 20px 0; font-weight: 500; }

p { margin: 0 0 10px 0; }

p a { font-weight: bold; color: #8e1b2a; text-decoration: none; }

.teaser { color: #8e1b2a; font-weight: bold; }

#dev { display: none; border: 1px solid #000; position: fixed; bottom: 5px; right: 5px; padding: 10px; background: #fff; }

#tafel { position: absolute; top: -15px; left: -10px; background: #8e1b2a; color: #fff; width: 60px; height: 60px; line-height: 50px; border-radius: 100%; text-align: center; font-family: 'ff-meta-serif-web-pro'; font-size: 250%; z-index: 99; }

#sprachen { margin-bottom: 30px; }
#sprachen .sprachen_wrapper { float: right; width: 300px; width: 200px; }
#sprachen .sprachen_wrapper .sprachen_el { border-radius: 5px; }
#sprachen .sprachen_wrapper .sprachen_el img { border-radius: 5px; }
main .sprachen_wrapper { max-width: 1100px; margin: 0 auto; }
.sprachen_wrapper .sprachen_el { display: block; float: left; width: 30%; margin-left: 5%; box-shadow: 2px 2px 5px rgba(0,0,0,0.3); border-radius: 10px; cursor: pointer; width: 47.5%; }
.sprachen_wrapper .sprachen_el.aktiv { border: 2px solid #8e1b2a; padding: 2px; }
.sprachen_wrapper .sprachen_el:first-child { margin-left: 0; }
.sprachen_wrapper .sprachen_el img { display: block; width: 100%; border-radius: 10px; }

.auswahl_wrapper { margin: -1%; }
.auswahl_wrapper .auswahl_el { display: block; float: left; width: 23%; background: #bb767f; color: #fff; padding: 15px 20px; border-radius: 5px; text-decoration: none; text-align: center; margin: 1%; font-size: 120%; }
.auswahl_wrapper .auswahl_el:hover { background: #8e1b2a; }

img, #lightcase-content, #lightcase-case { border-radius: 10px; }
a img { display: block; width: 100%; }

.bild_rechts { display: block; float: right; width: 100%; max-width: 400px; margin: 0 0 20px 20px; font-size: 80%; font-style: italic; color: #000; text-decoration: none; line-height: 1.2em; }
.bild_rechts.small { max-width: 300px; }
.bild_rechts img { margin-bottom: 5px; }

.bilder_rechts { float: right; width: 100%; max-width: 300px; margin: 0 0 20px 20px; }
.bilder_rechts a { display: block; width: 100%; margin-bottom: 20px; font-size: 80%; font-style: italic; color: #000; text-decoration: none; line-height: 1.2em; }
.bilder_rechts a img { margin-bottom: 5px; }

.bild_unten { display: block; width: 70%; font-size: 90%; font-style: italic; color: #000; text-decoration: none; line-height: 1.2em; }
.bild_unten img { float: left; width: 150px; margin-right: 10px; }

.fullpic { display: block; width: 100%; font-size: 80%; font-style: italic; color: #000; text-decoration: none; line-height: 1.2em; }
.fullpic img { margin-bottom: 5px; }

.bigpic { display: block; width: 100%; max-width: 1000px; font-size: 80%; font-style: italic; color: #000; text-decoration: none; line-height: 1.2em; }
.bigpic img { margin-bottom: 5px; }

.bilder_wrapper.rechts { float: right; width: 30%; margin: 0 0 20px 20px; }
.bilder_wrapper { margin: -1%; }
.bilder_wrapper a { display: block; float: left; width: 18%; margin: 1%; font-size: 80%; font-style: italic; color: #000; text-decoration: none; line-height: 1.2em; }
.bilder_wrapper.zwei a { width: 48%; }
.bilder_wrapper.drei a { width: 31.33%; }
.bilder_wrapper.vier a { width: 23%; }
.bilder_wrapper.sechs a { width: 14.667%; }
.bilder_wrapper a img { margin-bottom: 5px; }

.copyright { text-align: right; font-size: 90%; }

.box { padding: 40px; border-radius: 10px; background: #ddd; width: 100%; max-width: 800px; position: relative; }
.box h3 { margin-top: 0; }
.box.zitat:before { content: '’’'; color: #fff; position: absolute; top: 90px; left: 10px; font-size: 250px; letter-spacing: -20px; z-index: 1; }
.box.zitat:after { content: 'ʻʻ'; color: #fff; position: absolute; bottom: -40px; right: 40px; font-size: 280px; letter-spacing: -45px; z-index: 1; }
.box.zitat .text { position: relative; z-index: 2; }

.msg_head { cursor:pointer; -ms-user-select: none; -webkit-user-select: none; -moz-user-select: none; user-select: none; border-radius: 5px; font-family: 'ff-meta-serif-web-pro', serif; font-weight: 500; }
div.msg_head { font-size:130%; margin:15px 0 0 0; color: #181f22; background: #ddd; padding: 10px 10px 12px 10px; line-height: 30px; }
div.msg_head h2 { font-size: 100%; margin: 0; color: #fff; }
div.msg_head div:first-child { float: left; margin-right: 2px; width: 35px; text-align: center; line-height: 30px; }
div.msg_head div:first-child:before { content: "\f105"; font-family: "fontello"; font-style: normal; font-weight: normal; font-size: 25px; margin-right: 5px; }
div.msg_head.opened { background: #a61426; color: #fff; font-weight: 700; }
div.msg_head.opened h2 { color: #a61426; }
div.msg_head.opened div:first-child:before { content: "\f107"; }
div.msg_body { padding: 1% 0 1% 15px; }
div.msg_body p:first-child { margin-top: 0; }
.msg_body h4:first-child { margin-top: 0; margin-bottom: 10px; }

footer { position: fixed; bottom: 0; left: 0; width: 100%; padding: 10px; background: rgba(255,255,255,1); z-index: 100; box-shadow: -2px 0px 5px rgba(0,0,0,0.5);  }
footer .navigation a { color: #fff; background: #bb767f; padding: 5px 15px; border-radius: 5px; text-decoration: none; }
footer .navigation a:hover { background: #8e1b2a; }
footer .navigation a span { margin-right: 5px; }
footer .navigation .prev:before, footer .navigation .next:after, footer .overview:before { font-family: "fontello"; font-style: normal; font-weight: normal; width: 20px; height: 20px; line-height: 20px; font-size: 20px; border-radius: 100%; background: #fff; text-align: center; display: inline-block; color: #8e1b2a; }
footer .navigation .prev { float: left; }
footer .navigation .prev:before { content: "\f104"; margin-right: 10px; }
footer .navigation .next { float: right; }
footer .navigation .next:after { content: "\f105"; margin-left: 10px; }

footer .navigation a.overview span { margin: 0; }
footer .navigation .overview { position: absolute; width: 135px; left: 50%; margin-left: -67px; padding: 5px 10px; }
footer .navigation .overview.cz { width: 120px; margin-left: -60px; }
footer .navigation .overview.fr { width: 115px; margin-left: -57px; }
footer .navigation .overview:before { content: "\E805"; margin-right: 10px; color: #fff; background: none; }

.flex_container { display: -webkit-flex; display: -ms-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.flex_el { display: -webkit-flex; display: -ms-flexbox; display: flex; }
.flex_el .hilfscontainer { display: block; width: 100%; }

.box_wrapper { margin: 0 -1%; }
.box_wrapper .flex_el  { width: 48%; margin: 1%; float: left; padding: 40px; border-radius: 10px; background: #ddd;  }
.box_wrapper .flex_el  p.teaser { margin: 0; }
.box_wrapper .flex_el .hilfscontainer h3:first-child { margin-top: 0; }

.bilder_wrapper { display: -webkit-flex; display: -ms-flex; display: flex; -webkit-flex-wrap: wrap; -ms-flex-wrap: wrap; flex-wrap: wrap; }
.bilder_wrapper a { display: -webkit-flex; display: -ms-flexbox; display: flex; }
.bilder_wrapper a .hilfscontainer { display: block; width: 100%; }

@media screen and (max-width:1000px) {
    body { font-size: 100%; margin: 20px; }
    #tafel { top: -10px; }
    .bilder_wrapper.sechs a { width: 18%; }
    .bilder_wrapper.rechts { width: 40%; }
}

@media screen and (max-width:800px) {
    .bild_rechts { max-width: 300px; }
    .bild_unten { width: 100%; }
    .bilder_wrapper a, .bilder_wrapper.vier a, .bilder_wrapper.sechs a, .bilder_wrapper.fuenf a { width: 31.33%; }
    .bilder_wrapper.special a { float: none; width: 98%; }
}

@media screen and (max-width:600px) {
    .container { padding: 15px; border-radius: 10px; }
    body { margin: 10px; }
    #tafel { width: 50px; height: 50px; line-height: 40px; top: -5px; left: -5px; }
    #sprachen .sprachen_wrapper { width: 200px; }
    footer .navigation a span { display: none; }
    .bild_rechts, .bild_rechts.small { max-width: 250px; }
    .bilder_rechts { float: none; margin: 0 auto; }
    .box_wrapper .flex_el { width: 98%; float: none; }
    footer .navigation .overview, footer .navigation .overview.fr, footer .navigation .overview.cz, footer .navigation .overview.en { width: 40px; margin-left: -20px; padding: 5px 10px; }
}

@media screen and (max-width:500px) {
    .bild_rechts, .bild_rechts.small { float: none; margin: 10px auto; max-width: 300px; }
    div.msg_body { padding: 10px; }
    .bilder_wrapper.rechts { width: 100%; }
}

@media screen and (max-width:400px) {
    body { font-size: 90%; }
    .bilder_wrapper a, .bilder_wrapper.drei a, .bilder_wrapper.vier a, .bilder_wrapper.sechs a, .bilder_wrapper.fuenf a { width: 48%; }
}