@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;
	font-family: 'Roboto', sans-serif;
	font-weight: 300;
	color: #444;
	background-color: #00a099;
}

.page-wrapper {
/*  Raster als Hintergrundeinblenden:
	background-image: url('../img/16_col-1.png');
	background-size: 100%;
	background-repeat: repeat-y;
*/	
	
	/* Hintergrund-Farbe auskommentieren, wenn Raster angezeigt werden soll! */
	background-color: #189ca4;
}

.main-wrapper {
	/* Hintergrund-Farbe auskommentieren, wenn Raster angezeigt werden soll! */
	background-color: #fff;
	
	overflow: auto;
	padding: 0;
}

.main-content {
	border-right: 1px dashed #ddd;
}

.header {
	background-color: #189ca4;
	text-align: left;
	max-height: 15em;
}

.headerLogo {
	max-height: 10em;
}

.footer {
	background-color: #000;
	color: #fff;
	padding: 0.6em 2rem;
	text-align: right;
}

.aside {
	padding-top: 1em;
	margin-top: 1em;
}

.section {
	margin: 1em 0;
}

h1,
h2,
h3 {
	font-family: 'Raleway', sans-serif;
	font-weight: 500;
	line-height: 130%;
	color: #189ca4;
}

h1 {
	font-size: 2.8rem;
	margin: 0;
}

h2 {
	font-size: 2.2rem;
	margin: 0.5em 0;
}

aside h2 {
   margin: 0;
}

h3 {
	font-size: 2.0rem;
	margin: 0.6em 0;
}

p {
	margin: 0.5em 0;
}

p.teasertext {
	font-size: 1.7rem;
	line-height: 150%;
	margin: 0.8em 0;
}


ul,
ol {
	padding: 0;
	margin: 0 0 0.625em 2rem;
}

a:link,
a:visited {
	color: #189ca4;
	font-weight: 600;
}

a:hover,
a:focus,
a:active {
	color: #fff;
	background-color: #189ca4;
}

.logo {
	font-family: 'Raleway', sans-serif;
	font-size: 2.8rem;
	font-weight: 500;
	line-height: 1;
	text-transform: uppercase;
	letter-spacing: 0.3em;
	color: #fff;
	text-align: left;
	display: inline-block;
	padding: 0;
}

.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: #da0545;
}


/* ----------------------------------------------------------------------------- *
 *                           Styles für Navigation                               *
 * ----------------------------------------------------------------------------- */

.main-nav {
	background-color: #189ca4;
	padding: 0;
	margin: 0;
}

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

.main-nav > li {
	width: 100%;
	float: none;
	margin-left: 0;
	border-bottom: 1px solid rgba(250, 250, 250, 0.6);
}

.main-nav > li > a,
.main-nav > li > b {
	font-size: 1.8rem;
	padding: 0.5em 24px;
	display: block;
}

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

.main-nav a:link,
.main-nav a:visited {
	color: #fff;
	text-decoration: none;
}

.main-nav a:hover,
.main-nav a:focus,
.main-nav a:active {
	background-color: #96cfbf;
	color: #fff;
}

.main-nav__item-act {
	color: #189ca4;
	background-color: #fff;
}

.main-nav__item-act b {
	font-weight: 600;
}

form {
  font-family: arial;
  background-color: #ddd;
  padding: 25px;
  font-size: 20px;
  width: 515px;
  border-radius: 10px;
  margin:auto;
}

fieldset {
 margin-bottom: 30px;
 }
 
 label {
    
 }
 
 select {
    border-radius: 5px;
    width: 300px;
    position: relative;
 }
 
 legend {
    font-size: small;
    margin-bottom: 20px;
 }
 
 input[type=checkbox] {
    margin: 10px;
 }
 
 button[type=submit] {
    width: 50%;
    border-radius: 5px;
    border: solid 1px grey;
    font-size: medium;
  	margin: 0;
	  position: absolute;
	  top: 50%;
	  left: 50%;
	  -ms-transform: translate(-50%, -50%);
	  transform: translate(-50%, -50%);
	  background-color: #00a099; 
 }
 
 input[type=text], input[type=email], input[type=tel] {
    width: 100%;
    font-size: inherit;
 }
 
 textarea {
 	width: 100%;
 	}
 
#ausstattung {
    display: block;
    font-size: 15px;
}
 
.form-control {
	margin-right : 2px;
}

.submit {
	position: relative;
	height: 5em;
}