/* General Style */ 

@font-face {
    font-family: 'Roboto Condensed';
    font-style: normal;
    font-weight: 300;
   /* src: url('/fonts/roboto-condensed-v16-latin-300.eot'); */
    src: local('Roboto Condensed'), local('Roboto-Condensed'),
         url('/fonts/roboto-condensed-v16-latin-300.eot?#iefix') format('embedded-opentype'), 
         url('/fonts/roboto-condensed-v16-latin-300.woff2') format('woff2'), 
         url('/fonts/roboto-condensed-v16-latin-300.woff') format('woff'), 
         url('/fonts/roboto-condensed-v16-latin-300.ttf') format('truetype'),
         url('/fonts/roboto-condensed-v16-latin-300.svg#OpenSans') format('svg'); 
  }
  @font-face {
    font-family: 'Vidaloka';
    font-style: normal;
    font-weight: 400;
    src: local('Vidaloka'), local('Vidaloka-Regular'),
         url('/fonts/vidaloka-v9-latin-regular.woff2') format('woff2'),
         url('/fonts/vidaloka-v9-latin-regular.woff') format('woff');
  }
  
  body {display: -webkit-flex;display:flex; -webkit-flex-flow:row wrap;flex-flow:row wrap;background:#980000;}
  header {display:flex;width:110%;height:12%;background:#000;}
  #logo {width:34%;position:absolute;top:0.2em;left:0.2em;border:none;box-shadow:none;}
  .topFF {display:none; } /*width:auto;position:absolute;top:4%;right:4%;} */
  .topImg {background-size:contain;margin-top:-0.3em;margin-left:-4em;box-shadow:none;border:none;} /*padding-right:14%;}*/
  
  span.gr {font-family:'Vidaloka';font-size:2.6em;line-height:0.7;color:#fff;letter-spacing:-0.5px;text-shadow: -1.5px 1.5px 0.5px #980000;width:13em;padding:0;text-align:right;}
  span.kl {font-family:'Roboto Condensed';font-size:0.8em;line-height:;font-weight:bold;font-style:italic;letter-spacing:1px;color:#fff;text-shadow: -1.5px 1.5px 0.5px #980000;padding-left:0.3em;}
  
  nav {display:block;width:121%;background:url(../image/nav.png)repeat-x;}
  nav ul {display:block;width:90%;text-align:center;margin:0 auto;margin-left:-2.2em;}
  nav ul li {display:inline;margin:0.2em;} 
  nav ul li a {font-family:'Roboto Condensed';color:#fff;font-size:84%;font-weight:bold;letter-spacing:0.5px;line-height:1.5;text-decoration:none;margin-top:1px;padding: 0.2em 0.3em 0.1em 0.3em;border-radius:4px 4px 0px 0px;
      -moz-transition:background 0.2s;
      -webkit-transition:background 0.2s;
      transition:background 0.2s;}
  nav ul li a:hover {background:#eee;color:#980000;text-decoration:none;border-bottom:0.3em solid #ffcc00;}
  nav ul li a.active {border-bottom:0.3em solid #ffcc00;}
  
  #content {display:block;width:100%;min-width:330px;height:auto;background:#fff;margin:0.4em auto;padding:0 1%;border:1px solid #fff;border-radius:5px;box-shadow:1px 1px 5px 5px #fff;}
  #main {display:inline-block;width:56%;padding:1.5em 0.5em 0.3em 0.1em;vertical-align:top;border-right:1px dotted #660000;} 
  #aside {display:inline-block;width:36%;padding:1%;padding-right:0;}
  p {-webkit-hyphens: auto; -moz-hyphens: auto; -ms-hyphens: auto; hyphens: auto;} 
  
  .space {width:98%;height:4em;background:transparent;border:none;}
  .abstand {width:99%;margin-top:3em;margin-bottom:3em;border-bottom:3px dashed #980000;}
  .trenn {width:98%;border-top:3px dashed #ff0000;margin:2em 0;} /* für rechte Spalte */
  table {bordercolor:#ddd;}
  
  #main hr {width:60%;height:1em;border:0;background:transparent;margin:1.5em auto;}
  #aside hr {width:60%;height:1em;border:0;background:transparent;margin:1em auto;}
  
  h1, h2, h3, h4, h5, h6 {font-family:'Vidaloka', serif;font-weight:100;letter-spacing:0.2px;word-spacing:1px;color:#993300;}
  
  h1 {font-size:20px;line-height:1.2em;margin:0em 0em 0.2em 0em;text-align:center;} /* 26px; */
  h2 {font-size:18px;line-height:1.2em;margin:0em 0em 0.4em 0em;} /* 22px; */
  h3 {font-size:22px;line-height:1.2em;margin:0em;padding-top:0.5em;padding-bottom:0.2em;}
  h4 {font-size:0.9em;color:#fff;text-shadow:-0.5px 1px 2.5px #000;margin-top:-6%;} /*letter-spacing:0.8px;margin:0em;}*/
  h5 {width:111%;line-height:1.5em;}     /* abstand - nur bei kleinem bildSchirm */
  h6 {font-size:28px;font-weight:bold;margin:0.5px;text-align:right;padding-right:6px;} /*für TABLE */
  
  p, code {font-family:'Roboto Condensed', sans-serif;letter-spacing:0.3px;word-spacing:0.8px;line-height:1.3;margin:0em;padding-bottom:0.5em;text-align:justify;color:#555;} /*#2b2b2b;}*/
  p {font-size:17px;}
  b {color:#444;margin-top:-2px;font-weight:bold;padding:0 2px;} /*color:#666;}*/
  
  p.mini {display:inline-block;font-size:12px;line-height:1.2;color:#555;letter-spacing:0.8px;text-align:right;margin-top:0.5em;}
  
  code {font-size:16px;color:#555;line-height:0.9;}
  cite {font-size:12px;line-height:0.9;color:#555;}
  klein {font-size:80%;line-height:0.7;color:#555;letter-spacing:0.5px;line-height:8px;}
  big {font-family:'Vidaloka';font-size:25px;font-style:normal;font-weight:100;letter-spacing:1px;color:#993300;margin-right:4px;} 
  var {font-family: 'Vidaloka';font-size:22px;font-style:normal;font-weight:100;line-height:80%;color:#666;margin-right:2px;} 
  sup, sub {font-size:75%;font-weight:normal;}
  kbd {background:#ffd700; font-family:monospace;font-size:85%;color:#333;padding: 0em 0.4em 0em 0.8em;}
  
  article { width:99%;
    -webkit-columns: 1;
       -moz-columns: 1;
            columns: 1;
    -webkit-column-gap: 0px;
       -moz-column-gap: 0px;
            column-gap: 0px; }
                  
  #thema {display:block;width:101%;vertical-align:top;padding:0;margin-bottom:1.5em;}
  .themaLi {display:inline;width:100%;padding-right:1.6em;margin:1em 0;} 
  .themaRe {display:inline;width:100%;float:right;clear:after;margin:1em 0;margin-right:3px;} 
  .themaLi h2, .themaRe h2 {display:inline-block;font-size:180%;line-height:1.2;color:#980000;letter-spacing:0;padding:0em 0.5em;background:#fd0;border-radius:5px;margin:0;}  /* head auf Gelb */
  .morecontent span {display:none;font-size:17px;font-style:normal;font-weight:normal;color:#555;letter-spacing:0;background:#fff;}  /* verdeckter text inkl 'more" */ 
  .comment {font-family:'Roboto Condensed', sans-serif;letter-spacing:0.3px;word-spacing:0.8px;line-height:1.3;font-size:17px;font-style:normal;font-weight:100;margin:-7px 0;margin-bottom:0.8em;padding:5px 0;text-align:justify;color:#555;}  /*erste zeilen - #555 auch für "p" */
  .comment more a {font-size:60%;color:#0254EB;}
  .comment more a:visited {font-size:50%;color:#0254EB;}
  .moreellipses {color:#555;font-size:70%;padding-left:5px;}  /* die ... */
  .morelink {font-size:85%;font-style:normal;font-weight:normal;color:#0254EB;text-decoration:none;outline:none;margin-left:-3px;}
  .themaLi img.zoom, .themaRe img.zoom {width:99%;height:auto;margin-left:1px;margin-top:-11pxpx;}
  
  ul.halb {display:block;width:100.5%;margin:0;padding:0;list-style:none;}
  ul.halb li {width:98%;list-style:none;vertical-align:top;margin-right:20px;margin-bottom:15px;}
  ul.halb li:last-child {border:none;margin-right:0;}
  ul.halb p {margin-top:-1em;}
  
  /* weiter lesen  A L T  */
  .hide {background:transparent;color:blue;border:0;padding:0;}
  .show {background:transparent;color:blue;border:0;padding:0em;margin-top:1em;}
   kleiner {display:none;font-style:italic;text-align:justify;margin-top:1%;}
  #mehr {display:block;width:99.9%;}
   a.blau {font-size:85%;font-weight:normal;color:blue;letter-spacing:1px;}
   div.tab:not(:target) div.content, div.tab:target div.show, div.tab div.hide {display: none;}
   div.tab:target div.content, div.tab:target div.hide {display: block;text-align:justify;color:#555;}
  
  #box {display:inline-block;width:100%;vertical-align:top;text-align:left;font-size:14px;color:#333;margin:0px;}
      a. {font-size:11px;font-weight:normal;color:red;letter-spacing:1px;}
  
  ul.redak {display:block;width:101%;height:auto;margin-left:-1.2em;list-style:none;vertical-align:top;padding-left:0;}
  ul.redak li {display:inline-block;width:47.6%;list-style:none;vertical-align:top;margin-right:0.6em;padding:0;}
  ul.redak li:last-child {width:47%;padding-left:1em;border-left:2px dashed #fd0;margin-right:0;}
  ul.redak hr {width:30%;margin-left:47%;border:0;border-left:1px dashed #fd0;vertical-align:bottom;}
  
  ul.zweiSp {display:block;width:105%;height:auto;margin:0;list-style:none;vertical-align:top;margin-left:-2.3em;}
  ul.zweiSp li {display:inline-block;width:47%;list-style:none;vertical-align:top;margin-right:0.5em;padding:0;}
  ul.zweiSp li:last-child {padding:0;}
  
  ul.galerie {display:block;width:100.5%;margin:0 0 2em 0.2em;padding:0;list-style:none;}
  ul.galerie li {display:inline-block;width:98%;list-style:none;vertical-align:top;margin-right:0.8em;}
  ul.galerie li:last-child {margin-right:0;}
  ul.galerie li img{width:98%;height:auto:}
  ul.galerie p {text-align:center;}
  
  img.ohne {width:90%;height:auto;max-width:100%;border:none;box-shadow:none;border-radius:none;}
  img {box-shadow:0.5px 0.5px 2px 2px #bbb;border-radius:3px;}
  
  img.zoom, img.zoom-kl {
   transition: transform 0.8s;
   -moz-transition: transform 0.8s;
   -webkit-transition: transform 0.8s;
   -o-transition: transform 0.8s;
   -ms-transition: transform 0.8s;
  }
  img.zoom:hover, img.zoom-kl:hover {
      overflow:scroll;
   cursor: zoom-in;
   cursor: -moz-zoom-in;
   cursor: -webkit-zoom-in;
   transform: scale(2.0, 2.0);
   -moz-transform: scale(2.0, 2.0);
   -webkit-transform: scale(2.0, 2.0);
   -o-transform: scale(2.0, 2.0);
   -ms-transform: scale(2.0, 2.0);
  }
  
  video {box-shadow:2px 2px 3px 3px #bbb;border-radius:3px;}
  
  a { font-weight:bold;font-size:100%;color:#980000;text-decoration:none;}
  a:focus,a:hover,a:active {color:#182e7a;text-decoration:underline;}
  
  .tt {background:url('../image/butt.png') no-repeat;background-position:left center;padding-left:1em;margin:0 3px;}
  
  .anime { animation: turner 4s infinite linear }
  @keyframes turner{
      from{ transform: rotateY(0deg) }
      to  { transform: rotateY(360deg) }
  }
  
   .note {background:#ffd700;padding:3px 5px 4px 5px;border-top:2px dashed #fff;border-bottom:2px dashed #fff;margin-bottom:0.5em;}   /*ffce05    b17b00*/
   .hellblau {background:#b9e5fb;padding:2px 5px 4px 5px;border:0.5px solid #bbb;border-bottom:2px solid #bbb;border-left:2px solid #bbb;}
   .gelb {background:#ffff5f;padding:2px 5px 4px 5px;border:0.5px solid #ffd700;border-bottom:2.5px solid #ffd700;border-left:2.5px solid #bbb;}
  
  .row  {display:block;width:101%;margin:0;padding:0;margin-top:2.5em;list-style:none;}
  .row li {display:inline-block;vertical-align:top;margin-right:0.5em;text-align:center;}
  .row li:last-child {margin-right:0em;}
  .row li img {width:98%;margin:0.5em auto;}
  .row li kbd {font-family:'Open Sans';font-size:120%;color:#980000;margin:0.3em 0em;} /*head für galerie */
  .row li p {font-size:110%;text-align:center;margin:0.3em 0em;}
  .row li small {font-size:70%;text-align:center;line-height:1;margin:0.3em 0em;}
  
  .topTermin {width:100%;height:auto;background:#ffd700;margin-top:-1.2em;margin-bottom:1.5em;margin-left:-1em;border-radius:8px 0px 12px 0px;border-bottom:3px solid #980000;padding:7px auto;text-align:center;z-index:111;}
  /*.topTermin big {font-size:24px;color:#993300;line-height:1.3;padding:1px 0 2px 0;}
  .topTermin code {font-size:16px;}
  */
  
  ul.nextTerm {display:inline-block;width:100%;margin:0;padding:0;list-style:none;vertical-align:top;}
  ul.nextTerm li {display:inline-block;width:72%;margin-right:1em;list-style:none;vertical-align:top;}  /*border-collapse:collapse;border:2px solid #980000; */
  ul.nextTerm li:last-child {width:20%;font-size:100%;line-height:1.2;padding:7px 2px;} 
  
  ul.vorsitz {display:block;width:98%;list-style:none;vertical-align:top;padding:0;margin:0 auto;}
  ul.vorsitz li {display:inline-block;width:44%;vertical-align:top;padding:0;margin:0 0.5em;}
  ul.vorsitz p {line-height:1.1;}
  ul.vorsitz img {max-width:8em;margin-bottom:0.5em;}
  
  .vorstand {display:block;width:101%;height:17em;list-style:none;padding-bottom:1em;}
  .vorstand li {display:inline-block;width:5.1em;height:11em;vertical-align:top;margin:0.3em;}
  .vorstand li img {width:5em;height:auto;vertical-align:top;padding-left:0.1em;}
  .vorstand li p {text-align:center;font-size:90%;line-height:1.1;margin-top:0.4em;margin-left:-0.2em;}
  
  #adress {display:block;margin:0 auto;margin-top:15em;}
  
  #ferien { margin:0px;width:98%;padding:0px;border-left:1px solid #fdd; }
  .uno { margin:0;width:98%;padding:2px 0 2px 6px;line-height:22px;}
  .due { background:#ffffba;margin:0;width:98%;padding:2px 0 2px 6px;line-height:22px;} 
  
  #like {display:block;width:auto;height:0.8em;float:right;background:#eee;text-align:center;box-shadow:0.5px 0.5px 2px 2px #ddd;border-radius:3px;padding:0 8px 5px 5px;margin-top:1px;margin-right:0.6em;}
  #like p a, #like p i {display:inline-block;font-family:'Vidaloka';font-size:12px;font-weight:100;font-style:italic;color:#666;vertical-align:top;padding-top:2px;}
  #like img {display:inline-block;border:0;box-shadow:none;vertical-align:top;margin-top:-2px;padding:0 2px;}
  
  /* Liste mit roten quadraten  */
  .liste ul {padding:0px;margin-top:1em;}
  .liste li {list-style:square;font-size:135%;color:#993300;line-height:0.9;margin-top:-0.2em;margin-left:-1em;} 
  .liste li p {font-size:70%;color:#333;margin-top:0.1em;} 
  
  ul.liste {margin:0;}
  ul.liste li {list-style:square;font-size:135%;color:#993300;line-height:0.9;margin-top:-0.2em;} 
  ul.liste li p {font-size:15px;color:#333;}
  
  /* Footer */ 
  footer {display:block;width:98%;height:3em;background:url(../image/nav.png)repeat-x;margin-top:-0.2em;font-size:100%;}
  footer nav ul li a {font-size:15px;}
  p.subline {font-size:11px;color:#fff;text-align:center;margin-top:0.8em;letter-spacing:0.5px;}
  .slidepara {width:66%;heigth:3em;background:#ffff5f;box-shadow:0.5px 0.5px 2px 2px #bbb;border-radius:3px;margin:5px 17% 5px 15%;text-align:center;padding-top:8px;padding-bottom:10px;}
  
  .nachOben {color:#993300;padding-left:35%;} /* padding:1.5em 0; */
    
  .konForm {display:inline-block;width:70%;background:#fffff0;padding:2px 11px;font-size:80%;box-shadow:0.5px 0.5px 2px 2px #bbb;border-radius:5px;}
  form {width:99%;border:0;border:none;text-align:left;padding:4px;padding-top:11px;}
  label {display:block;cursor:pointer;color:#666;} 
  input#realname, input#email, textarea {width:96%;border: 1px solid #ddd;margin-bottom:0.8em;}
  textarea {height:10em;margin-bottom:0.8em;}
  input:focus, textarea:focus {border:2px solid #fd0;}  
  .spende {display:inline-block;width:22%;margin-top:2px;padding-left:1.5em;font-size:88%;text-align:left;}
  
  /* --------------------------------------- */
  
  @media all and (min-width: 359px) {
  .topImg {width:151%;}
  #content {width:151%;min-width:580px;}
  #main {width:50%;}
  #aside {width:36%;}
  h4 {font-size:1.3em;}
  nav ul li a {line-height:2;}
  } 
  
  @media all and (min-width: 480px) {
  .topImg {width:120%;margin-left:-2.3em;margin-top:-0.4em;} 
  #logo {width:30%;}
  h4 {font-size:18px;margin-top:-3%;}
  h1 {font-size:24px;}
  .topFF {display:inline-block;width:auto;position:absolute;top:5px;right:4%;} 
  span.gr {font-size:3.5em;}
  p span.kl {font-size:1.15em;line-height:1.4;}
  ul.vorsitz {display:inline-block;width:99%;margin-left:1em;}
  ul.vorsitz li  {max-width:88%;}
  ul.vorsitz img:last-child {max-width:6.6em;margin-right:1em;}
  ul.galerie li {display:block;width:92%;margin-left:0.5em;}
  #adress {margin-top:-3em;} 
  .trenn {margin:4em 0;}
  nav ul {width:98%;}
  nav ul li a {line-height:1.8;} 
  }
  
  @media all and (min-width: 767px) {    /* 768px */
  #content {width:140%;min-width:620px;padding:0;margin-left:0em;}
  .topImg {width:88%;margin-left:-13%;margin-top:-1%;overflow:visible;}
  #logo {width:24%;margin-top:1em;}
  .topFF {top:2%;}
  p span.gr {font-size:3.8em;}
  p span.kl {font-size:1.3em;}
  nav ul li a {font-size:96%;padding: 0.2em 0.6em 0.1em 0.6em;}
  #main {display:inline-block;width:64%;margin-left:1em;}  
  #aside {display:inline-block;width:28%;height:auto;vertical-align:top;padding:1.5%;}
  .space, .trenn {display:none;}
  .vorstand {margin-bottom:2em;}
  #adress {margin-top:5em;}
  footer {display:block;text-align:center;}
  footer nav {display:inline;text-align:center;}
  .abstand {display:none;}
  /*.animated-text {max-width:780px;}*/
  }
  
  @media all and (min-width: 1080px) {
  .topImg {display:flex;width:1280px;margin-left:-2%;margin-top:-0.5em;}
  #logo {max-width:240px;margin-left:1.5em;margin-top:%;}
  .topFF {top:27%;margin-top:-3%;}
  p span.gr {font-size:4.3em;}
  p span.kl {font-size:1.4em;}
  h4 {font-size:20px;margin-top:-2%;}
  nav ul li a {font-size:100%;padding: 0.2em 0.8em 0.1em 0.8em;}
  #content {display:block;width:94%;max-width:1080px;margin:0 auto;} 
  #main {width:70%;padding:1.5em 0.8em 0.3em 0.5em;} 
  #aside {width:22%;padding:1.3%;}
  #thema {display:block;width:99.8%;margin-left:-1em;}
  .themaLi {display:inline-block;width:47%;padding-right:18px;border-right:1.5px dashed #ddd;margin-bottom:1em;} 
  .themaRe {display:inline-block;width:47%;float:right;clear:after;padding-right:0;margin-left:10px;margin-bottom:1em;}
  .vorstand {margin:1em 0;}
  .vorstand li {height:12em;margin-left:-0.3em;margin-right:1.5em;}
  .vorstand li img {width:6em;}
  ul.galerie li, ul.halb li {display:inline-block;width:45%;}
  ul.galerie li:first-child , ul.halb li:first-child {margin-right:2em;}
  #adress {margin-top:-6em;}
  article { width:100.3%;
    -webkit-columns: 2;
       -moz-columns: 2;
            columns: 2;
    -webkit-column-gap: 20px;
       -moz-column-gap: 20px;
            column-gap: 20px; }
  }
  
  @media all and (min-width: 1280px) {
  .topImg {margin:0 auto;margin-top:-0.7em;}
  #logo {margin-left:6em;margin-top:0.5%}
  .topFF {right:5%;top:28%}
  nav ul li a {font-size:105%;line-height:1.2;padding-top:5px;}
  .space, .trenn {display:none;}
  h1 {font-size:28px;}
  h2 {font-size:22px;}
  #content {width:94%;margin-top:10px;padding-left:2em;} 
  #main {width:66.5%;}
  #aside {width:23%;}
  }