/* ----------------------------------------------------------------------------- */
*, *:before, *:after {
    -webkit-box-sizing:   border-box; /* Safari/Chrome, andere WebKit-Browser */
    -moz-box-sizing:     border-box; /* Firefox, andere Gecko-Browser */
    box-sizing:       border-box; /* Opera/IE 8+ */
}

/* 0 --Container------------------------------------------------------------------ */

.page-wrapper {
    margin:         0;
}

header {
    padding:         0.6em 20px;
}

aside, footer {
    padding:         0.6em 20px;
}

section {
    padding:         0 20px;
}

.mainContent {
    width:           100%;
    border-top:       1px solid transparent;
}

.mainContentwithout {
    width:           100%;
    border-top:       1px solid transparent;
  padding:        1em;
}

aside {
  margin-top:       0.8em;
    margin-left:       0;
}

#karte {
  width:          30em; /*400px; */
  height:          30em;
  margin-right:      20px;
  margin-bottom:      20px;
  float:          right;
}

/* 0-- Kontakt------------------------------------------------------------------ */

#sendbutton {
   margin: 6px;
 }

.meinbutton {
   color:         #444;
   background-color:   #eee;
   letter-spacing:   2px;
   font-size:       12px;
   padding:       5px 15px;
   border-radius:     5px;
   -moz-border-radius: 5px;
   -webkit-border-radius: 5px;
   border:       1px solid rgba(0,0,0,0.3);
   border-bottom-width: 3px;
}

.meinbutton:hover {
 background-color:     #e3e3e3;
 border-color:       rgba(0,0,0,0.5);
}

.messageStackError {
   width:         100%;
   padding:       5px;
   margin-bottom:     10px;
   background-color:   #ffb3b5;
 }

 #vorstand {
  font-family:     Verdana, Arial, sans-serif;
  width:        100%;
  margin-bottom:     10px;
 }

 #vorstand th {
  font-size:       11px;
  width:        33%;
  line-height:     1.5;
  font-weight:    bold;
  text-align:      left;
 }
 #vorstand td {
  width:        33%;
  font-size:       11px;
  line-height:     1.5;
 }

 .eng {
  margin-bottom:    2px;
 }

.nach {
  display:      none;
}

/* 0-- Textauszeichnung ---------------------------------------------------------*/


h1 {
  width:           14em;        /* erzwingt zweizeiler */
     margin:         0.8em  0 1.1em 0;
  font-size:        1.1em;
}

h2 {
    margin:         0.6em 20px;
}

h3 {
    margin:         0.6em 0;
}

ul {
    padding:         0;
  margin:          0.6em 20px;
}

/* 0-- header ------------------------------------------------------------------ */

.headerlogo {
  height:         5em;
  float:          left;
  margin:         0 0.5em 0 -0.6em;
}

/* 0--Aside-------------------------------------------------------------------- */

.sideimg {
  width:           95%;
}

/* 0--Tabellen------------------------------------------------------------------ */

.weite13 {
  width: 13%;
}

.weite40 {
  width: 40%;
}

.weite50 {
  width: 50%;
}

.weite80 {
  width: 80%;
}

.weite100 {
  width: 100%;
}

/* 0-- Navigation--------------------------------------------------------------- */


nav ul {
    margin:         0 0 0.625em 20px;
}

nav ul > li {
    margin-left: 0;
    border-bottom:       1px solid rgba(250, 250, 250, 0.6);
}

nav ul > li > a, nav ul > li > strong {
    padding:         0.6em 20px;
    display:         block;
}

nav ul a:link {
    text-decoration:     none;
}


/* ----------------------------------------------------------------------------- *
 *  1                         Styles der small Phoneversion breit                *
 * ----------------------------------------------------------------------------- */

@media only screen and (min-width: 30.0em) {

    @media only screen and (max-width: 78em) {
        body {
            font-size:     0.9em;
        }
    }

  /* 1-- Container ------------------------------------------------------------*/

    .main {
        overflow:       hidden;
    }

    .mainContent {
        width:         70%;
        float:         left;
        padding:       0.8em 20px;
        border-top:     none;
    }

    aside {
        width:         30%;
        margin-left:     70%;
        margin-bottom:     -99999px !important;
        padding-bottom:   99999px !important;
    }

    aside, footer {
        padding:       0.8em 20px;
    }

    section {
        padding:       0;
    }

    /* 1-- Text--------------------------------------------------------------------- */

    h2 {
        font-size:       1.8em;
        line-height:     1.2em;
        margin:       0.3em 0 0;
    }

    /* 1-- Navigation--------------------------------------------------------------- */

    nav {
        overflow:       hidden;
        font-size:       1.1em;
    }

    nav ul {
        margin:       0 20px;
    }

    nav ul li {
        float:         left;
        border:       none;
        width:         auto;
    }

    nav ul > li > a {
        padding:       0.4em 10px 0.4em 10px;
        display:       inline-block;
    }
}

/* ----------------------------------------------------------------------------- *
 *  2                        Styles für kleine Desktops (menue oben              *
 * ----------------------------------------------------------------------------- */

@media only screen and (min-width: 64em) {

  /*-- 2-------- Container ----------------------------------------------------*/
    .page-wrapper {
        margin:       0 auto;
    }

  .headerlogo {
    height:        7em;
  }

    /* 2-- Text--------------------------------------------------------------------- */

  h1 {
    width:         80%;
       margin:       1.0em 0 1.0em 4.5em;
    font-size:       2.0em;
  }

    /* 2-- Navigation--------------------------------------------------------------- */
    nav {
        font-size:       1.2em;
    }

    nav ul > li > a {
        padding:       0.7em 10px 0.7em 10px;
    }

  #karte {
    width:        30em;
    height:        30em;
  }


/* ----------------------------------------------------------------------------- *
 *  3                        Styles für kleine Desktops (menue links             *
 * ----------------------------------------------------------------------------- */


@media only screen and (min-width: 64em) {

  /*-- 3-------- Container ----------------------------------------------------*/

    .main {
        width:         80%;
        float:         left;
    }

    /* Größenanpassungen */
    .mainContent {
        width:         65%;
        padding:       0.8em 20px;
    }

    aside {
        width:         35%;
        margin-left:     65%;
    }

    footer {
        clear:         left;
    }

  .headerlogo {
    height:        10em;
  }

    /* 3-- Text--------------------------------------------------------------------- */
  h1 {
       margin:       1.0em 0 1.3em 5.5em;
    font-size:       2.5em;
  }

    /* 3-- Navigation--------------------------------------------------------------- */
    nav {
        width:         20%;
        float:         left;
        box-shadow:     none;
    }

    nav ul {
        margin:       1.6em 0 0;
    }

    nav ul > li {
        width:         100%;
    border-top:      1px solid #101010;
    background-color:  rgb(212,212,200);
        float:         none;
    }

    nav ul > li > a {
        padding:       0.8em 25px;
        display:       block;
    }

}


/* ----------------------------------------------------------------------------- *
 *   4                      Styles für große Desktops   fixierte Breite          *
 * ----------------------------------------------------------------------------- */

@media only screen and (min-width: 78em) {
    .page-wrapper {
        margin:       0 auto;
        max-width:       78em;
    }
#karte {
  width:          40em; /*400px; */
  height:          40em;
  margin-right:      20px;
  margin-bottom:      20px;
  float:          right;
}
}