@charset "UTF-8";

@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 400;
	src: local(''),
	url('../fonts/open-sans-v34-latin-regular.woff2') format('woff2'),
	url('../fonts/open-sans-v34-latin-regular.woff') format('woff');
	font-display: swap;
}
@font-face {
	font-family: 'Open Sans';
	font-style: normal;
	font-weight: 700;
	src: local(''),
	url('../fonts/open-sans-v34-latin-700.woff2') format('woff2'),
	url('../fonts/open-sans-v34-latin-700.woff') format('woff');
	font-display: swap;
}
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 400;
	src: local(''),
	url('../fonts/open-sans-v34-latin-italic.woff2') format('woff2'),
	url('../fonts/open-sans-v34-latin-italic.woff') format('woff');
	font-display: swap;
}
@font-face {
	font-family: 'Open Sans';
	font-style: italic;
	font-weight: 700;
	src: local(''),
	url('../fonts/open-sans-v34-latin-700italic.woff2') format('woff2'),
	url('../fonts/open-sans-v34-latin-700italic.woff') format('woff');
	font-display: swap;
}
@font-face {
	font-family: 'Coda Caption';
	font-style: normal;
	font-weight: 800;
	src: local(''),
	url('../fonts/coda-caption-v19-latin-800.woff2') format('woff2'),
	url('../fonts/coda-caption-v19-latin-800.woff') format('woff');
	font-display: swap;
}

/* Smartphones (portrait and landscape) ----------- */
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px) {
/* Styles */
article, header {background:#fff;width:480; max-width:100%;}
body {
	font: 150%/1.4 'Open Sans', Helvetica, Arial, sans-serif;
	padding: 0;
	margin:0;
	overflow:hidden;
	color: #000;
	background: url(../images/start.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
nav {width: 90%;
	height: auto;
	padding: 3%;
	font-size: 100%;
	overflow:hidden;
}
.navbar {
	background: rgba(255,255,255,0.8);
	margin-bottom: -5%;
}
.navbar2 {
	background: rgba(255,255,255,0.8);
	padding: 3% 1%;
	margin-bottom: 3%;
}
.navStart {font-family: 'Coda Caption', sans-serif, Helvetica, Arial, sans-serif;bottom:15px;right:6px;text-transform:uppercase;height:auto;}
.navStart ol > li {background: url(../images/bkg-main-nav.png) no-repeat bottom right;margin-bottom:2%;height:auto;}
.navStart ol > li > a {color:#9ea9be;display:block;font-size:120%;text-decoration:none;text-indent:24px;height:auto;}
.navStart ol > li > a.current {font-size:130%;}
.navStart ul {display:none;}
	
header {max-height:auto; position:relative;}
footer{ color:#FFFFFF; font-size:85%; padding:2% 0;	background: #1a2b3b;}
.rights {text-align:left; color:#fff; font-size:75%; padding: 2% 0%;}
section { height:100%;}
address {float:left; padding: 2% 0 0 4%; margin-right:3%; font-style:normal;}
address a:link {color:#9ea9be;}
address a:hover {color:#fff;}
}

/* Smartphones (landscape) ----------- */
@media only screen
and (min-width : 321px) {
/* Styles */
body {
	font: 100%/1.4 'Open Sans', Helvetica, Arial, sans-serif;
	padding: 0;
	margin:0;
	overflow:hidden;
	color: #000;
	background: url(../images/start.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
nav {width: 90%;
	height: auto;
	padding: 3%;
	font-size: 100%;
	overflow:hidden;
}
.navbar {
	background: rgba(255,255,255,0.8);
	margin-bottom: -5%;
}
.navbar2 {
	background: rgba(255,255,255,0.8);
	padding: 3% 1%;
	margin-bottom: 3%;
}
.navStart {font-family: 'Coda Caption', sans-serif, Helvetica, Arial, sans-serif;bottom:15px;right:6px;text-transform:uppercase;height:auto;}
.navStart ol > li {background: url(../images/bkg-main-nav.png) no-repeat bottom right;margin-bottom:2%;height:auto;}
.navStart ol > li > a {color:#9ea9be;display:block;font-size:120%;text-decoration:none;text-indent:24px;height:auto;}
.navStart ol > li > a.current {font-size:130%;}
.navStart ul {display:none;}
	
header {max-height:auto; position:relative;}
footer{ color:#FFFFFF; font-size:65%; padding:2% 0;	background: #1a2b3b;}
.rights {text-align:left; color:#fff; font-size:65%; padding: 2% 0%;}
section { height:100%;}
address {float:left; padding: 2% 0 0 4%; margin-right:3%; font-style:normal;}
address a:link {color:#9ea9be;}
address a:hover {color:#fff;}
}

/* Smartphones (portrait) ----------- */
@media only screen
and (max-width : 320px) {
/* Styles */
body {
	font: 100%/1.4 'Open Sans', Helvetica, Arial, sans-serif;
	padding: 0;
	margin:0;
	overflow:hidden;
	color: #000;
}
nav {width: 90%;
	height: auto;
	padding: 3%;
	font-size: 100%;
	overflow:hidden;
}
.navbar {
	background: rgba(255,255,255,0.8);
	margin-bottom: -5%;
}
.navbar2 {
	background: rgba(255,255,255,0.8);
	padding: 3% 1%;
	margin-bottom: 3%;
}
.navStart {font-family: 'Coda Caption', sans-serif, Helvetica, Arial, sans-serif;bottom:15px;right:6px;text-transform:uppercase;height:auto;}
.navStart ol > li {background: url(../images/bkg-main-nav.png) no-repeat bottom right;margin-bottom:2%;height:auto;}
.navStart ol > li > a {color:#9ea9be;display:block;font-size:120%;text-decoration:none;text-indent:24px;height:auto;}
.navStart ol > li > a.current {font-size:130%;}
.navStart ul {display:none;}
	
header {max-height:auto; position:relative;}
footer{ color:#FFFFFF; font-size:85%; padding:2% 0;	background: #1a2b3b;}
.rights {text-align:left; color:#fff; font-size:75%; padding: 2% 0%;}
section { height:100%;}
address {float:left; padding: 2% 0 0 4%; margin-right:3%; font-style:normal;}
address a:link {color:#9ea9be;}
address a:hover {color:#fff;}
}


/* iPads (landscape) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape) {
/* Styles */
article, header {background:#fff;width:1024; max-width:100%;}
body {
	font: 90%/1.4 'Open Sans', Helvetica, Arial, sans-serif;
	padding: 0;
	margin:0;
	overflow:hidden;
	color: #000;
	background: url(../images/start.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}
nav {position:fixed;
	right:5%;
	top:1%;
	width: 40%;
	height: auto;
	padding: 2%;
	font-size: 100%;
	overflow:hidden;
}
.navbar {
	background: rgba(255,255,255,0.8);
	margin-bottom: -5%;
}
.navbar2 {
	background: rgba(255,255,255,0.8);
	padding: 3% 1%;
	margin-bottom: 3%;
}
.navStart {font-family: 'Coda Caption', sans-serif, Helvetica, Arial, sans-serif;bottom:15px;right:6px;text-transform:uppercase;height:auto;}
.navStart ol > li {background: url(../images/bkg-main-nav.png) no-repeat bottom right;margin-bottom:2%;height:auto;}
.navStart ol > li > a {color:#9ea9be;display:block;font-size:120%;text-decoration:none;text-indent:24px;height:auto;}
.navStart ol > li > a.current {font-size:130%;}
.navStart ul {display:none;}
	
header {max-height:auto; position:relative;}
footer{ color:#FFFFFF; font-size:65%; padding:2% 0;	background: #1a2b3b;}
.rights {text-align:left; color:#fff; font-size:55%; padding: 2% 0%;}
section { height:100%;}
address {float:left; padding: 2% 0 0 4%; margin-right:3%; font-style:normal;}
address a:link {color:#9ea9be;}
address a:hover {color:#fff;}
}

/* iPads (portrait) ----------- */
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait) {
/* Styles */
article, header {background:#fff;width:768; max-width:100%;}
body {
	font: 90%/1.4 'Open Sans', Helvetica, Arial, sans-serif;
	padding: 0;
	margin:0;
	overflow:hidden;
	color: #000;
	background: url(../images/start.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;}
nav {position:fixed;
	right:5%;
	top:1%;
	width: 40%;
	height: auto;
	padding: 2%;
	font-size: 100%;
	overflow:hidden;
}
.navbar {
	background: rgba(255,255,255,0.8);
	margin-bottom: -5%;
}
.navbar2 {
	background: rgba(255,255,255,0.8);
	padding: 3% 1%;
	margin-bottom: 3%;
}
.navStart {font-family: 'Coda Caption', sans-serif, Helvetica, Arial, sans-serif;bottom:15px;right:6px;text-transform:uppercase;height:auto;}
.navStart ol > li {background: url(../images/bkg-main-nav.png) no-repeat bottom right;margin-bottom:2%;height:auto;}
.navStart ol > li > a {color:#9ea9be;display:block;font-size:120%;text-decoration:none;text-indent:24px;height:auto;}
.navStart ol > li > a.current {font-size:130%;}
.navStart ul {display:none;}
	
header {max-height:auto; position:relative;}
footer{ color:#FFFFFF; font-size:85%; padding:2% 0;	background: #1a2b3b;}
.rights {text-align:left; color:#fff; font-size:75%; padding: 2% 0%;}
section { height:100%;}
address {float:left; padding: 2% 0 0 4%; margin-right:3%; font-style:normal;}
address a:link {color:#9ea9be;}
address a:hover {color:#fff;}
}

/* Desktops and laptops ----------- */
@media only screen
and (min-width : 1024) {
/* Styles */
article, header {margin: 0 10%; background:#fff;width:1024px; max-width:90%;}
body {
	font: 90%/1.4 'Open Sans', Helvetica, Arial, sans-serif;
	padding: 0;
	margin:0;
	overflow:hidden;
	color: #000;
	background: url(../images/start.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;}
nav {position:fixed;
	right:10%;
	top:2%;
	width: 35%;
	max-width:470px;
	min-width:250;
	height: auto;
	padding: 3% 1%;
	font-size: 100%;
	overflow:hidden;
}
.navbar {
	background: rgba(255,255,255,0.8);
	margin-bottom: 3%;
}
.navbar2 {
	background: rgba(255,255,255,0.8);
	padding: 3% 1%;
	margin-bottom: 3%;
}
.navStart {font-family: 'Coda Caption', sans-serif, Helvetica, Arial, sans-serif;bottom:15px;right:6px;text-transform:uppercase;height:auto;}
.navStart ol > li {background: url(../images/bkg-main-nav.png) no-repeat bottom right;margin-bottom:2%;height:auto;}
.navStart ol > li > a {color:#9ea9be;display:block;font-size:120%;text-decoration:none;text-indent:24px;height:auto;}
.navStart ol > li > a.current {font-size:130%;}
.navStart ul {display:none;}
	
header {max-height:auto; position:relative;}
footer{ color:#FFFFFF; font-size:85%; padding:2% 0;	background: #1a2b3b;}
.rights {text-align:left; color:#fff; font-size:75%; padding: 2% 0%;}
section { height:100%;}
address {float:left; padding: 2% 0 0 4%; margin-right:3%; font-style:normal;}
address a:link {color:#9ea9be;}
address a:hover {color:#fff;}		
}

/* Large screens ----------- */
@media only screen
and (min-width : 1124px) {
/* Styles */
article, header {margin: 0 10%; background:#fff;width:1124px; max-width:90%;}
body {
	font: 90%/1.4 'Open Sans', Helvetica, Arial, sans-serif;
	padding: 0;
	margin:0;
	overflow:hidden;
	color: #000;
	background: url(../images/start.jpg) no-repeat center center fixed;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;}

nav {position:fixed;
	right:10%;
	top:2%;
	width: 35%;
	height: auto;
	padding: 3% 1%;
	font-size: 100%;
	overflow:hidden;
}
.navbar {
	background: rgba(255,255,255,0.8);
	margin-bottom: -5%;
}
.navbar2 {
	background: rgba(255,255,255,0.8);
	padding: 3% 1%;
	margin-bottom: 3%;
}
.navStart {font-family: 'Coda Caption', sans-serif, Helvetica, Arial, sans-serif;bottom:15px;right:6px;text-transform:uppercase;height:auto;}
.navStart ol > li {background: url(../images/bkg-main-nav.png) no-repeat bottom right;margin-bottom:2%;height:auto;}
.navStart ol > li > a {color:#9ea9be;display:block;font-size:120%;text-decoration:none;text-indent:24px;height:auto;}
.navStart ol > li > a.current {font-size:130%;}
.navStart ul {display:none;}
	
header {max-height:auto; position:relative;}
footer{ color:#FFFFFF; font-size:95%; padding:2% 0;	background: #1a2b3b;}
.rights {text-align:left; color:#fff; font-size:75%; padding: 2% 0%;}
section { height:100%;}
address {float:left; padding: 2% 0 0 4%; margin-right:3%; font-size:80%;}
address a:link {color:#9ea9be;}
address a:hover {color:#fff;}
}

/* iPhone 4 ----------- */
@media
only screen and (-webkit-min-device-pixel-ratio : 1.5),
only screen and (min-device-pixel-ratio : 1.5) {
/* Styles */
}

html, body {
height:auto !important ;
}
html {font-size: 100%;
  -webkit-text-size-adjust: 100%;
  -ms-text-size-adjust: 100%;}
img {
  /* Responsive images (ensure images don't scale beyond their parents) */

  max-width: 100%;
  /* Part 1: Set a maxium relative to the parent */

  width: auto\9;
  /* IE7-8 need help adjusting responsive images */

  height: auto;
  /* Part 2: Scale the height according to the width, otherwise you get stretching */

  vertical-align: middle;
  border: 0;
  -ms-interpolation-mode: bicubic;}

article,
aside,
details,
figcaption,
figure,
footer,
header,
hgroup,
nav,
section, footer {
  display: block;
}
audio,
canvas,
video {
  display: inline-block;
  *display: inline;
  *zoom: 1;
}
audio:not([controls]) {
  display: none;
}

/* ~~ Element-/Tag-Selektoren ~~ */
ul, ol, dl { /* Aufgrund von Abweichungen zwischen verschiedenen Browsern empfiehlt es sich, die Auffüllung und den Rand in Listen auf 0 einzustellen. Zu Konsistenzzwecken können Sie die gewünschten Werte entweder hier oder in den enthaltenen Listenelementen (LI, DT, DD) eingeben. Beachten Sie, dass die hier eingegebenen Werte hierarchisch auf die .nav-Liste angewendet werden, sofern Sie keinen spezifischeren Selektor festlegen. */
	padding: 0;
	margin: 0;
	list-style:none;}
h1, h2, h3, h4, h5, h6, p {
	margin: 0;	 /* Durch Verschieben des oberen Rands wird das Problem behoben, dass Ränder aus dem zugehörigen div-Tag geraten können. Der übrig gebliebene untere Rand hält ihn getrennt von allen folgenden Elementen. */
	padding-top: 2%; 
	padding-right: 4%;
	padding-left: 4%;
	font-family: 'Coda Caption', sans-serif;
	/* Durch Hinzufügen der Auffüllung zu den Seiten der Elemente innerhalb der div-Tags anstelle der div-Tags selbst entfallen jegliche Box-Modell-Berechnungen. Alternativ kann auch ein verschachteltes div-Tag mit seitlicher Auffüllung verwendet werden. */
}
h1 {font-size:130%;}
h2 {font-size: 120%; color:#9b9a9a;}
h3 {font-size: 100%; color:#9b9a9a;}

p {padding-bottom: 4%; padding-top: 2%; }
a img { /* Dieser Selektor entfernt den standardmäßigen blauen Rahmen, der in einigen Browsern um ein Bild angezeigt wird, wenn es von einem Hyperlink umschlossen ist. */
	border: none;}

/* ~~ Die Reihenfolge der Stildefinitionen für die Hyperlinks der Site, einschließlich der Gruppe der Selektoren zum Erzeugen des Hover-Effekts, muss erhalten bleiben. ~~ */
a:link {
	color:#003261;
	text-decoration: none; /* Sofern Ihre Hyperlinks nicht besonders hervorgehoben werden sollen, empfiehlt es sich, zur schnellen visuellen Erkennung Unterstreichungen zu verwenden. */
}

a:hover, a:visited{ /* Durch diese Gruppe von Selektoren wird bei Verwendung der Tastatur der gleiche Hover-Effekt wie beim Verwenden der Maus erzielt. */
	text-decoration: none;}


.titelbild{height:auto; width:100%; margin:0;}


/* ~~ Verschiedene float/clear-Klassen ~~ */
.fltrt {  /* Mit dieser Klasse können Sie ein Element auf der Seite nach rechts fließen lassen. Das fließende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
	float: right;
	margin-left: 8px;
}
.fltlft { /* Mit dieser Klasse können Sie ein Element auf der Seite nach links fließen lassen. Das fließende Element muss vor dem Element stehen, neben dem es auf der Seite erscheinen soll. */
	float: left;
	margin-right: 8px;
}
.clearfloat { /* Diese Klasse kann in einem <br />-Tag oder leeren div-Tag als letztes Element nach dem letzten fließenden div-Tag (im #container) platziert werden, wenn #footer entfernt oder aus dem #container herausgenommen wird. */
	clear:both;
	height:0;
	font-size: 1px;
	line-height: 0px;}
.break-word {word-wrap: break-word;}
.innerfooter {width:1000px; max-width:90%;}
#logo {position:absolute; right:0; margin:1%;}
.logoimg {border:0;}