/* ----------------------------------------
    Reset
---------------------------------------- */

/* ----------------------------------------
    Reset
---------------------------------------- */

* {margin:0;padding:0;border:0;}
*,:before,:after {-webkit-box-sizing:border-box;-moz-box-sizing:border-box;box-sizing:border-box;}

html {-webkit-text-size-adjust:none;-ms-text-size-adjust:none;scroll-behavior: smooth;}

ul {list-style:none;}
a {color:inherit;text-decoration:none;cursor:pointer;}
a:active,a:hover,a:focus {outline:none;}
a[x-apple-data-detectors] {background:none !important;border:none !important;color: inherit !important;text-decoration:none !important;}

input,select {vertical-align:middle;}
img {display:block;width:100%;height:auto;}
audio,canvas,progress,video {display:inline-block;vertical-align:baseline;}

/* ----------------------------------------
    Fonts in use
---------------------------------------- */

@font-face {
    font-family:'Hind';
    src: url('fonts/hind/hind-light-webfont.woff2') format('woff2'),
    url('fonts/hind/hind-light-webfont.woff') format('woff');
    font-weight:300;
    font-style:normal;
    font-display: swap;
}

@font-face {
    font-family:'Hind';
    src: url('fonts/hind/hind-regular-webfont.woff2') format('woff2'),
    url('fonts/hind/hind-regular-webfont.woff') format('woff');
    font-weight:400;
    font-style:normal;
    font-display: swap;
}

@font-face {
    font-family:'Hind';
    src: url('fonts/hind/hind-medium-webfont.woff2') format('woff2'),
    url('fonts/hind/hind-medium-webfont.woff') format('woff');
    font-weight:500;
    font-style:normal;
    font-display: swap;
}

@font-face {
    font-family:'Hind';
    src: url('fonts/hind/hind-semibold-webfont.woff2') format('woff2'),
    url('fonts/hind/hind-semibold-webfont.woff') format('woff');
    font-weight:600;
    font-style:normal;
    font-display: swap;
}

@font-face {
    font-family:'Hind';
    src: url('fonts/hind/hind-bold-webfont.woff2') format('woff2'),
    url('fonts/hind/hind-bold-webfont.woff') format('woff');
    font-weight:700;
    font-style:normal;
    font-display: swap;
}

@font-face {
  font-family:'Material Icons';
  font-style:normal;
  font-weight:400;
  src: url(fonts/material-icons/materialicons.woff2) format('woff2')
}

/* ----------------------------------------
    Font Styles
---------------------------------------- */

* {font-weight:inherit;font-style:normal;}

html {
   font-size:100%; 
}

body {
    font-family: 'Hind', sans-serif;
    font-size:16px;
    font-weight:400;
    letter-spacing: 0.025em;
    line-height:1.6;
    color:#222;
}

h1,.h1 {font-size:2.75em;}
h2,.h2 {font-size:2.25em;}
h3,.h3 {font-size:2em;}
h4,.h4 {font-size:1.5em;}
h5,.h5,.large {font-size:1.25em;}
h6,.h6 {font-size:1em;}

h1,.h1 {
    color:var(--blau);
    line-height:1.1;
}

h2,.h2,h3,.h3,h4,.h4 {
    color:var(--blau);
    line-height:1.3;
}

p,ul,h1,h2,h3,h4,h5,h6 {margin-bottom:20px;}

p:last-child {margin-bottom:0;}

small,.small {font-size:0.9em;}

.tiny {font-size:0.7em;}

strong,.strong,b {
   font-weight:600;
   font-size:1.05em;
}

.x-strong {font-weight:700;}

.uppercase {text-transform:uppercase;}

em,.italic,i {font-style:italic;}

a,span {display:inline-block;}


@media (max-width: 1000px) {
    
    h1,.h1 {
        hyphens:auto;
        font-size:2em;
        line-height:1.2;
    }
    
}

/* Color */

:root {
    --blau:#005EB8;
    --dunkelblau:#004182;
    --hellblau:#007af0;
    --grau:#ccc;
    --hellgrau:#f1f2f3;
    --black:15,23,42;
    --white:255,255,255;
    --green:60,194,200;
    --shadow: 0 10px 25px 0 rgb(var(--black),0.2);
}

.blau {color:var(--blau);}
.text {color:#222;}
.bg-blau {background:var(--blau);}
.bg-grey {background:var(--hellgrau);}
.bg-white {
    background:white;
    padding:25px 20px 25px 20px;
}

/* ----------------------------------------
    Columns
---------------------------------------- */

.pagewrap {
    
}

.container {
    --viewport:1200px;
    --gap:25px;
    
    width:var(--viewport);
    max-width:90%;
    margin:0 auto;
    display:grid;
    gap:var(--gap);
    padding:20px 0;
}

.container .container {
    width:100%;
    max-width:100%;
    padding:0;
}

.container.devider {
    border-bottom:1px solid #ccc;
}

@media (min-width:1000px) {
    
    .container {
        grid-template-columns:repeat(12,1fr);
        padding:60px 0;
        --gap:40px;
    }
    
    .container > * {grid-column:auto / span 12}
    .container.cols-2 > div {grid-column:auto / span 2}
    .container.cols-3 > div {grid-column:auto / span 3}
    .container.cols-4 > * {grid-column:auto / span 4}
    
    .col-1 {grid-column:auto / span 1}
    .col-2 {grid-column:auto / span 2}
    .col-3 {grid-column:auto / span 3}
    .col-4 {grid-column:auto / span 4}
    .col-5 {grid-column:auto / span 5}
    .col-6 {grid-column:auto / span 6}
    .col-7 {grid-column:auto / span 7}
    .col-8 {grid-column:auto / span 8}
    .col-9 {grid-column:auto / span 9}
    .col-10 {grid-column:auto / span 10}
    .col-11 {grid-column:auto / span 11}
    .col-12 {grid-column:auto / span 12!important}
        
    .start-1 {grid-column-start:1}
    .start-2 {grid-column-start:2}
    .start-3 {grid-column-start:3}
    .start-4 {grid-column-start:4}
    .start-5 {grid-column-start:5}
    .start-6 {grid-column-start:6}
    .start-7 {grid-column-start:7}
    .start-8 {grid-column-start:8}
    .start-9 {grid-column-start:9}
    .start-10 {grid-column-start:10}
    .start-11 {grid-column-start:11}
    .start-12 {grid-column-start:12}
    
    .gap-0 {column-gap:0px}
    .gap-s {column-gap:20px}
    .gap-m {column-gap:60px}
    .gap-l {column-gap:80px}
    .row-gap-l {row-gap:40px;}
    
    .checksize {display:none;}
    
}

@media (max-width: 1000px) {
    
}

@media (max-width: 500px) {
    
}

@media print {
    
    body,.container {
        width:100%;
        padding:20px 0;
    }
    
    header,
    footer,
    .footer-kontakt,
    .pre-footer,
    .top {
        display:none;
    }
}

/* ----------------------------------------
    Navigation
---------------------------------------- */

header ul {
    margin:0;
}

header .menu > li > a {
    font-size:1.3em;
    font-weight:400;
    letter-spacing:0.04em;
    padding: 0 28px;
    text-transform:uppercase;
}

header .menu > li > a:last-child {
    padding-right:0;
}

header .menu li.current-menu-item:not(.anchor) > a,
header .menu li.current-menu-ancestor > a,
header .menu a:hover,
header .menu li.active > a,
header .menu li.current_page_item > a,
a:hover {
    color:var(--blau);
}

header .menu .sub-menu.level-2 > li > a {
    color:var(--blau);
    cursor:default !important;
    pointer-events:none;
}

header .menu .sub-menu.level-3 li {
   padding-left:12px;
   line-height:1.8;
   position:relative;
}

header .menu .sub-menu.level-3 li::before {
   font-family: 'Material Icons';
   content:'arrow_forward_ios';
   font-size:0.65rem;
   font-weight:300;
   line-height:2.15;
   color:var(--blau);
   position:absolute;
   top:0;
   left:-2px;
   opacity:0.5;
}

header .menu .sub-menu.level-3 li:hover::before,
header .menu .sub-menu.level-3 li.active::before,
header .menu .sub-menu.level-3 li.current_page_item::before {
    opacity:1;
}

@media (min-width: 1000px) {
    
    .logo-top {
        width:115px;
        height:auto;
        z-index:99;
        transition:all 0.3s ease;
    }

    header {
        position:sticky;
        top:0;
        width:100%;
        z-index:9999;
        background:white;
    }
    
    header .container {
        height:160px;
        padding:25px 0;
        transition:all 0.3s ease;
    }
    
    header ul.menu {
        display:flex;
        justify-content:right;
        padding:35px 0;
        transition:all 0.3s ease;
    }
    
    header .menu .sub-menu.level-2 {
        width:100vw;
        padding:40px calc(((100vw - 1200px) / 2));
        background:rgb(var(--white),0.95);
        box-shadow: 0px 10px 12px 0px rgba(0,0,0,0.1);
        position:absolute;
        left:0;
        display:flex;
        visibility:hidden;
        opacity:0;
        transition:all 0.25s ease;
    }
    
    header .menu > li:hover .sub-menu.level-2 {
        padding-top:100px;
        visibility:visible;
        opacity:1;
        transition:all 0.5s ease;
    }
    
    header .menu .sub-menu.level-2 > li:first-child {
        width:350px;
    }
    
    header .menu .nav-service .sub-menu.level-2 > li:first-child {
        width:270px;
    }
    
    header .menu .sub-menu.level-2 > li:not(:last-child) {
        padding-right:60px;
    }
    
    header .menu .sub-menu.level-2 > li > a {
        font-size:1.3em;
        font-weight:400;
    }
    
    .stoerer {
      width:220px;
      height:220px;
      display:flex;
      flex-direction:column;
      align-items:center;
      justify-content:center;
      border-radius:50%;
      padding:10px;
      background:#015eb8;
      text-align:center;
      color:white;
      font-size:1.1em;
      line-height:1.4;
      box-shadow: 0px 10px 12px 0px rgba(0,0,0,0.1);
      margin:0 auto;
    }
    
    #wasserstoff {
      background:#f1f2f3;
    }
    
    .button-single {
      display:inline-block;
      padding:15px 30px;
      margin-top:10px;
      border:1px solid var(--hellblau);
      border-radius:5px;
      background:url("img/bt-arrow-white.svg") no-repeat center;
      background-size:10px;
    }
    
    .button-single:hover {
        background-color:var(--dunkelblau);
        border:1px solid var(--blau);
        background-position:30px center;
        transition:all 0.1s ease;
    }

}

@media (max-width: 1000px) {
    
    .logo-top {
        width:100px;
        height:auto;
        z-index:99;
        margin-bottom:-8px;
    }
    
    header .container {
        height:auto;
        padding:20px 0;
    }
    
    header .menu .sub-menu.level-3 li::before {
       line-height:3.5;
    }
    
    header .menu > li > a {
        padding:0;
    }
    
    header .menu > li,
    header .level-2 > li:not(:first-child),
    header .level-3 > li {
       border-top:1px solid #ccc;
    }
    
    header .menu > li,
    header .level-2 > li,
    header .level-3 > li {
      padding:5px 0 0px 0;
    }
    
    header .level-2 > li > a,
    header .level-3 > li > a {
       padding-bottom:3px;
    }
    
    
    header .menu .sub-menu.level-2 > li:first-child > a {
        display:none;
    }
    
    header .menu .sub-menu.level-2 > li > a {
        font-weight:600;
    }
    
}

/* nav-fixed */

.nav-fixed header {
    border-bottom:1px solid #e1e2e3;
    transition:all 0.8s ease;
    //box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.1);
}

.nav-fixed header .container {
    height:90px;
    padding:0;
    transition:all 0.3s ease;
}

.nav-fixed header nav > ul {
    padding:25px 0;
    //transition:all 0.3s ease;
}

.nav-fixed header .logo-top {
    width:70px;
    margin-top:10px;
    height:auto;
    z-index:99;
    //transition:all 0.3s ease;
}

.nav-fixed header nav > ul > li:hover .sub-menu.level-2 {
    //padding-top:60px;
}

[id] {
    scroll-margin-top:90px; /* anchor */
}


.mobile nav,
.screen .bt-menu {
    display:none;
}

.screen nav {
    display:block;
}

.bt-menu,
.bt-menu.active {
   font-family:'Material Icons';
   font-size:42px;
   position:absolute;
   top:65px;
   right:15px;
   cursor:pointer;
}

.bt-menu::before {
   content:'menu';
}

.bt-menu.active::before {
   content:'close';
}

/* button */

.button {
    display:inline-block;
    position:relative;
    left:50%;
    transform: translateX(-50%);
    padding:10px 0;
}

.button a,
.button .wpcf7-submit {
    display:inline-block;
    position:relative;
    color:white;
    padding:0 45px 0 25px;
    height:40px;
    line-height:40px;
    border-radius:5px;
    background:var(--blau);
    //background:#152d69;
    text-align:center;
    letter-spacing: 0.05em;
    text-transform:uppercase;
    cursor:pointer;
}

.button a:hover,
.button .wpcf7-submit:hover {
    background:var(--dunkelblau);
}
.button a::after {
    display:inline-block;
    content:'';
    width:40px;
    height:40px;
    margin-left:10px;
    background:url("img/bt-arrow-white.svg") no-repeat center;
    background-size:auto 15px;
    position:absolute;
    right:5px;
    top:-1px;
    transition:all 0.2s ease;
}

.button a:hover::after {
    background-position: 20px center;
    transition:all 0.2s ease;
}

.button.down a::after {
    transform: rotate(90deg);
    background-position: center;
}

.button.down.trigger_active a::after {
    transform:rotate(-90deg);
}

.introbox .button a {
    border:1px solid var(--hellblau);
    margin-top:10px;
}

.introbox .button a:hover {
    border:1px solid var(--dunkelblau);
    //background:var(--blau);
}

/* ----------------------------------------
    Styles
---------------------------------------- */

.container.top-pager {
    padding:0;
}

.screen .top-pager {
    position:relative;
    top:0px;
}

.bx-pager-item {
    display:inline-block;
    padding-right:10px;
}

.bx-pager-link,
.bx-pager-link:hover {
    color:transparent;
}

.bx-pager-link::after {
    content:'';
    display:inline-block;
    width:20px;
    height:20px;
    border:2px solid var(--blau);
    border-radius:50%;
}

.bx-pager-link.active::after {
    background:var(--blau);
}

.bx-viewport {
    overflow:visible!important;
    height:460px;
}

.container-top {
    background-size:cover!important;
}

.top-slider .top-product {
    position:relative;
    z-index:99999;
    bottom:-70px;
}

.top-slider .top-product img {
    width:auto;
    max-height:440px;
    margin:0 auto;
}

.container-top .introbox {
    background:var(--blau);
    color: white;
    display:flex;
    align-items:center;
    padding:20px;
}

@media (min-width: 1000px) {
    
    .container-top {
        width:calc(((100vw - 1200px) / 2) + 1200px);
        padding-left:calc((100vw - 1200px) / 2);
        position:relative;
        min-height:220px;
    }
    
    .container-top .introbox {
        width:220px;
        height:220px;
        position:absolute;
        right:0;
    }
    
    .top-slider .container-top {
        height:420px;
        margin-bottom:40px;
    }
    
    .top-slider .top-product {
        width:800px;
        bottom:-100px;
    }
    
    .top-slider .introbox {
        width:480px;
        height:270px;
        padding:40px;
        bottom:40px;
        right:-100px;
        box-shadow: 0px 10px 12px 0px rgba(0,0,0,0.1);
    }

}

@media (max-width: 1000px) {
    
    body:not(.home) .container-top {
        height:140px;
    }
    
    body:not(.home) .container-top .introbox {
        width:140px;
        height:140px;
        position:absolute;
        right:0;
    }
    
    .top-slider .top-product {
      min-height:312px;
    }
    
    .top-slider .introbox {
        padding:70px 20px 20px 20px;
    }
    
    .top-pager {
        margin-top:20px;
    }
    
}

.introbox h3,
.introbox h1 {
    color: white!important;
}

.textbox h1,
.textbox h4 {
    color:white!important;
}

/* nav home-produkte */

.home-produkte .menu {
    
    padding-top:30px;
}

.home-produkte .sub-menu.level-3 li {
    border-bottom:1px solid #ccc;
    border-top:1px solid #ccc;
    margin-top:-1px;
}

.home-produkte .sub-menu.level-3 li,
.home-produkte .sub-menu.level-2 li a {
    padding:3px 0;
}

.home-produkte .sub-menu.level-3 a::before {
    content:'';
    display:inline-block;
    padding:6px;
    background:url(img/arrow.svg) no-repeat left center;
    background-size:7px auto;
    opacity:0.5;
}

.home-produkte .sub-menu.level-3 a:hover::before {
    opacity:1;
}

.home-produkte .sub-menu.level-3 {
    margin-bottom:0;
}

.home-produkte .sub-menu.level-2 > li > a {
    display:inline-block;
    font-weight:600;
    color:var(--blau);
    cursor:default !important;
    pointer-events:none;
}

.home-produkte .menu > li > a,
.home-produkte .sub-menu.level-2 li.menu-desc > a,
.home-produkte .gasdruck .menu > li:not(.nav-gasdruck),
.home-produkte .gasmessung .menu > li:not(.nav-gasmessung),
.home-produkte .service .menu > li:not(.nav-service) {
    display:none;
}

/* card */

.downloads p {
    margin:0;
    //line-height:1.2!important;
}

.downloads .file-desc {
    line-height:1.3;
}

.downloads .file-size {
    margin-top:5px;
    font-size:0.9em;
}

.container.downloads {
    //padding:0;
}

.card img {
    width:140px;
    height:auto;
    border:1px solid #ddd;
    box-shadow: 0px 0px 10px 0px rgba(0,0,0,0.2);
    position:relative;
    z-index:999;
    margin:0 auto;
}

.card {
    text-align:center;
}

.card:hover .card-text strong {
    color:var(--blau);
}

.card-text {
    padding:50px 20px 15px 20px;
    margin-top:-35px;
    //color:white;
    background:var(--hellgrau);
    position:relative;
}

.card-text strong {
    //color:var(--blau);
}

.mobile main section:first-child .col-6:nth-child(2) { order: 1; }

/* table */

.screen .illu img {
    padding:0 80px;
}

table {
    width:100%;
    border-collapse: collapse;
    margin-bottom:10px;
    line-height:1.4;
    //font-size:14px;
}

thead {
    background:var(--blau);
    color:white;
}

tbody tr:nth-child(even) { /* odd */
    background:white;
}

tbody tr td:first-child {
    //color:var(--blau);
    //font-weight:600;
}

td, tr {
    height:auto!important;
    vertical-align:baseline;
}

td {
    vertical-align:baseline;
    padding:10px 14px 8px 14px;
}

.data-table table {
    text-align:center;
}

.caption {
    display:inline-block;
    font-size:14px;
    line-height:1.4;
}

.data-table td {
    //padding:10px 0;
    border-right:3px solid var(--hellgrau);
}

.data-table thead td {
    //background:#f3f4f5;
    background:white;
    color:var(--blau);
}

.data-table thead tr:last-child td,
.data-table.mkra thead tr:nth-child(2) td,
.data-table.mkra thead tr:nth-child(3) td {
    background:var(--blau);
    color:white;
    font-weight:600;
    //padding:15px 0;
}

.data-table.mkra thead tr:nth-child(2) td:first-child {
    //background:var(--hellgrau);
}

.data-table.mkra thead tr:not(:first-child) td:first-child,
td.bg-grey {
    background:var(--hellgrau);
}

.xxdata-table.mkra thead tr:nth-child(2) td,
 .data-table.mkra thead tr:not(:first-child) td {
    border-bottom:3px solid var(--hellgrau);
}

.data-table:not(.balgen) thead tr:last-child td {
    //padding:15px 0;
    padding-left:0;
    padding-right:0;
}

.data-table thead tr:first-child td:first-child {
    //background:#E2E8ED;
}

.data-table:not(.balgen) thead tr:last-child td:first-child,
.data-table.balgen tbody tr:first-child td:first-child {
    //background:white;
    background:var(--hellgrau);
}


.data-table:not(.balgen) thead tr:last-child td:first-child::before,
.data-table.balgen tbody tr:first-child td:first-child::before {
    content:'↓';
    font-size:16px;
    text-align:center;
    color:var(--blau);
}

.data-table.balgen tr td:first-child {
    text-align:left;
}


.intro-table:not(.smart) tr {
    border-bottom:1px solid #ccc;
}

.intro-table td {
    height:auto!important;
    vertical-align:text-top!important;
}

.intro-table thead td {
    border-right:3px solid white;
}

.intro-table td:first-child {
    text-align:right;
}

.intro-table ul {
    margin-bottom:0;
}

.intro-table li::before {
   line-height:1.8!important;
}

.intro-table.zertifikate tr:nth-child(even) {
  background:#F1F2F3;
}

.intro-table.zertifikate td a:last-child::before {
   font-family:'Material Icons';
   content:'save_alt';
   color:var(--blau);
   position:relative;
   top:1px;
   padding-right:7px;
}

@media (min-width:1000px) {
    
    .data-table table {
        table-layout:fixed;
    }
    
    .data-table td.zrs-first {
      width:140px;
    }
    
    .intro-table td:first-child {
        white-space:nowrap;
    }
    
    .intro-table.zubehoer td,
    .intro-table.zertifikate td {
        text-align:left;
    }
    
    .intro-table.zertifikate td:first-child {
        width:670px;
    }
    
    .intro-table.zertifikate td:last-child {
        width:160px;
    }
    
    .intro-table.zubehoer td:first-child {
        width:140px;
    }
    
    .intro-table.zubehoer.single td:first-child {
        width:auto;
    }
    
    .intro-table.zubehoer td:last-child {
        width:130px;
    }
}

@media (max-width: 1000px) {
    
    .data-table {
        overflow:scroll;
    }
    
    .data-table td {
        font-size:14px;
        padding:10px 5px;
        //white-space:nowrap;
    }
    
    .data-table thead td {
        vertical-align:bottom;
    }
    
    .data-table thead td p {
        writing-mode: vertical-rl;
        position:relative;
        left:50%;
        transform: translate(-50%, 0) rotate(180deg);
        white-space:nowrap;
        text-align:left;
        line-height:1.3;
    }
    
    .intro-table td {
        display:block;
        width:100%!important;
        border:0;
    }
    
    .intro-table td:first-child {
        padding-bottom:0;
        text-align:left;
    }
    
    .intro-table td:last-child {
        padding-top:0;
    }
    
    .intro-table.zubehoer thead td:last-child p {
        display:none;
    }
    
    .intro-table.zubehoer tbody td:last-child p::before {
        content:'Artikelnummer: ';
    }
    
}

/* unternehmen */

.screen .standorte .container > div {
    display:flex;
}

.screen .map {
    __padding:0 50px 20px 0;
}

.mobile .map {
    padding:0 0 20px 0;
}

.map img {
    width:360px;
    border-radius:50%;
    box-shadow: 5px 5px 20px 5px rgba(0,0,0,0.2);
    margin:0 auto;
}

.kontakt-nr {
    display:inline-block;
    width:36px;
}

/* team */

.screen .invisible {
    visibility:hidden;
}

.mobile .invisible {
    display:none;
}

.team-img img {
    width:180px;
    margin-bottom:20px;
    
    display:none;
}

.screen .team-spacer {
  padding-bottom:40px;
}

/* CF7 */

.screen .form > div p {
   display:flex;
}

.wpcf7-text,
.wpcf7-form-control-wrap,
.wpcf7-form-control {
   width:100%;
}

.screen .wpcf7-form-control-wrap {
   padding:10px;
}

.mobile .wpcf7-form-control-wrap {
   padding:10px 0;
}

.wpcf7 input,
.wpcf7 select,
.wpcf7 textarea {
   font-size:inherit;
   padding:10px;
}

.form select {
   width:110px;
   background:#fff;
   border-radius:5px;
   color:var(--blau);
   border-right:10px solid #fff;
   /*
   -moz-appearance:none; 
   -webkit-appearance:none; 
   appearance:none;
   */
}

.wpcf7-checkbox {
   background:white;
   border-radius:3px;
   border:1px solid #999;
   position:relative;
   top:-5px;
}


.form-concent {
   color:#777;
}

.wpcf7-list-item {
   margin:0;
}

.wpcf7-list-item label {
   display:flex;
   align-items:flex-start;
}

.wpcf7-list-item label input {
   margin:5px 5px 0 0;
   cursor:pointer;
}

.form-captcha span {
   color:var(--blau);
   font-weight:500;
}

.form-captcha input {
   width:40px;
   margin-left:15px;
   margin-top:-5px;
   border:1px solid #ccc;
}

.form .button {
   min-width:100%;
}

.form .button input {
   width:130px;
   padding:0 25px!important;
   margin:0 10px;
}

.stellenangebot {
  padding:40px 40px 20px 40px;
  background:white;
  position:relative;
}

.mobile .stellenangebot {
  margin-left:-40px;
}

.stellenangebot .trigger {
  cursor:pointer;
}

.stellenangebot .trigger::after {
  font-family:'Material Icons';
  content:'expand_more';
  //color:var(--blau);
  color:#999;
  font-size:1.6em;
  position:absolute;
  right:15px;
  bottom:0;
}

.stellenangebot .trigger:hover::after,
.stellenangebot .trigger.trigger_active::after {
  color:var(--blau);
}

.stellenangebot .trigger.trigger_active::after {
  transform:rotate(180deg);
}

/* footer */

.footer-kontakt .container {
    position:relative;
}

.footer-kontakt {
    background:var(--hellgrau);
    position:relative;
    padding-top:20px;
}

.logo-verlauf {
    width:220px;
    height:auto;
    position:relative;
}

.zertifikat p {
    padding:7px 0 3px 33px;
    margin:0;
    background:url(img/icon-check.jpg) no-repeat left center;
    background-size:24px auto;
    //font-weight:500;
    font-size:20px;
}

.bottom-links {
    border-top:1px solid #ccc;
    padding-top:40px;
    margin-top:20px;
}

.bottom-links li:not(:last-child) {
    padding-right:40px;
}

@media (min-width: 1000px) {
    
    .footer-kontakt::before {
        content:'';
        width:calc(50vw - 40px);
        height:10px;
        background:var(--blau);
        position:absolute;
        top:0;
        right:0;
    }
    
    .logo-verlauf img {
        __position:absolute;
        __z-index:999;
        __bottom:-120px;
    }
    
    .bottom-links li {
        display:inline-block;
    }
    
}

/* ----------------------------------------
    Helpers
---------------------------------------- */

.link {
   text-decoration:underline var(--blau) solid;
}

.link:hover {
   color:var(--blau);
}

/* image */

.auto-resize img,
img.auto-resize {
    display:block;
    object-fit:cover;
    width:100%;
    height:100%;
}

/* grid */

.grid {
    display:grid;
}

.flex {
    display:flex;
    direction:row;
    flex-wrap:wrap;
}

.align-top {
    align-items:start;
    align-self:start;
    /*flex*/
    align-items:flex-start;
    align-self:flex-start;
}

.align-right {
    justify-items:end;
    justify-self:end;
    /*flex*/
    justify-content:flex-end;
}

.align-bottom {
    align-items:end;
    align-self:end;
    /*flex*/
    align-items:flex-end;
    align-self:flex-end;
}

.align-left {
    justify-items:start;
    justify-self:start;
    /*flex*/
    justify-content:flex-start;
    
}

.align-center {
    justify-items:center;
    justify-self:center;
    /*flex*/
    justify-content:center;
}

.align-middle {
    align-items:center;
    align-self:center;
}

.content-middle {
    display:grid;
    place-content:center;
}

.content-bottom {
    display:grid;
    place-content:end;
}

.content-stretch {
    display:grid;
    place-content:stretch;
}

.content-stretch > :last-child {
    align-self:end;
}

.stretch-x {
    justify-items:stretch;
    justify-self:stretch;
    /*flex*/
    justify-content:space-between;
}

.stretch-y {
    align-items:stretch;
    align-self:stretch;
}

/* Font Helpers */

.lead,.subline {margin-top:-10px;}

.text-center {text-align:center;}

.text-left {text-align:left;}

.text-right {text-align:right;}

.text-justify {
    text-align:justify;
    text-align-last:end;
}

.uppercase {text-transform:uppercase;}

.lowercase {text-transform:lowercase;}

/*mark {background:#ffff00;}*/

/*::selection {background: #ffff00;}*/

.korr-do {background:#ffff00;}

.korr-todo {background:#00e1ff;}

.korr-done {background:#4dff00;}

/*
p.bullet,.list li,.post li {
    padding-left:15px;
    position:relative;
}

.list.lined li {
    padding-top:5px;
    padding-bottom:5px;
    border-bottom:1px dotted #ccc;
}

p.bullet::before,.list li::before, .post li::before {
    content:'•';
    color:#808b96;
    position:absolute;
    left:0;
}
*/

/* list styles */

ul:not(.list-style-none,.lined,.menu,.sub-menu) li {
   padding-left:1rem;
   position:relative;
}

ul:not(.list-style-none,.lined,.menu,.sub-menu) li::before {
   font-family: 'Material Icons';
   color:var(--blau);
   position:absolute;
   top:0;
   left:0;
}

ul:not(.list-style-none,.lined,.menu,.sub-menu) li::before,
ul.i-square li::before {
   content:'stop';
   font-size:0.75rem;
   line-height:2;
   left:-2px;
}

ul.i-circle li::before {
   content:'circle';
   font-size:0.5rem;
   line-height:3
}

ul.i-forward li::before {
   content:'arrow_forward_ios';
   font-size:0.65rem;
   font-weight:bolder;
   line-height:2.2;
   left:-2px;
}


ul.lined {
    border-bottom:1px solid #ccc;
    margin-left:0;
    margin-bottom:20px!important;
}

.lined li {
   border-top:1px solid #ccc;
   padding:10px 0;
}


sup,sub {
    vertical-align:baseline;
    position:relative;
    top: -0.6em;
    font-size:0.6em;
}

sub {
    top: 0.4em;
    font-size:12px;
}

q,.quotes,blockquote {
    quotes:"\201E" "\201C";
}

html[lang="en"] q,html[lang="en"] .quotes,html[lang="en"] blockquote {
    quotes:"\201C" "\201D";
}

html[lang="en"] #de,html[lang="de"] #en {
    display:none;
}

/* float: */

.left {float:left;}

.right {float:right;}

.float-none {clear:both;}

.clear:after {
    content:"";
    display:table;
    clear:both;
}

/* position */

.relative {position:relative;}

.absolute {position:absolute;}

.fixed {position:fixed;}


/* display: */

.hidden {display:none;}

.inline {display:inline;}

.block {display:block;}

.inline-block {display:inline-block;}

/* margin: / padding: */

.ma-0,.mr-0,.mx-0 {margin-right:0;}
.ma-0,.ml-0,.mx-0 {margin-left:0;}
.ma-0,.mt-0,.my-0 {margin-top:0;}
.ma-0,.mb-0,.my-0 {margin-bottom:0;}

.mb-5 {margin-bottom:5px;}

.ma-10,.mr-10,.mx-10 {margin-right:10px;}
.ma-10,.ml-10,.mx-10 {margin-left:10px;}
.ma-10,.mt-10,.my-10 {margin-top:10px;}
.ma-10,.mb-10,.my-10 {margin-bottom:10px;}

.ma-20,.mr-20,.mx-20 {margin-right:20px;}
.ma-20,.ml-20,.mx-20 {margin-left:20px;}
.ma-20,.mt-20,.my-20 {margin-top:20px;}
.ma-20,.mb-20,.my-20 {margin-bottom:20px;}

.pa-0,.pr-0,.px-0 {padding-right:0;}
.pa-0,.pl-0,.px-0 {padding-left:0;}
.pa-0,.pt-0,.py-0 {padding-top:0;}
.pa-0,.pb-0,.py-0 {padding-bottom:0;}

.pa-10,.pr-10,.px-10 {padding-right:10px;}
.pa-10,.pl-10,.px-10 {padding-left:10px;}
.pa-10,.pt-10,.py-10 {padding-top:10px;}
.pa-10,.pb-10,.py-10 {padding-bottom:10px;}

.pa-20,.pr-20,.px-20 {padding-right:20px;}
.pa-20,.pl-20,.px-20 {padding-left:20px;}
.pa-20,.pt-20,.py-20 {padding-top:20px;}
.pa-20,.pb-20,.py-20 {padding-bottom:20px;}

/* border */

.bt-1,.bl-1,.bb-1,.br-1 {border:1px dotted #ccc;}
.bt-0,.bl-1,.bb-1,.br-1 {border-top:0;}
.br-0,.bt-1,.bl-1,.bb-1 {border-right:0;}
.bb-0,.bt-1,.bl-1,.br-1 {border-bottom:0;}
.bl-0,.bt-1,.bb-1,.br-1 {border-left:0;}

.ba-0,.border-0 {border:0;}

hr {
    display:block;
    height:0;
    border:0;
    margin:20px 0;
    border-top:1px solid #ccc;
}