/* Fonts
   ========================================================================== */

/* Roboto */
@font-face {
  font-family: 'Roboto_Regular';
  font-style: normal;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/Roboto/roboto-regular-webfont.woff2') format('woff2'),
  url('./fonts/Roboto/roboto-regular-webfont.woff') format('woff'),
  url('./fonts/Roboto/Roboto-Regular.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto_Bold';
  font-style: normal;
  font-weight: 700;
  font-display: swap;
  src: url('./fonts/Roboto/roboto-bold-webfont.woff2') format('woff2'),
  url('./fonts/Roboto/roboto-bold-webfont.woff') format('woff'),
  url('./fonts/Roboto/Roboto-Bold.ttf') format('truetype');
}

@font-face {
  font-family: 'Roboto_Italic';
  font-style: italic;
  font-weight: 400;
  font-display: swap;
  src: url('./fonts/Roboto/roboto-italic-webfont.woff2') format('woff2'),
  url('./fonts/Roboto/roboto-italic-webfont.woff') format('woff'),
  url('./fonts/Roboto/Roboto-Italic.ttf') format('truetype');
}


/* Custom Styles
   ========================================================================== */

* {
  padding: 0;
  margin: 0;
}

body {
  margin: 0;
  font-family: "Arial", sans-serif;
  font-style: normal;
  font-weight: 400;
}

.container {
  background: #ffffff;
  width: 100%;
  margin: 0 auto;
  padding: 0;
}

.header { 
  background: #ffffff;
  border-bottom: 2px solid #d82342;
  padding: 1em;
}

.header img {
  max-width: 30%;
  margin: 0;
  padding: 0;
}

.content { padding: 0; }

.main { 
  background: #ffffff;
  padding: 1em;
}

.main div, p { padding: 2em 0 0 0; }

.main ul {
  list-style-position: inside;
  padding: 2em 0;
}

.bild-text { 
  padding: 1em 0 1em 0;
  align-items: flex-start; 
}

.bild-text figure { width: 50%; }

.bild-text p { 
  width: 50%;
  padding: 0; 
}

img.logo-text { 
  width: 80%;
  padding-right: 0.5em;
}

.stellenportal-logos a { 
  width: 43%;
  padding: 1em 1em 1em 0;
}

.flex-img { background: #ffffff; }

.footer { padding: 1em; }

.footer, 
.footer ul { background: #ffffff; }

.footer ul {
  list-style-type: none;
  list-style-position: outside;
  margin: 0;
}

.footer ul li { padding-right: 1em; }

.flex-container { 
  display: flex; 
  flex-direction:  row;
  /* justify-content: center;
  align-items: center; */
}

.flex-item {
  flex-grow: 0;
  flex-shrink: 1;
  flex-basis: auto;
}

.nowrap { flex-wrap: nowrap; }

.wrap { flex-wrap: wrap; }

.blocker {
  display: block;
  clear: both;
}

h1 { 
  font-family: 'Roboto_Regular', sans-serif;
  font-size: 120%; 
}

h2 { 
  font-family: 'Roboto_Regular', sans-serif;
  font-size: 110%;
}

h3 { 
  font-family: 'Roboto_Regular', sans-serif;
  font-size: 105%;
}

a { 
  text-decoration: underline;
  color: #000000;
}

a:hover { color: #d82342; }

p { padding: 1em 0 1em 0; }

img {  
  max-width: 100%;
  margin: 0 auto;
  padding: 0;
}

@media screen and (min-width: 800px) {

  .header img {
    width: 150px;
  }

  .header-wrapper { 
    width: 60%;
    margin: 0 auto;
  }

  .content { 
    width: 60%;
    margin: 0 auto;
    padding: 1em;
  }

  .footer ul {
    width: 60%;
    margin: 0 auto;
  }
  
  .bild-text figure { width: 33.33%; }

  .bild-text p { width: 65%; }

  .stellenportal-logos a { width: 33.33%; }
  
}

@media screen and (min-width: 1200px) {
  
  .flex-wrapper {
    display: flex;
  }

  .content-wrapper {
    display: flex;
    flex-wrap: wrap;
    flex: 1;
		order: 1;
  }

  .flex-img {
    padding: 0 1em;
    display: flex;
    flex-wrap: wrap;
    flex: 1;
		order: 2;
	}

  .bild-text figure { width: 20%; }

  .bild-text p { width: 80%; }

  .stellenportal-logos a { width: 14%; }
  
}