/*! normalize.css v8.0.1 | MIT License | github.com/necolas/normalize.css */

/* Document
   ========================================================================== */

/**
 * 1. Correct the line height in all browsers.
 * 2. Prevent adjustments of font size after orientation changes in iOS.
 */

 html {
    line-height: 1.15; /* 1 */
    -webkit-text-size-adjust: 100%; /* 2 */
  }
  
  /* Sections
     ========================================================================== */
  
  /**
   * Remove the margin in all browsers.
   */
  
  body {
    margin: 0;
  }
  
  /**
   * Render the `main` element consistently in IE.
   */
  
  main {
    display: block;
  }
  
  /**
   * Correct the font size and margin on `h1` elements within `section` and
   * `article` contexts in Chrome, Firefox, and Safari.
   */
  
  h1 {
    font-size: 2em;
    margin: 0.67em 0;
  }
  
  /* Grouping content
     ========================================================================== */
  
  /**
   * 1. Add the correct box sizing in Firefox.
   * 2. Show the overflow in Edge and IE.
   */
  
  hr {
    box-sizing: content-box; /* 1 */
    height: 0; /* 1 */
    overflow: visible; /* 2 */
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  pre {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /* Text-level semantics
     ========================================================================== */
  
  /**
   * Remove the gray background on active links in IE 10.
   */
  
  a {
    background-color: transparent;
  }
  
  /**
   * 1. Remove the bottom border in Chrome 57-
   * 2. Add the correct text decoration in Chrome, Edge, IE, Opera, and Safari.
   */
  
  abbr[title] {
    border-bottom: none; /* 1 */
    text-decoration: underline; /* 2 */
    text-decoration: underline dotted; /* 2 */
  }
  
  /**
   * Add the correct font weight in Chrome, Edge, and Safari.
   */
  
  b,
  strong {
    font-weight: bolder;
  }
  
  /**
   * 1. Correct the inheritance and scaling of font size in all browsers.
   * 2. Correct the odd `em` font sizing in all browsers.
   */
  
  code,
  kbd,
  samp {
    font-family: monospace, monospace; /* 1 */
    font-size: 1em; /* 2 */
  }
  
  /**
   * Add the correct font size in all browsers.
   */
  
  small {
    font-size: 80%;
  }
  
  /**
   * Prevent `sub` and `sup` elements from affecting the line height in
   * all browsers.
   */
  
  sub,
  sup {
    font-size: 75%;
    line-height: 0;
    position: relative;
    vertical-align: baseline;
  }
  
  sub {
    bottom: -0.25em;
  }
  
  sup {
    top: -0.5em;
  }
  
  /* Embedded content
     ========================================================================== */
  
  /**
   * Remove the border on images inside links in IE 10.
   */
  
  img {
    border-style: none;
  }
  
  /* Forms
     ========================================================================== */
  
  /**
   * 1. Change the font styles in all browsers.
   * 2. Remove the margin in Firefox and Safari.
   */
  
  button,
  input,
  optgroup,
  select,
  textarea {
    font-family: inherit; /* 1 */
    font-size: 100%; /* 1 */
    line-height: 1.15; /* 1 */
    margin: 0; /* 2 */
  }
  
  /**
   * Show the overflow in IE.
   * 1. Show the overflow in Edge.
   */
  
  button,
  input { /* 1 */
    overflow: visible;
  }
  
  /**
   * Remove the inheritance of text transform in Edge, Firefox, and IE.
   * 1. Remove the inheritance of text transform in Firefox.
   */
  
  button,
  select { /* 1 */
    text-transform: none;
  }
  
  /**
   * Correct the inability to style clickable types in iOS and Safari.
   */
  
  button,
  [type="button"],
  [type="reset"],
  [type="submit"] {
    -webkit-appearance: button;
  }
  
  /**
   * Remove the inner border and padding in Firefox.
   */
  
  button::-moz-focus-inner,
  [type="button"]::-moz-focus-inner,
  [type="reset"]::-moz-focus-inner,
  [type="submit"]::-moz-focus-inner {
    border-style: none;
    padding: 0;
  }
  
  /**
   * Restore the focus styles unset by the previous rule.
   */
  
  button:-moz-focusring,
  [type="button"]:-moz-focusring,
  [type="reset"]:-moz-focusring,
  [type="submit"]:-moz-focusring {
    outline: 1px dotted ButtonText;
  }
  
  /**
   * Correct the padding in Firefox.
   */
  
  fieldset {
    padding: 0.35em 0.75em 0.625em;
  }
  
  /**
   * 1. Correct the text wrapping in Edge and IE.
   * 2. Correct the color inheritance from `fieldset` elements in IE.
   * 3. Remove the padding so developers are not caught out when they zero out
   *    `fieldset` elements in all browsers.
   */
  
  legend {
    box-sizing: border-box; /* 1 */
    color: inherit; /* 2 */
    display: table; /* 1 */
    max-width: 100%; /* 1 */
    padding: 0; /* 3 */
    white-space: normal; /* 1 */
  }
  
  /**
   * Add the correct vertical alignment in Chrome, Firefox, and Opera.
   */
  
  progress {
    vertical-align: baseline;
  }
  
  /**
   * Remove the default vertical scrollbar in IE 10+.
   */
  
  textarea {
    overflow: auto;
  }
  
  /**
   * 1. Add the correct box sizing in IE 10.
   * 2. Remove the padding in IE 10.
   */
  
  [type="checkbox"],
  [type="radio"] {
    box-sizing: border-box; /* 1 */
    padding: 0; /* 2 */
  }
  
  /**
   * Correct the cursor style of increment and decrement buttons in Chrome.
   */
  
  [type="number"]::-webkit-inner-spin-button,
  [type="number"]::-webkit-outer-spin-button {
    height: auto;
  }
  
  /**
   * 1. Correct the odd appearance in Chrome and Safari.
   * 2. Correct the outline style in Safari.
   */
  
  [type="search"] {
    -webkit-appearance: textfield; /* 1 */
    outline-offset: -2px; /* 2 */
  }
  
  /**
   * Remove the inner padding in Chrome and Safari on macOS.
   */
  
  [type="search"]::-webkit-search-decoration {
    -webkit-appearance: none;
  }
  
  /**
   * 1. Correct the inability to style clickable types in iOS and Safari.
   * 2. Change font properties to `inherit` in Safari.
   */
  
  ::-webkit-file-upload-button {
    -webkit-appearance: button; /* 1 */
    font: inherit; /* 2 */
  }
  
  /* Interactive
     ========================================================================== */
  
  /*
   * Add the correct display in Edge, IE 10+, and Firefox.
   */
  
  details {
    display: block;
  }
  
  /*
   * Add the correct display in all browsers.
   */
  
  summary {
    display: list-item;
  }
  
  /* Misc
     ========================================================================== */
  
  /**
   * Add the correct display in IE 10+.
   */
  
  template {
    display: none;
  }
  
  /**
   * Add the correct display in IE 10.
   */
  
  [hidden] {
    display: none;
  }
  

@font-face {
    font-family: "Roboto";
    src: url(fonts/Roboto-Regular.ttf);
    font-weight:400;
}

@font-face {
    font-family: "Roboto";
    src: url(fonts/Roboto-Bold.ttf);
    font-weight:700;
}

@font-face {
  font-family: "Roboto";
  src: url(fonts/Roboto-Black.ttf);
  font-weight:900;
}

@font-face {
    font-family: "Roboto";
    src: url(fonts/Roboto-Thin.ttf);
    font-weight:300;
}


html {
    font-size: 16px;
}

body, button, input, select, option, textarea {
    font-family: "Roboto", Helvetica, Arial, sans-serif;
	/*background:rgba(255,228,49,0.25); */
	/*background:#ffe431;*/ 
	/*background:linear-gradient(-115deg, #ffe431 0%, #fff 15%);*/
   
}

.logo {
  width:75%;
  max-width:450px;
  height:auto;  
}

.site_wrapper {
  margin: 0 auto;
  width: 100%;
  min-width: 320px;
  max-width: 1200px;
  height: 101%;
  color: #4c5255;
  /*background:#fff;*/
  /*border-width:0 10px;
  border-style:solid;
  border-color:#005a9a;
  box-shadow:0 0 20px rgba(0,0,0,0.9);*/
}

.header {
	display: flex;
	justify-content: space-between;
	align-items: flex-start;
	padding: 30px 30px;
	position: relative;
	color: #777777;
	background-color: #ffffff;
}

.main_nav {
	position: relative;
	font-weight: 400;
	border-top: 1px solid #4c5255;
	border-bottom: 1px solid #4c5255;
}

.main_nav ul + ul{
	border-top: 1px solid #4c5255;
}

.main_nav div ul {
	margin: 0;
  /*background:#f1f2f3;*/
}

.main_nav div ul li {
	list-style: none;
	display: inline-block;
  transform: skew(-7deg);
  border-right:1px solid #f1f2f3;

}

.main_nav li:hover {
  background:#f1f2f3;
}

.main_nav li.current-menu-item {
	background-color: #005a9a;
  color:#ffd500;
  font-weight: 900;
  border-color:transparent;
}

.main_nav div ul li a {
	padding: 0.7rem;
	text-decoration: none;
	color: inherit;
	display: block;
	letter-spacing: 0.05em;
	text-transform: uppercase;
}

.content {
  padding:30px 40px;
  font-size:1.2rem;
  line-height:1.45;
}

.centercontent404 {
  margin:50px 100px;
  text-align:left;
  padding-left:120px;
  background:url(../images/error.png) no-repeat left top;
  background-size:auto 65%;
}

.center {
	text-align:center;	
}

a {
  color:#005a9a
}

.content > * {
 /*  max-width:65%; */
}

.content li {
  margin:1em 0;
}

.content .kompakt li {
	margin:0.2em 0;	
}

.noe {
  background:url(../images/noe.png) no-repeat right top;
  background-size:contain;
  position:fixed;
  top:100px;
  right:0px;
  width:50%;
  bottom:100px;
  opacity:0.15;
  pointer-events: none;
  z-index:-1;
}

/* Footer */

.bg_grau {
	background:rgba(0,0,0,0.65); /*#005a9a;*/
}

.img_wrapper img{
	max-width:200px;
	width:25%;	
}

footer {
	margin-top: 30px;
	/* min-height: 300px; */
	padding: 20px 30px 10px;
	position: relative;
	color:#fff;
}

footer a {
	color:#fff;
}

footer .contact_wrapper {
	display: flex;
	padding-right: 80px;
	width: 100%;
	
}

footer .contact_wrapper .contact_footer {
	width:100%;
}

footer .footer_nav ul {
	display: flex;
	flex-direction: row;
	color: inherit;
	padding: 0;
}

footer .footer_nav li {
	list-style: none;
	padding-right: 10px;
}

footer .footer_nav a {
	text-decoration: none;
	color: inherit;
}

#created {
	font-size: 0.6rem;
	position: absolute;
	right: 20px;
	bottom: 10px;
}


/* Inhalte */
.kontakt th, .kontakt td {
	text-align:left;
	vertical-align:top;	
	padding:0 30px 10px 0;
}


article.main {
	display:flex;
	flex-wrap:wrap;
	width:auto;
	max-width:none;
}
article .col {
	width:55%;
	padding-right:5%;
}
aside.col {
	width:35%;	
	text-align:center;
}

.col50 {
	width:47.5%;	
	padding:0 2.5% 0 0; 
}

.col50:nth-child(2n) {
	padding:0 0 0 2.5%; 
}

.col50 figure {
	text-align:center;	
}

.col50 > :first-child {
	margin-top:0;
}


.small {
	font-size:0.75em;	
}

.btn {
	display:inline-block;
	background-color: #005a9a;
  	color:#ffd500;
	padding:10px 20px;
	border-radius:10px;
	text-decoration:none;
}

aside.col a.bildungbutton {
	position:relative; 
	display:inline-block; 
	width:420px; 
	height:360px; 
	overflow:hidden;
}
a.bildungbutton > div {
	pointer-events:none; 
	transform:scale(0.3); 
	transform-origin:0 0; 
	position:absolute; 
	top:0; 
	left:0;
}
a.bildungbutton > div > div {
	width:1400px; 
	height:1200px; 
	background:#ccc;
}

aside.col figure {
	margin:0;
	width:100%; 
	height:auto; 
}

figure img {
	width:100%;
	height:auto;	
	vertical-align:bottom;
}
figure  {
	position:relative;	
}
figure .copy {
	content:'©';
	position:absolute;
	background:#fff;
	width:17px;
	height:17px;
	font-size:12px;
	right:5px;
	bottom:5px;	
	cursor:pointer;
	text-align:center;
}
figcaption {
	position:absolute;
	background:#fff;	
	background:rgba(255,255,255,0.8);
	font-size:12px;
	left:0px;
	bottom:0px;	
	padding:5px;
	right:0px;
	z-index:2;
}


.memberlist {
	list-style:none;
	padding:0;	
	display:flex;
	flex-wrap:wrap;
	align-items:center;
	width:auto;
}
.memberlist li {
	margin:0;	
	width:50%;
	margin:10px 0 40px 0;
	text-align:center;
}

.memberlist li img {
	width:auto;
	height:auto;
	max-width:300px;
	max-height:75px;
}

.spam {
	display:none;	
}

input, textarea, button {
	border:1px solid #ccc; 
	border-radius:5px; 
	padding:4px; 
	width:65%;
	transition:all 0.5s;
}

button {
	padding:8px;
	background:#005a9a;
	cursor:pointer;
	color:#fff;
}

input:focus, textarea:focus {
	background:#eee;
	border-color:#000;	
}

textarea {
	resize:none;	
}

hr {
	margin-top:2em;	
}

.done {
	border:1px solid #ccc;
	border-radius:5px;
	padding:8px;
	background:#d1fdc1;	
}

.fielderror {
	box-shadow: 0 0 1.5px 1px red;
}

#mobilemenu {
	display:none;	
}


.sponsor_footer {
  width:100%;
  text-align:right;
}

.sponsor_footer img {
  max-width:300px;
  width:100%;
}

p img {
  max-width:99%;
}

@media screen and (max-width:801px) {
	.site_wrapper {
		padding-top:60px;	
	}
	#mobilemenu { 
		display:block;
		position:absolute;
		right:15px;
		top:10px;
		width:30px;	
		font-size:0;	
	}
	#mobilemenu hr {
		border:none;
		height:3px;
		margin-top:5px;
		background:#000;
	} 
	
	
	.header {
		padding:8px;
		position:fixed;
		top:0;
		left:0;
		right:0;
		z-index:20;
	}
	.noe { 
		width:100%;
		background-size:100%;
	}
	.main_nav {
		overflow:hidden;
		display:none;
	}

	.main_nav.show {

	}

	.main_nav div ul {
		padding:0;
	}

	.main_nav div ul li {
	  display: block;
	  transform: skew(0deg);
	  border-right:none;
	
	}

	.main_nav li:hover {
	}

	.main_nav li.current-menu-item {
	}

	.main_nav div ul li a {
	}
	
	.content {
		padding:10px 5px;
	}
	
	html {
		font-size:14px;	
	}
	
	h1 {
		font-size:1.3em;	
	}
	h2 { 
		font-size:1.1em;
	}
	article .col {
		width:100%;
		padding:0;
	}
	aside.col {
		order:-1;	
	}
	footer .contact_wrapper {
		padding:0;
    flex-wrap:wrap;
	}
	.memberlist li {
		width:100%;	
	}
	aside.col a.bildungbutton {
		width:95%; 
		height:360px; 
		overflow:hidden;
	}	
	a.bildungbutton > div > div, iframe {
		width:1000px; 
	}
	input, textarea, button {
		width:95%;
	}
	
	.col50 {
	width:95%;	
	padding:0 2.5% 0 2.5%; 
}
	
}