@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            *
 * ----------------------------------------------------------------------------- */

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: #444; dunkelgrau */
   background-color: /*rgb(255, 245, 229)*/rgb(203, 206, 217);
}

.page-wrapper {
   background-color: rgb(217, 133, 130);/*rgb(240, 187, 65) orange */
}


/* Header + Logo OG */

.header {
    background-color: rgb(51, 67, 127);/*rgb(45, 45, 47) rgb(51, 67, 127) oder rgb(70, 116, 152)*/
	text-align: left;
	}

.logo {
	font-family: overlock, verdana, sans-serif;
	font-size: 2em;
	font-weight: 500;
	line-height: 0.8;
	letter-spacing: 0.1em /*0.3em*/;
	color: #fff;
	text-align: left;
	display: inline-block;
/*	padding: 2em 0 0 3em;*/
	margin: 0.4em 0 0 1.3em;
}

.logo a:link,
.logo a:visited {
	color: #fff;
	font-weight: 500;
	text-decoration: none;
	display: block;
	padding: 0.1em 0;
}

.logo a:hover,
.logo a:focus,
.logo a:active {
	background-color: #fff;
	color: rgb(45, 45, 47);
}

.headertextsmall {
  font-size: 1.2em;
  font-family: overlock, verdana,georgia,serif;
  color: rgb(255, 255, 255);
}

/*OG*/
.table-01 a:link,
.table-01 a:visited {
	color: rgb(51, 67, 127);
	font-weight: 700;
	text-decoration: none;
}

/* header end, OG */


.main-wrapper {
   background-color: #fff; /* weiss */
   padding: 2em 2rem;
}

.footer {
   background-color: rgb(51, 67, 127) /*rgb(45, 45, 47)*/;
   color: rgb(255, 255, 255); /* weiss */
}

/*OG Footer-Links*/

.footer a:link, .logo a:visited {
   color: rgb(255, 255, 255); /* weiss */
   font-weight: 500;
   text-decoration: none;
}

.footer a:hover, .logo a:focus, .logo a:active {
   background-color: #f8b255; /* orange */
   color: rgb(45, 45, 47);
}

/* OG */
.aside {
   background-color: rgb(221, 223, 255) /*fliederfarben*/;
}


.aside a:link, .logo a:visited {
   color: rgb(51, 67, 127); /* weiss */
   font-weight: 600;
   text-decoration: none;
}

.aside a:hover, .logo a:focus, .logo a:active {
   background-color: rgb(217, 203, 203); /* hellrot */
   color: rgb(45, 45, 47);
   letter-spacing: 0.1em;
}


h1, h2, h3 {
   font-family: 'Raleway', sans-serif; /* Google Webfont */
   font-weight: 500;
   line-height: 130%;
   color: #da0545; /* rot */
}

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%;
}

/*
a:link, a:visited {
   color: #189ca4;
   font-weight: 600;
}

a:hover, a:focus, a:active {
   color: #fff;
   background-color: #189ca4;
}*/

.main-nav {
   background-color: rgb(217, 133, 130);/*rgb(240, 187, 65) orange */
 }

.main-nav li {
   list-style: none;
   }

.main-nav a, .main-nav b {
   font-weight: 600;
   color: rgb(45, 45, 47);
   }

.main-nav a:link, .main-nav a:visited {
   color: rgb(45, 45, 47);
   font-weight: 600;
}

.main-nav a:hover, .main-nav a:focus, .main-nav a:active {
   background-color: rgb(217, 203, 203)/*rgb(255, 232, 179)*/;
   color: rgb(45, 45, 47);
   /* OG */
   letter-spacing: 0.1em;
   border-bottom: none;
   /*End OG*/
}

.main-nav__item-act {
   color: rgb(45, 45, 47);
   background-color: rgb(217, 203, 203)/*rgb(255, 232, 179)*/;
      font-weight: 700;
      

/* Formatierung der span in den Namenseintraegen */
.hinweis {
font-weight: 800;
color: red;
background: yellow;
}

.hinweis1 {
font-weight: 800;
color: blue;
background: white;
}

.hinweis2 {
font-weight: 800;
color: orange;
background	: teal;
}

.hinweis4 {
font-weight: 800;
color: teal;
background: orange;
}

.hinweis5 {
font-weight: 800;
color: white;
background: red;
}
   /*OG*/
}

/*.blindtext,
.blindtext * {
	color: #c5c5c5 !important; /* mittelgrau */
}*/