@charset "utf-8"; /* Das CMS basiert auf UTF8, bitte immer stehen lassen */

/* @import url(http://fonts.googleapis.com/css?family=Milonga); */
@import url('https://fonts.googleapis.com/css?family=Contrail+One|Faster+One');

/* -------------------------------------------------------------------------- */
/* Template ----------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/*
   Im ersten Bereich befinden sich nur Elemente, welche im "template.html"
   erstellt worden sind.
*/
/* -------------------------------------------------------------------------- */

   /*html, body, div, td, li {       font-size: 1em;    }*/

   * {
      -webkit-box-sizing: border-box;
      -moz-box-sizing: border-box;
      box-sizing: border-box;
   }
   html,body,div,form,table,nav,aside,footer,header,main {
      margin: 0px; padding: 0px;
   }
   body, html, button {
      font-size: 1em;
      box-sizing: border-box;
   }
   body {
      font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
      background-color: rgba(130,130,150);
   }
   table,td,th,div,li,p,h1,h2,h3,h4,h5,h6 {
      font-family: "Trebuchet MS",Helvetica,Jamrul,sans-serif;
   }
   img { display: block; }

   a { text-decoration: none; color: #e5007d; }
   a:hover { color: #FF0000; }
   hr { clear: both; }

   .logospace {
      height: 200px;
      width: 100%;
      position: fixed;
      z-index: 100;
      background-image: linear-gradient(120deg, #fff 0%, #8fd3f4 100%);
   }
   .logobg {
      height: 100%;
      margin: auto;
      max-width: 1024px;
      background-image: url("winged.png");
      background-position: right;
      background-repeat: no-repeat;
   }
   .logoflex {
      height: 100%;
      display: flex;
      align-items: center;
      flex-wrap: no-wrap;
   }
   .logoimg {
      height: 200px;
      padding: 1em 1em 1em 0;
   }
   .logoimg img { height: 100%; }
   .logotext { 
      font-size: 3em; 
   }


   .right { text-align: right; }
/* -------------------------------------------------------------------------- */
/* TopMenu ------------------------------------------------------------------ */
/* -------------------------------------------------------------------------- */

   .topmenuspace {
      position: fixed;
      top: 200px;
      z-index: 100;
      background-color: rgba(130,130,150);
      width: 100%;
   }
   .mainmenu {
      max-width: 1024px;
      margin: auto;

      display: -webkit-box;      /* iOS <= 6 & Safari <= 6 */
      display: -moz-box;         /* Firefox <= 19 */
      display: -ms-flexbox;      /* IE 10 */
      display: -webkit-flex;     /* Chrome */
      display: flex;

      -webkit-box-orient: horizontal;
      -webkit-flex-direction: row;
      flex-direction: row;
      -webkit-flex-wrap: wrap;
      flex-wrap: wrap;

      padding: 2px 0px 2px 1px;
   }
   .mainmenu div {
      padding: 0;
      border: 0px solid #fff;
      border-right-width: 1px;
      text-transform: uppercase;
      font-size: 1.2em;
      cursor: pointer;
      color: #fff;
      margin: 0px;

     /*TRANSISTIONS*/
      -webkit-transition: background 0.5s ease;
         -moz-transition: background 0.5s ease;
           -o-transition: background 0.5s ease;
          -ms-transition: background 0.5s ease;
              transition: background 0.5s ease;

   }
   .mainmenu div a { color: #fff; display:block; width: 100%; height: 100%; margin:0px; padding: 0px 1em 3px 1em; }
   .mainmenu div:hover { background-color: #fff; }
   .mainmenu div:hover a { color: #000; }
   .mainmenu div.tm1 { background-color: #fff; }
   .mainmenu div.tm1 a { color: #000; }

   .big { font-size: 1.3em; }



   .menu { 
      width: 200px; 
      margin-top: 1.4em;
   }
   .menu li { position: relative; }
   .menu ul {
      margin:0;
      margin-bottom: 7px;
      padding:0;
      list-style:none;
      border: 1px solid #666;
      border-width: 1px 1px 1px 1px;
      border-radius: 5px;
      overflow: hidden;
   }
   .menu ul ul { 
      border: 0px solid #666; 
      margin:0; 
      background-color: white; 
      border-radius: 0;
   }
   .menu ul ul ul { background-color: transparent;  }

   .menu a {
      display: block;
      font-weight: bold;
      font-size: 0.9em;
      color: #000;
      text-decoration: none;
   }
   .menu a:hover { color: #e5007d; }
   .menu li a { padding: 3px 0px 5px 7px; }
   .menu li li a { padding: 3px 0px 5px 7px; font-weight: normal; border: 0px solid #666; border-top-width: 1px; }
   .menu li li li a { padding: 1px 0px 1px 20px; font-weight: normal; }
   .menu li li li li a { padding: 1px 0px 1px 33px; font-weight: normal; }
   .menu li li li li li a { padding: 1px 0px 1px 46px; font-weight: normal; }

   .menu ul.aktiv0 { background-color: rgba(255,255,255,0.6); }

   .aktiveseite {
      position: relative;
      z-index: 1;
      margin-top: 4px;
      margin-left: -20px;
      float: left;
      font-size: 1.2em;
      color: white;
   }

   #activeSite {
      color: white;
      background-color: #e5007d;
   }







/* BUTTON LEISTEN */
.btnbar {
   display: flex;
}
.btnbar > * {
   margin-right: 0.5em;
}
.btnbar .btn {
   border: 1px solid grey;
   background-color: white;
   border-radius: 0.5em;
   padding: 0.3em 0.5em;
   cursor: pointer;
}
.btnbar .btn:hover {
   background-color: #e5007d;
   color: white;
   text-decoration: none;
}




/* -------------------------------------------------------------------------- */
/* Center & Content --------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


   .middleboxspace {
      width: 100%;
      background-color: #eee;
   }

   .middlebox {
      max-width: 1024px;
      margin: auto;
      padding-top: 235px;

      display: -webkit-box;      /* iOS <= 6 & Safari <= 6 */
      display: -moz-box;         /* Firefox <= 19 */
      display: -ms-flexbox;      /* IE 10 */
      display: -webkit-flex;     /* Chrome */
      display: flex;

      -webkit-box-orient: horizontal;

      -webkit-justify-content: space-between;
      justify-content: space-between;
      box-sizing: border-box;
   }

   .contentbox {
      width: 100%; /*79%;*/
      box-sizing: border-box;
      padding: 1.4em;
   }
   .content {
      box-sizing: border-box;
      line-height: 130%;
   }
   .content a:hover {
      text-decoration: underline overline;
      color: #e5007d;
   }
   .content li > ul {
      margin-top: 0.4em;
   }
   .content li {
      margin-bottom: 0.4em;
   }
   .content:after {  content: "."; visibility: hidden; display: block; height: 1px; clear: both; }
   .content .traligntop td { vertical-align: top; }
   .tmdn {
      font-family: 'Contrail One', cursive;
      font-size: 2em;
      margin-top: 0.25em;
   }
   .tbig { font-size: 120%; }
   .breadcrumb {
      font-size: 0.7em;
      font-weight: bold;
      margin-bottom: 10px;
   }
   .breadcrumb a { color: #000; }
   .breadcrumb a:hover { color: red; }


   pre.code {
      margin: 0em;
      border: 2px dotted #aaa;
      background-color: #fff;
      font-size: 1em;
      line-height: 1em;
   }

   div.php {
      font-family: Fixedsys, monospace;
      margin: 0em;
      border: 2px dotted #aaa;
      background-color: #fff;
      font-size: 0.8em;
      padding: 7px;
   }

   div.hinweis {
      background-color: #fdf1a3;
      border: 2px dotted #deb538;
      padding: 7px;
      /* font-weight: bold; */
      color: #555;
      display: flow-root;
   }

   span.mynumlist {
      font-size: 1.3em;
      font-weight: bold;
   }
   .menupic { width: 100%; }







/* -------------------------------------------------------------------------- */
/* Handy Menu --------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */


    #handyMenu {
      display: none;
      background-color: rgba(0,0,0,0.5);
      box-sizing: border-box;
    }
    #handyMenuSchalter {
      font-size: 2em;
      text-align: center;
      color: #fff;
      padding: 3%;
      cursor: pointer;
      box-sizing: border-box;
    }
    #handym {
      display: none;
      box-sizing: border-box;
    }
    #handym ul {
      margin: 0;
      padding: 0;
      box-sizing: border-box;
    }
    #handym li > ul { display: none; }
    #handym li {
      list-style: none;
      background: rgba(0,0,0,0.1);
      box-sizing: border-box;
      width: 100%;
      position: relative;
    }
    #handym li li a { padding-left: 1.2em; }
    #handym li li li a { padding-left: 2.4em; }
    #handym li li li li a { padding-left: 3.6em; }
    #handym li li li li li a { padding-left: 4.8em; }
    #handym a {
      display: block;
      margin: 1px;
      padding: 0.5em;
      text-decoration: none;
      color: white;
      font-weight: bold;
      font-size: 1.6em;
    }
    #handym a:hover {
      background: orange;
    }
    #handym div {
      margin:0; padding:0 0.3em 0 0.3em;
      position: absolute; right: 0; height: 100%;
      //display: table-cell; vertical-align: middle;
      font-size: 2em;
      font-weight: bold;
      border: 0px solid rgba(255,255,255,0.4);
      border-left-width: 2px;
      cursor: pointer;
      color: rgba(255,255,255,0.4);
    }
    #handym a.aktiv {
      background-color: orange;
    }
    #handym ul.open {
      display: block;
    }












/* ========================================================================== */
/* Footer */
/* ========================================================================== */
   .footer {
      margin:0; padding:0;
      margin-bottom: 15px;
      margin-top: 2em;
      padding-top: 1em;
      max-width: 1024px;
      margin: auto;

      display: -webkit-box;      /* iOS <= 6 & Safari <= 6 */
      display: -moz-box;         /* Firefox <= 19 */
      display: -ms-flexbox;      /* IE 10 */
      display: -webkit-flex;     /* Chrome */
      display: flex;

      -webkit-box-orient: horizontal;
      -webkit-flex-direction: row;
      flex-direction: row;

      -webkit-flex-direction: row;
      flex-wrap: wrap;

      -webkit-justify-content: space-between;
      justify-content: space-between;
   }

   .footerflex {
      border: 1px solid #666;
      background-color: rgba(255,255,255,0.7);
      color: #666;
      border-radius: 8px;
      width: 170px;
      height: 40px;
      box-sizing: border-box;
      margin-bottom: 5px;
   }
   .footerflex div {
      margin:0; padding:0;
      border: 0px solid #666;
      width: 100%;
      height: inherit;
      display: table;
   }
   .footerflex div div {
      display: table-cell;
      width: 100%;
      height: inherit;
      text-align: center;
      vertical-align: middle;
      font-weight: bold;
   }
   .f1 table {
      width: 100%;
      box-sizing: border-box;
      border-spacing: 0;
      border-collapse: collapse;
   }
   .mdnsuchfeld {
      border: 0px solid #000;
      background-color: transparent;
      width: 100%; box-sizing:
      border-box;
      font-size: 1em;
      padding-left: 8px;
      color: #666;
      font-weight: bold;
      font-family: Arial;
   }
   .suchbutton {
      margin: 0; padding: 0;
      border: 0px solid #000;
      background-color: transparent;
      font-size: 1.2em;
      margin-right: 4px;
      color: #666;
   }
   .suchbutton:hover { color: #000; }
   .f3 div div { cursor:pointer; }
   .f3 div div span:hover { color: black; }
   .myfa2 {
      color: rgba(0,0,0,0.5);
      font-size: 1.6em;
      display: table-cell;
      text-align: center;
      vertical-align: middle;
   }
   .myfa2:hover { color: black; }




/* ========================================================================== */
/* Kommentare */
/* ========================================================================== */
   .mdnkommentarebg {
      z-index: 101;
      left:0px; top:0px;
      position: fixed;
      width: 100%;
      height: 100%;
      background-color: rgba(0,0,0,0.6);
   }
   .mdnkommentare {
      z-index: 11;
      position:relative;
      width: 420px;
      height: 420px;
      top: 50%; left: 50%;
      margin: -210px 0px 0px -210px;
      padding: 15px;
      border: 1px solid #000;
      background-color: #eee;
      overflow: scroll;
      box-sizing: border-box;
      background-color: #eee;
   }
   .mdnkommentare table {
      border-spacing: 0;
      border-collapse: collapse;
      width: 100%;
   }
   .mdnkommentare td {
      vertical-align: top;
   }
   div.hidekomms {
      width:auto;
      float:right;
      margin-top:-15px;
      padding:0px;
      cursor:pointer;
      font-weight:bold;
      font-size:28px;
   }

   td.komname, td.komdatum, td.kominhalt {
      background-color: #ffa;
      border: 1px solid #ccc;
      padding: 5px;
   }

   td.komname {
      border-width: 1px 0px 0px 1px;
      font-weight: bold;
   }
   td.komdatum {
      border-width: 1px 1px 0px 0px;
      text-align: right;
   }
   td.kominhalt {
      border-width: 0px 1px 1px 1px;
      background-color: rgba(255,255,255,0.75);
   }
   td.komleer { height: 17px; }
   p.hidekomms {
      text-align:center;
      font-weight:bold;
      cursor:pointer;
   }
   .komsubmit {
		width:100%;
		border: 1px solid #ccc; 
		border-radius: 0.3em;
		background-color: #ffa; 
		margin-top:5px;
		padding: 0.4em 0.2em;
   }


/* -------------------------------------------------------------------------- */
/* CMS ELEMENTE ------------------------------------------------------------- */
/* -------------------------------------------------------------------------- */
/*
   Elemente die vom CMS-Basissystem benötigt werden.
   Bzw. in der Standardausgabe / Templates
*/
/* -------------------------------------------------------------------------- */

   /* Inhaltsbereich -------------------------------------------------------- */
   .cmspic {
      margin: 0; padding: 0;
      border: 1px solid black;
      border-radius: 10px;
      overflow: hidden;
      cursor:pointer;
      display: inline-block;
      text-align: center;
   }
   .cmspic img {
      max-width: 100%;
   }

   .cmspiclinks     { float: left;  margin-right: 7px; max-width:30%; }
   .cmspicrechts    { float: right; margin-left: 7px;  max-width:30%; }
   .cmspiczentriert {               margin:auto;       max-width: 100%; }
   .cmspicstandard {}

   .cmspicoverlay {
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      max-width: none;
      position: fixed;
      z-index: 100;
      display: block;
      border: 0px solid #000;
      border-radius: 0;
      background-color: rgba(255,255,255,0.8);
      padding: 0em;
      margin: 0;
      text-align: center;
      vertical-align: center;
      float: none;
   }
   .cmspicoverlay img {
      max-width: 90% !important;
      max-height: 90% !important;
      display: inline-block;
   }
   .cmspicportrait {
      width: 80px; height: 80px;
      border: 1px solid black;
      border-radius: 50%;
      background-repeat: no-repeat;
      background-position: center top;
      background-size: cover;
      float: left;
      margin: 0.2em 0.5em 0.2em 0;
      display: inline-block;
   }
   .cmspicportrait2 {
      top: 0; left: 0;
      width: 100%;
      height: 100%;
      max-width: none;
      position: fixed;
      z-index: 100;
      display: block;
      border: 0px solid #000;
      border-radius: 0;
      background-color: rgba(255,255,255,0.8);
      padding: 0em;
      margin: 0;
      float: none;

      background-repeat: no-repeat;
      background-position: center;
      background-size: contain;
   }
/*
   img.cmspiclinks { cursor:pointer; float: left; margin-right: 7px; border: 0px solid #666; max-width:30%; }
   img.cmspicrechts { cursor:pointer; float: right; margin-left: 7px; border: 0px solid #666; max-width:30%; }
   img.cmspiczentriert { cursor:pointer; margin:auto; border: 0px solid #666; max-width:98%; }
   img.cmspicstandard { cursor:pointer; width: 95%; }

   img.cmspiclinks, img.cmspicrechts, img.cmspiczentriert, img.cmspicstandard {
      border: 1px solid black;
      border-radius: 10px;
   }
*/

   a.cmsinternerlink { }

   pre {
      margin: 0px;
      border: 1px dotted #00b;
      padding: 7px;
   }
   

   /* Formular -------------------------------------------------------------- */
   #cmsform span.errorspan {
      font-weight: bold;
      color:red;
   }
   #cmsform span.cmsformhinweis {
   }
   #cmsform td {
      font-family: Arial, Verdana;
      padding-bottom: 5px;
   }
   #cmsform td.leer { font-size:6px; }
   #cmsform td.error {
      font-size: 0.8em;
      color: red;
      font-weight: bold;
      padding: 0px;
   }
   #cmsform td.cmsformtitelneeded {
      font-weight: bold;
      width:80px;
      white-space:nowrap;
   }
   #cmsform td.cmsformtitel {
      width:80px;
      white-space:nowrap;
   }
   #cmsform td.cmsformkapitel {
      padding: 5px 0px 5px 0px;
      font-weight: bold;
      border: 1px solid #000;
      border-width: 1px 0px 1px 0px;
   }
   #cmsform input.cmsformtext {
      width: 98%;
      border: 1px solid #000;
   }
   #cmsform input.cmsformtext2 {
      border: 1px solid #000;
   }
   #cmsform textarea.cmsformarea {
      width: 98%;
      border: 1px solid #000;
   }
   #cmsform input.cmsformsubmitgreen {
      border: 1px solid #000;
      background-color: #8f8;
      font-weight: bold;
   }
   div.cmsfakebutton {
      display:inline;
      border: 1px solid #000;
      background-color: #8f8;
      font-weight: bold;
      padding: 2px 5px 1px 5px;
      font-family: Arial;
   }
   div.cmsfakebutton a { color: black; }
   #cmsform input.cmsformsubmitred {
      border: 1px solid #000;
      background-color: #f88;
      font-weight: bold;
   }
   #cmsform select.cmsformselect {
      border: 1px solid #000;
   }

   
   /* Datei-Upload ---------------------------------------------------------- */
   span.cmsdz1 {
      font-weight: bold;
      color: #d60;
      cursor: pointer;
   }
   span.cmsdz2 {
      font-weight: bold;
      color: #000;
      cursor: pointer;
   }
   span.cmsdz3 {
      font-weight: bold;
      color: #080;
      cursor: pointer;
   }



   .sublinkdivtitel {
      font-weight: bold;
      margin: 0.5em 0 0.3em 0;
   }
   .sublinkdiv {
      border: 1px solid #bbb;
      border-radius: 7px;
      padding: 7px;
      display: inline-block;
      margin: 0.3em 0.3em 0 0;
      white-space: nowrap;
      cursor: pointer;
      background-color: white;
   }
   .sublinkdiv:hover {
      background-color: #e5007d;
      color: white;        
   }
   .sublinkanker, .sublinkanker:hover {
      font-weight: bold;
      text-decoration: none !important;
      color: inherit;
      cursor: inherit;
   }


   .suchteaser {
      font-size: 0.8em;
      padding-left: 0.7em;
   }



   .printlogo {
      display: none;
      gap: 1em;
      align-items: center;
   }
   .printlogo img {
      display: inline-block;
      width: 70px; height: auto;
   }
   .printlogo div { 
      display: inline-block;
      font-size: 3em;
   }

/* ========================================================================== */
/* Fensterbreiten */
/* ========================================================================== */
   /* 1em = 16px */
   @media screen and (max-width:650px) {
      .body2 {
         -webkit-flex-wrap: wrap;
         -ms-flex-wrap: wrap;
         flex-wrap: wrap;
         -webkit-justify-content: center;
         -ms-justify-content: center;
         justify-content: center;
         -webkit-align-items: flex-start;
         -ms-align-items: flex-start;
         align-items: flex-start;
      }
      .maincontainer {
         width: 100%;
         margin: 0px;
         margin-bottom: 10px;
         height: auto;
      }
      .menu, .mainmenu { display: none; }
      .handymenu, #handyMenu { 
         display: block;
         padding-top: 200px; 
      }
      .contentbox { width: 100%; }
      .content { margin-left: 0px; border-radius: 0px; }

      div.mdnkommentare {
         width: 100%; height: 100%;
         top: 0px; left: 0px;
         margin: 0px;
      }
      .footer {
         -webkit-box-orient: vertical;
         -webkit-flex-direction: column;
         -ms-flex-direction: column;
         flex-direction: column;
      }
      .footerflex {
         width: 100%;
         height: auto;
         border-radius: 8px;
         border-width: 1px;
         font-size: 2em;
      }
      .mdnsuchfeld { width: 100%; }
      .mdnsuchsubmit { width: 3em; }
      .f2 { display: none; }
      .f4 { padding-top: 5px; }
      .hideByHandy { display: none; }
      .middlebox {
         padding-top: 0;
      }
   }
   @media screen and (min-width:650px) {
      .body2 {
         -webkit-flex-wrap: wrap;
         -ms-flex-wrap: wrap;
         flex-wrap: wrap;
         -webkit-justify-content: center;
         -ms-justify-content: center;
         justify-content: center;
         -webkit-align-items: flex-start;
         -ms-align-items: flex-start;
         align-items: flex-start;
      }
      .menuflex { display: none; }
      .maincontainer { width: 100%; height: auto; }
      .f2 { display: none; }
      .middlebox, .logobg, .footer, .mainmenu {
      	padding-right: 0.5em;
      	padding-left: 0.5em;
      }
   }
   @media screen and (min-width:1050px) {
      .body2 {
         -webkit-flex-wrap: nowrap;
         -ms-flex-wrap: nowrap;
         flex-wrap: nowrap;
         -webkit-justify-content: center;
         -ms-justify-content: center;
         justify-content: center;
         -webkit-align-items: flex-start;
         -ms-align-items: flex-start;
         align-items: flex-start;
      }
      .maincontainer { width: 920px; height: auto; }
      .menuflex { display: none; }
      .f2 { display: block; }
      .middlebox, .logobg, .footer, .mainmenu {
      	padding-right: 0;
      	padding-left: 0;
      }

   }
   @media print {
      html, body, div.body2, div.maincontainer, div.middlebox, div.contentbox, div.content {
         display: block; overflow: visible; position:relative;
         background-color: transparent; background-image: none;
         width: 100%; border-width: 0px; margin: 0; padding: 0;
      }
      .middleboxspace { background-color: transparent; }
      .headerbox { width: 100%; border-width: 0px; margin: 0; padding: 0; }
      .logospace { display: none; }
      img.logo { width: 40%; }
      .mainmenu, .handymenu, #handyMenu, .footer, .myfa, .menu, .google1, .mdnkommentarebg, .cmsadminmenu { display: none; }
      div.content { margin-top: 1.2em; }
     .print { display: none; }
     .printlogo {
         display: flex;
     }
   }

table.white2nd:nth-of-type(2) {
   background-color: white;
}