@charset "UTF-8";

/* ----------------------------------------------------------------------------- *
 *          Responsive Webdesign - Praxisbeispiele - 3. Auflage 2017             *
 *           In atmosphere.css sind Farben und Schriften definiert,              *
 *                  die für alle Beispiele verwendet werden.                     *
 *       In der layout.css stehen ergänzende Styles für alle Layoutstufen.       *
 *          Autoren: Andrea Ertel und Kai Laborenz (Rheinwerk Verlag)            *
 * ----------------------------------------------------------------------------- */


/* ----------------------------------------------------------------------------- *
 *          Basisschriftgröße auf 10px setzen --> 62,5% von 16px                 *
 *    erleichtert uns die Umrechnung der weiteren Schriftgrößen in rem / em      *
 *        Beispiel: 1.0rem entspricht 10px und 1.6rem entspricht 16px            *
 * ----------------------------------------------------------------------------- */




/*
Dunkelblau #003972
Hellblau   #0082b9
Dunkelgrau #3c3c3b
Hellgrau   #6f6f6e
gruen      7ab51d
*/


html {
   font-size: 62.5%;
}

body {
   font-size: 1.6px; /* Fallback für alte Browser, die rem nicht kennen */
   font-size: 1.6rem; /* 16px */
   line-height: 1.5; /* 24px */
   font-family: Arial, Verdana, sans-serif;
   font-weight: 300;
   color: #000000; /* dunkelgrau */
  /* background-color: #0082b9;*/ /* hellblau */
  /* farbverlauf im hintergrund von oben dunkelblau nach unten hellblau */
  /*background-image: linear-gradient(to bottom, #003972 0%, #0082b9 100%);*/
  /*  background-image: -webkit-linear-gradient(to bottom, #003972 0%, #0082b9 100%);*/
  /*  background-image: -moz-linear-gradient(to bottom, #003972 0%, #0082b9 100%);*/
  /*  background-repeat:no-repeat;*/
  /*  background-attachment: fixed;*/
}

/* Powermail */
.tx-powermail .powermail_create {
  color: #395417;
  font-weight:normal;
  }

.page-wrapper {
   background-color: #ffffff; /* hellgrau */
}

.header {
   background-color: #ffffff; /* weiss */
}

.logo a, 
.logo a:hover, 
.logo a:focus,
.logo a:visited,
.logo a:link,
.logo a:active {
  color: #5BC72B;
  text-decoration:none;
  font-weight:300;
  font-size:0.7em;
  text-align:left;
  
  }

.main-wrapper {
   background-color: #fff; /* weiss */
   padding: 2em 2rem;
}

.footer {
   background-color: #0082b9; /* hellgrau */
   color: #fff; /* weiss */
 
}

h1,h2,h3,h4,h5 {
  color:#395417;
  font-family:"Roboto Slab",Georgia,serif;
  margin:0
}

h1, h2, h3, h4 {
   /*font-family: Verdana, Arial, sans-serif;*/
   font-weight: 500;
   line-height: 130%;
   /*color: #7ab51d;*/ /* dunkelblau */
}

h1, header h2 {
   font-size: 3.6rem; /* 26px */
}

h2 {
   font-size: 3.0rem; /* 22px */
  line-height:2.3em;
}

h3 {
   font-size: 2.8rem; /* 20px */
  line-height:2.0em;
}

h4 {
   font-size: 2.6rem; /* 20px */
  line-height:1.8em;
}



td {
  border:solid 1px #003972;
  }

p.teasertext {
   font-size: 1.7rem; /* 17px */
   line-height: 150%;
}

a:link, a:visited {
   color: #7ab51d; /* dunkelblau */
   font-weight: 600;
}

a:hover, a:focus, a:active {
   color: #fff; /* weiss */
   background-color: transparent; /* dunkelblau */
}

.main-content a:link, .main-content a:visited {
  color: #7ab51d;
  font-weight: 600;
}

.main-content a:hover, .main-content a:focus, .main-content a:active {
  color: #7ab51d;
  background-color:#fff;
}



.main-nav {
   background-color: #ededed; /* dunkelblau */
}



.main-nav li {
   list-style: none;
  /*min-width: 20%; */    /* !!!!! ausgehend von fuenf menuepunkten, also nicht variabel !!! 20171204 */
}

.main-nav a, .main-nav b {
   font-weight: 300;
}

.main-nav a:link, .main-nav a:visited {
   color: #000; /* weiss */
  
}

.main-nav a:hover, .main-nav a:focus, .main-nav a:active {
   background-color: #7ab51d; /* hellblau */
   color: #000; /* weiss */
}

.main-nav__item-act {
   color: #fff; /* hellblau */
   background-color: #ededed; /* weiss */
}


.main-nav .menue_bild img {
  visible:hidden;
  }

.sec-level {
  background-color: #ededed;
  }

.sec-level ul li {
  width: 100%;
  }


.service-nav {
   background-color: transparent; /* hellgrau */
}

.service-nav li {
   list-style: none;
}

.service-nav a, .service-nav b {
   font-weight: 300;
}

.service-nav a:link, .service-nav a:visited {
   color: #6f6f6e; /* weiss */
}

.service-nav a:hover, .service-nav a:focus, .service-nav a:active {
   background-color: transparent; /* hellgrau */
   color: #6f6f6e; /* weiss */
}

.service-nav__item-act {
   background-color: transparent; /* hellgrau */
   color: #fff; /* weiss */
}

.blindtext,
.blindtext * {
  color: #c5c5c5 !important; /* mittelgrau */
}

.powermail_create {
  font-weight: 600;
  font-size:1.6em;
  color:#0082b9;
  }