@charset "UTF-8";

/* ----------------------------------------------------------------------------- *
 *          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            *
 * ----------------------------------------------------------------------------- */

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: 'Roboto', sans-serif; /* Google Webfont */
   font-weight: 300;
   color: #000000; /* dunkelgrau #444*/
   background-color: #f1f7e2; /* hellgrau  #efefef  */
	 word-wrap: break-word;
	 hyphens: auto;
	}

.page-wrapper {
   background-color: #4fa9b8; /* blau-gruen #189ca4*/
	 }

.header {
   background-color: #4fa9b8; /* rot #189ca4 */
	 }

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

.footer {
	 color: #fff; /* weiss */
	 height:8.0rem;
	 background: #002060; /* schwarz #74C0CF */
   background:transparent url(../clips/footerhaus.gif) bottom left repeat-x;	
	 
}

h1, h2, h3 {
   font-family: 'Raleway', sans-serif; /* Google Webfont */
   font-weight: 500;
   line-height: 130%;
   color: #4E7178; /* rot #da0545*/
}

h1 {
   font-size: 2.6rem; /* 26px */
}

h2 {
   font-size: 2.2rem; /* 22px */
}

h3 {
   font-size: 2.0rem; /* 20px */
}

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

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

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



.rahmen {
border-Style: inset;
margin: 0.5rem;
border-width: 0.5rem;
border-color:#189ca4; 
padding: 0.5rem; }



a:link, a:visited {
   color: #4fa9b8; /* blau-gruen */
   font-weight: 600;
}

a:hover, a:focus, a:active {
   color: #fff; /* weiss */
   background-color: #4fa9b8; /* blau-gruen #189ca4*/
}

.logo {
   font-family: 'Raleway', sans-serif; /* Google Webfont */
   font-size: 2.1rem;
   font-weight: 500;
   line-height: 1;
   text-transform: uppercase;
   letter-spacing: 0.3em;
   color: #fff; /* weiss */
}

.logo a:link, .logo a:visited {
   color: #fff; /* weiss */
   font-weight: 500;
   text-decoration: none;
   display: block;
}

.logo a:hover, .logo a:focus, .logo a:active {
   background-color: #f1f7e2; /* orange */
}

.main-nav {
   background-color: #4fa9b8; /* blau-gruen #189ca4*/
}

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

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

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

.main-nav a:hover, .main-nav a:focus, .main-nav a:active {
   background-color: #96cfbf; /* mint-gruen */
   color: #f1f7e2; /* weiss */
}

.main-nav__item-act {
   color: #189ca4; /* blau-gruen */
   background-color: #f1f7e2; /* weiss */
}

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