@charset "utf-8";

/*
Farben:
Rot: #bd192a

Hellgrau: #a7aaad
Mittelgrau: #6e6f70
Dunkelgrau: #303032

Schwarz-Blau: #051d37
Dunkelblau: #0a3a6e
Mittelblau: #236cb9
Hellblau: #4aa1ff
Eisblau: #4ec0f2

*/
 
/* BASIS============================================= */
 
* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
}

html{
	-webkit-font-smoothing: antialiased;
}

body {
	font-family: Verdana, Geneva, sans-serif;
	font-size: 1.6em;
	color: #051d37;
	background-color: #FFFFFF;
}

.center{
	text-align: center;	
}

header, footer{
	flex: 1 100%;
	max-width: 100%;
}

.datenschutz{
	font-size: 0.8em;
	text-align: justify;
	padding: 25px;
}

/* MENU  = = = = = = = = = = */

#oben{ /*div-Element für die Navigation*/
	/*position: fixed;*/
	top: 0px;
	left: 0px;
	width: 100%;
	background-color: #ddd; 
	padding: 5px 0 2px 0;
}

#bild{
	position: relative;
	top:0px;
	left:0px;
	z-index:-1;
	
}


.weiss{
	background-color: #FFF;
}


#nav_menu ul {
	list-style: none;
	position: relative;    /* So the first submenu can be positioned within the main menu */
	margin: 0;
	padding: 0;
	display: flex;
	flex-direction: row;
	justify-content: space-between;
	background-color: white;
}

#nav_menu ul li {
	float: left;
	padding: 0 10px; 
	flex: 0 0 auto;
}

#nav_menu ul ul {
	display: none;         /* Don't display submenu until hover of the li element */
	position: absolute;
	top: 100%;             /* Position the submenu at the bottom of the main menu */
}

#nav_menu ul li a{
	color: #006699; /*Mittelblau*/
	text-decoration: none;
	font-size: 1.3em;
	font-weight: bold;
	font-family: Georgia, "Times New Roman", Times, serif;
}

#nav_menu ul ul li {
	float: none;           /* Display the submenus vertically */
	position: relative;    /* So the second submenu can be positioned within the first submenu */
}

#nav_menu ul ul li ul {
	position: absolute;
	left: -100%;           /* Position the second submenu at the left side of the li element */ 
	top: 0;                /* Position the second submenu at the top of the li element */
}
#nav_menu ul li:hover > ul {
	display: block;        /* Display the submenu on hover of the li element */
}
#nav_menu ul::after {
	content: "";
	clear: both;
	display: block;
}

/* The styles for the formatting of the multi-tier navigation menu */
#nav_menu ul {
	width: 100%;
	margin: 0;
	padding: 0;
}

#nav_menu ul li a {  /*Menüfarbe nicht fett */
	text-align: center;
	display: block;
	padding: 0.5em;
	text-decoration: none;
	color: #bd192a; /*Rot*/
}

#nav_menu ul li a.current {
	color: orange;
}
#nav_menu ul li a:hover, #nav_menu ul li a:focus {
	text-decoration: none;
	color: #fff; 
	background-color: #6e6f70; /* Mittelgrau */
	border-radius: 25px; 
}
#nav_menu ul li:hover ul {
	width: 100%;
}
#nav_menu ul li:hover ul li a {
	display: block;
	width: 150px;
	text-align: center;
}

/* SLICNAV MENU */
.slicknav_menu {
	display: none;
}


/*Ende MENU*/


/* HEADER============================================= */
header {
	text-align: center;
	padding-top: 0;
	
}

.container{
	width: 100%;
	background-color: #bd192a; /*Rot*/
}


header h1 {
	font-size: 160%;
	text-align: left;
	color: #FFFFFF; /*Weiß*/
	line-height: 1.5em;
	font-family: Georgia, "Times New Roman", Times, serif;
}




/* MAIN ========================================*/
main {
	text-align: left;
	padding-left: 15%;
	padding-right: 15%;
	background-color: #a7aaad;
}


.about{
	padding: 10px;
}


section{
	padding-top: 1em;
	padding-bottom: 5px;
	padding-left: 5px;
	padding-right: 5px;
	margin-bottom: 20px;
	background-color: #fff;
	color: #051d37; /*Schwarz-Blau */
	box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
	border: thin solid #0a3a6e;
}

p {
	padding-top: 5px;
	padding-bottom: 5px;
}

h1 {
	font-size: 160%;
	text-align: left;
	color: #bd192a; /*Rot*/
	line-height: 1.5em;
	font-family: Georgia, "Times New Roman", Times, serif;
	font-weight: 400;
	margin: 20px 0 20px 0;
}


h2 {
	font-size: 130%;
	text-align: left;
	color: #bd192a;
	line-height: 1.5em;
	font-family: Georgia, "Times New Roman", Times, serif;
}


h3 {
	font-size: 100%;
	text-align: left;
	color: #236cb9; /*Mittelblau*/
	line-height: 1.5em;
	font-family: Georgia, "Times New Roman", Times, serif;
}


main a:link {
	color: #0a3a6e; /*Dunkelblau*/
	text-decoration: underline;
}
main a:hover {
	color: #bd192a; /*Rot*/
}
a:visited {
	color: #0066CC;
	text-decoration: underline;
}


/* FOOTER ========================================*/

footer {
	text-align: left;
	background-color: #fff; /*grau*/
	color: #000;
	padding-top: 0;
	padding-bottom: 5px;
	padding-right: 0;
	padding-left: 0;
	margin: 0;
	border-top-width: thick;
	border-top-style: solid;
	border-right-style: none;
	border-bottom-style: none;
	border-left-style: none;
	border-color: #bd192a; /*Rot*/
}

.footertext{
	padding: 30px 0 20px 0;
	font-size: 0.9em;
}

footer a:link {
	color: #294B6E;
	text-decoration: none;
	padding-right: 2px;
	padding-left: 2px;
}
footer a:hover {
	color: #59A4F0;
	text-decoration: underline;

}
footer a:visited {
	color: #59A4F0;
	text-decoration: underline;
}


.space {
	padding-left: 50px;
	background-color: #FFFFFF;
}

.ankerlink{
	font-weight: normal;
	font-size: 90%;
}

.header-space {
	padding-left: 15%;
}


/*Flexraster ===================================*/
/*Spalteneinstellungen */


.wrapper{
	max-width: 1140px;
	margin: 0 auto;
	position: relative;
	padding: 0 30px;
}

.row{
	display: flex;
	flex-direction: row;
	flex-wrap: no-wrap;
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: 0;
	margin: 0 0 5px 0;
}

.col{
	flex-grow: 1;
	flex-shrink: 0;
	flex-basis: 0;
	xbackground: red;
	xborder: 1px solid blue;
}

.row .col:first-of-type { 
	margin-left:0px; 
}

.col.one { 
	flex-basis: 7.5%;
	width: 7.5%; 
	max-width: 7.5%;
	word-break: break-all;
}

.col.two {
	width: 15.9%;
	max-width: 15.9%;
	padding: 10px;
}

.col.three { 
	width:24.3%;
	max-width: 24.3%;
}

.col.four { 
	width:32.7%; 
	max-width: 32.7%;
}

.col.five { 
	width:41.1%; 
	max-width: 41.1%;
}

.col.six {
	width: 49.5%;
	max-width: 49.5%;
	padding-right: 10px;
}

.col.seven { 
	width:57.9%; 
	max-width: 57.9%;
}

.col.eight { 
	width:66.3%; 
	max-width: 66.3%;
	padding-right: 10px;
}

.col.nine { 
	width:74.7%; 
	max-width: 74.7%;
}

.col.ten {
	width: 83.1%;
	max-width: 83.1%;
	padding: 10px;
}

.col.eleven { 
	width:91.5%; 
	max-width: 91.5%;
}

.col.twelve {
	width: 100%;
	max-width: 100%;
}

.row .col:last-of-type { 
	margin-right:0px; 
}


/* BREAKPOINTS  =========================================================================== */

/* Einstellungen für Tablet  */

@media only screen and (max-width: 959px) {

	
#nav_menu ul li a {
	font-size: .875em;                      /* 14 / 16 */
}

}  /* Ende Einstellungen für Tablet */


/* Einstellungen für Smartphone */

@media only screen and (max-width: 50em){
	
#head{
	padding-left: 10%;
	padding-right: 10%;
	height: 220px;
	bordercolor: #FFF;
	background-repeat: no-repeat;
	background-position: center;

}

main {
	text-align: left;
	padding-left: 2%;
	padding-right: 2%;
	background-color: #a7aaad;
}

h1 {
	font-size: 140%;
}

.space {
	padding-left: 10px;
}

#nav_menu {
	display: none;
}
.slicknav_menu {
	display: block;
}

.footertext{
	padding: 15px 10px 10px 10px;
	font-size: 0.9em;
}

.row{
	flex-wrap: wrap;
}

.col.one,
.col.two,
.col.three,
.col.four,
.col.five,
.col.six,
.col.seven,
.col.eight,
.col.nine,
.col.ten,
.col.eleven,
.col.twelve{
	flex: 1 0 100%;
	max-width: 100%;
}

ul#main_nav,
#search{
	display: none;
}

.slicknav_menu{
	display: block;
	position: absolute;
	right: 30px;
	background: #fff;
	z-index: 9999999999;
}

.slicknav_btn{
	background: #333;
}

.slicknav_menu .slicknav_icon-bar{
	color: #000;
}

.slicknav_nav a{
	color: #000;
}

header > .row{
	height:80px;
	padding: 10px 30px;
}



}  /* Ende Einstellungen für Smartphones */


