/**
* 1. Reset
* 2. Fonts
* 3. Layout
* 4. Allgemeine Elemente
* 5. Spezielle Elemente
* 6. Menues
* 7. Media queries
**/

/* ------- 1. Reset ------- */
/* http://meyerweb.com/eric/tools/css/reset/ v2.0 | 20110126 License: none (public domain) */
html, body, div, span, applet, object, iframe, h1, h2, h3, h4, h5, h6, p, blockquote, pre, a, abbr, acronym, address, big, cite, code, del, dfn, em, img, ins, kbd, q, s, samp, small, strike, strong, sub, sup, tt, var, b, u, i, center, dl, dt, dd, ol, ul, li, fieldset, form, label, legend, table, caption, tbody, tfoot, thead, tr, th, td, article, aside, canvas, details, embed, figure, figcaption, footer, header, hgroup, menu, nav, output, ruby, section, summary, time, mark, audio, video { margin: 0; padding: 0; border: 0; font-size: 100%; vertical-align: baseline; }
article, aside, details, figcaption, figure, footer, header, hgroup, menu, nav, section { display: block; }
body { line-height: 1.22; }
ol, ul { list-style: none; }
blockquote, q { quotes: none; }
blockquote:before, blockquote:after, q:before, q:after { content: ''; content: none; }
table { border-collapse: collapse; border-spacing: 0; }
p { font-weight:normal;}
 
/* Clearfix */
.clear{clear:both;display:block;overflow:hidden;visibility:hidden;width:0;height:0;}
.clearfix:after{clear:both; content:' '; display:block; font-size:0; line-height:0; visibility:hidden; width:0; height:0; }

.clearleft { clear:left; }
.clearright { clear:right; }
.clearboth { clear:both;}

/* ------- 2. Fonts ------- */

/*--------------------------------------------------------------
# Typography
--------------------------------------------------------------*/

/* open-sans-300 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: url('fonts/open-sans/open-sans-300.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Light'), local('OpenSans-Light'),
       url('fonts/open-sans/open-sans-300.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans/open-sans-300.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans/open-sans-300.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans/open-sans-300.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans/open-sans-300.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-300italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: url('fonts/open-sans/open-sans-300italic.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Light Italic'), local('OpenSans-LightItalic'),
       url('fonts/open-sans/open-sans-300italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans/open-sans-300italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans/open-sans-300italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans/open-sans-300italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans/open-sans-300italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-regular - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: url('fonts/open-sans/open-sans-regular.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Regular'), local('OpenSans-Regular'),
       url('fonts/open-sans/open-sans-regular.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans/open-sans-regular.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans/open-sans-regular.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans/open-sans-regular.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans/open-sans-regular.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: url('fonts/open-sans/open-sans-italic.eot'); /* IE9 Compat Modes */
  src: local('Open Sans Italic'), local('OpenSans-Italic'),
       url('fonts/open-sans/open-sans-italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans/open-sans-italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans/open-sans-italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans/open-sans-italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans/open-sans-italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600 - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: url('fonts/open-sans/open-sans-600.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold'), local('OpenSans-SemiBold'),
       url('fonts/open-sans/open-sans-600.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans/open-sans-600.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans/open-sans-600.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans/open-sans-600.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans/open-sans-600.svg#OpenSans') format('svg'); /* Legacy iOS */
}
/* open-sans-600italic - latin */
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: url('fonts/open-sans/open-sans-600italic.eot'); /* IE9 Compat Modes */
  src: local('Open Sans SemiBold Italic'), local('OpenSans-SemiBoldItalic'),
       url('fonts/open-sans/open-sans-600italic.eot?#iefix') format('embedded-opentype'), /* IE6-IE8 */
       url('fonts/open-sans/open-sans-600italic.woff2') format('woff2'), /* Super Modern Browsers */
       url('fonts/open-sans/open-sans-600italic.woff') format('woff'), /* Modern Browsers */
       url('fonts/open-sans/open-sans-600italic.ttf') format('truetype'), /* Safari, Android, iOS */
       url('fonts/open-sans/open-sans-600italic.svg#OpenSans') format('svg'); /* Legacy iOS */
}

body, html {font-family: 'Open Sans', Verdana, sans-serif; font-size: 16px; font-size: 1rem;
line-height: 1.22;}


/* ------- 3. Layout ------- */
/* WRAPPER - ALLGEMEIN */

#wrapper { width: 100%; clear: both; }

body { background: #dce6f2; color: #254061; }

#content {box-sizing:border-box; margin: 80px auto; width: 100%; max-width: 768px; padding: 0;}

strong {font-weight:600; font-style:italic;}

a { text-decoration:none; color: #254061; }
a:hover { text-decoration:underline;}
 
h1{ font-size: 32px;font-weight:normal; text-align:center; line-height: 1.5; color: #254061; margin-bottom:48px;}

p { font-size: 20px; font-size: 1.25rem; line-height: 1.5; margin-bottom:48px;}
p.abstand { line-height: 1.5;font-size: 20px; margin-bottom: 48px;}


/* media queries */

@media only screen and (max-width: 600px)  {
h1{ font-size: 24px;}
#content {margin: 10px auto; width: 100%; padding: 20px;}
}