/*!
Theme Name: Huber&Ranner
Theme URI: https://jobs.hubertranner.de/
Author: wald.pixel.werk
Author URI: https://waldpixelwerk.de/
Description: Theme für HR
Version: 1.0.0
Tested up to: 8.4
Requires PHP: 7.2
License: GNU General Public License v2 or later
License URI: LICENSE
Text Domain: tn
Tags: custom-menu, translation-ready
*/

@charset "UTF-8";

/* inter-regular - latin */
/* inter-regular - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 400;
  src: url('./fonts/inter-v20-latin-regular.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-500 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 500;
  src: url('./fonts/inter-v20-latin-500.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Inter';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/inter-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* inter-700 - latin */
/* manrope-700 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 700;
  src: url('./fonts/manrope-v20-latin-700.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}
/* manrope-800 - latin */
@font-face {
  font-display: swap; /* Check https://developer.mozilla.org/en-US/docs/Web/CSS/@font-face/font-display for other options. */
  font-family: 'Manrope';
  font-style: normal;
  font-weight: 800;
  src: url('./fonts/manrope-v20-latin-800.woff2') format('woff2'); /* Chrome 36+, Opera 23+, Firefox 39+, Safari 12+, iOS 10+ */
}


body{
--black:#000;
--white:#ffffff;
--yellow:#E6BF00;
--blue:#03305E;
	--heatherblue:#365a7e;
--heather:#F0F6DD;
--grey:#707070;
--lineheight:1.6em;
--font:1.15vw;
--fontbig:1.36em;
--h1:4.6em;
--h2:4.6em;
--h3:4.6em;
--container:90vw;
}

@media (orientation: portrait){

  body{
--lineheight:1.5em;
--font:2.7vw;
--fontbig:1.5em;
--h1:3em;
--h2:2em;
--h3:1.25em;
--container:90vw;
}
}



/* Global */

body, html{
font-family: "Inter", sans-serif;
font-weight: 400;
font-style: normal;
width:100vw;
text-rendering: geometricPrecision;

padding:0;margin:0;left:0;top:0;position:relative;font-size:var(--font);line-height:var(--lineheight);font-weight:400;background-color:var(--blue);color: var(--white);white-space-collapsing:discard;min-height:100dvh;}
* { box-sizing: border-box; }


a, a:link{text-decoration:unset;color:var(--white);}
h1 , h2, h3{
  font-family:"Manrope";
  font-weight:800;
    display: block;
    font-size:var(--h1);
    margin-block-start: 0em;
    line-height:1.3em;
    letter-spacing:0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    text-transform:uppercase;
}

h1 img{height:0.93em;
transform: translateY(0.03em);}
h1 img.small {
    height: 0.8em;
    transform: translateY(0.03em);
}

h3{font-size:2.3em;line-height:1.4em; text-transform:unset}
.line{width:2px;position: absolute;overflow:hidden;}
.line-inner{height:10000px;background-color:var(--yellow);width:100%}
.container{position: relative;display:block;width:100%;text-align:center;}
.container-inner{width:var(--container);text-align:left;display: inline-block;position: relative;}

.gradient, .hero-gradient{background: linear-gradient(
  to bottom,
  rgba(3, 48, 94, 1),
  rgba(3, 48, 94, 0) 100%
);
position:absolute;width:100%;height:12em}

.button{border:solid 2px var(--yellow);padding:0.6em 2.5em;font-size:var(--fontbig);line-height:1em;box-shadow: rgba(230, 191, 0, 0.5) 0em 0 0.5em;transition: color .2s ease}
.button:hover{color:var(--yellow)}
.outline {
    color: var(--blue);
    -webkit-text-stroke: 0.1em white;
    paint-order: stroke fill;
    letter-spacing: 0.05em;
    font-size: 0.9em;
    transform: translateY(-0.05em);
    font-weight: 700;
    display: inline-block;
}

img{max-width:100%}
header{position:fixed;top:0;left:0;width:100%;display: block;z-index:999;background: linear-gradient(to bottom, rgba(3, 48, 94, 1), rgba(3, 48, 94, 0) 100%);}
.logo{width:12em;float:left;display: inline-block;transition:width .3s ease}
header.scroll .logo{width:5em}
.logo img{width:100%;}
.navigation{float:right;margin-top:4em;display: inline-block;transition:margin .3s ease}
header.scroll .navigation{margin-top:1em}
.navigation a{padding:0.3em 0em;}
.navigation a:after {
    content: "";
    position: relative;
    display: inline-block;
    height: 1.3em;
    background-color: var(--white);
    width: 1px;
    margin-right: 1em;
    margin-left: 1em;
    transform: translateY(0.3em);
}
.navigation a:last-of-type{padding-right:0}
.navigation a:last-of-type:after{display:none}

.stoerer{position: fixed;right:-3em;width:20em;z-index:9;bottom: 2em;opacity: 0;pointer-events: none;transition:opacity .3s ease}
.stoerer.active{opacity:1;pointer-events: auto}
.stoerer img{width:100%;}

.start-hero{width:100%;}
.hero-image{width:100%;height:100%;position: absolute;left:0;top:0}
.hero-image img, .hero-image video{width:100%;height:100%;position: absolute;left:0;top:0;object-fit: cover}

.hero-gradient-top{left:0;top:0}
.hero-gradient-bottom{left:0;bottom:-1px;transform:rotate(180deg);height:35em}
.start-hero .container{height:auto}
.hero-content {
    position: relative;
    margin-top: 35em;
    padding-bottom:5em;
}


.hero-content h1{margin-bottom:3rem}

.start-kurz-headline{margin-top:7em}

.start-kurz-line{left:8em;height:10em;top:-3em}

.start-kurz-text-image{width:100%;display:inline-block;position:relative;margin-top:4em}
.start-kurz-text-image .text{width:52%;display: inline-block;padding:0;float:left;z-index:2;position: relative;}
.start-kurz-text-image .image{position:absolute;right:0;top:0;width:60%;z-index:1;height:100%;}
.start-kurz-text-image .image img{width:100%;height:100%;object-fit: cover}
.image-gradient{width:20em;height:100%;background: linear-gradient(
  to right,
  rgba(3, 48, 94, 1),
  rgba(3, 48, 94, 0) 100%
);}

.start-dazu-headline{margin-top:7em}

.start-dazu-singles{ margin-top:5em;display: grid;
  grid-template-columns: repeat(3, 1fr);
  gap: 8em;}
.start-dazu-single-nr{color:#2f5073;font-size:15em;line-height:1em;position:absolute;z-index:1;font-family:"Manrope";transition:color .5s ease}
.start-dazu-single-text{padding:5em 0 3em 4em;position: relative;z-index:2;transition:transform .5s ease}
.start-dazu-single-head{color:var(--yellow);font-weight:700;width:100%;margin-bottom:0.5em;display:inline-block;}

.start-dazu-single:hover .start-dazu-single-nr{color:var(--yellow)}
.start-dazu-single:hover .start-dazu-single-text{transform:translateX(5em)}

.start-dazu-line {
    right: 8em;
    height: 22em;
    top: 0.8em;
}
.start-arbeitsbereiche-line{right:8em;height:26em}

.start-arbeitsbereiche-headline{margin-top:15em;}
.start-arbeitsbereiche-singles{margin-top:4em;}
.start-arbeitsbereiche-singles .start-kurz-text-image{margin-bottom:3em;margin-top:0;display: inline-block;padding:1.5em 0}
.start-arbeitsbereiche-singles .text h3{margin-bottom:2.8rem}
.start-arbeitsbereiche-singles .text {width:40%;float:right;margin-bottom: 1em;}
.start-arbeitsbereiche-singles .image{width:70%;left:0;}
.start-arbeitsbereiche-singles .start-kurz-text-image:nth-child(even) .text{float:left}

.start-arbeitsbereiche-singles .image{width:65%;left:0;}
.start-arbeitsbereiche-singles .start-kurz-text-image:nth-child(even) .image{left:35%}
.text-text{display: inline-block;margin-bottom:2.8em}


.start-arbeitsbereiche-singles .start-kurz-text-image:nth-child(odd) .image-gradient {
right:0;left:unset;
    height: 100%;
    background: linear-gradient(to left, rgba(3, 48, 94, 1), rgba(3, 48, 94, 0) 100%);
}


.start-aktuell-headline{margin-top:7em;}

.start-aktuell-singles{margin-top:5em}
.start-aktuell-single a{border:solid 2px var(--white);padding:0.5em 1.5em;width:100%;transition:all .3s ease;display: inline-block;font-size:var(--fontbig)}
.start-aktuell-single{margin-bottom:0.5em}
.start-aktuell-single a:hover{border:solid 2px var(--yellow);color:var(--yellow);font-weight:700}

.start-aktuell-line {
    right: 23em;
    height: 27em;
    top: -3.6em;
}

.start-ansprech-headline{margin-top:9em;}

.start-ansprech-person{margin-top:5em;font-size:var(--fontbig);margin-bottom:2em;display:inline-block;}
.start-ansprech-person-image{width:22rem;height:22rem;float:left;display: inline-block;margin-right:5em;}
.start-ansprech-person-image img{width:100%;height: 100%;object-fit: cover;}
.start-ansprech-person-text{display:inline-block;width:20em;}
.start-ansprech-person-kontakt-single a{transition:color .3s ease}
.start-ansprech-person-kontakt-single img{height:1.5em;margin-right:1em;transform:translateY(0.5em);transition:filter .3s ease;filter:grayscale(1);}
.start-ansprech-person-kontakt-single a:hover{color:var(--yellow)}
.start-ansprech-person-kontakt-single a:hover img{filter:grayscale(0);}
.start-ansprech-person-head{font-size:2.3rem;margin-bottom:0.6rem;display: inline-block;}
.start-ansprech-person-kontakt{margin-top:2em;}
.start-ansprech-person-kontakt-single{margin-bottom:0.2em}

.start-ansprech-line{left:7.5em;top:1em;height:8em;}
.start-ansprech-line-2{left:7.5em;top:15.2em;height:6em;}



.mobile-only{display: none}



.aus-hero-image{width:100%;position:absolute;height:100%;left:0;top:0;}
.aus-hero-image img{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;opacity:0;transition:opacity .4s ease}
.aus-hero-image img.cur{opacity:1}

.aus-hero-content{margin-top:30em;position:relative;}
.aus-hero-pagination{margin-bottom:2em;text-align:right;}
.aus-hero-pagination-dot, .blick-pagination-dot{border:solid 1px white;width:1em;height:1em;border-radius:50%;display:inline-block;margin-left:0.2em;cursor:pointer;}
.aus-hero-pagination-dot.cur, .blick-pagination-dot.cur{border:solid 1px var(--yellow);background-color:var(--yellow)}
.aus-hero-right{position:absolute;right:0;top:4.5em;text-align:right}
.aus-hero-right img{margin-left:0.5em;height:2em;}
.aus-hero-right-text{margin-bottom:1em;font-weight:700}
.aus-hero-text{width:50%;margin-bottom:5em;margin-top:2em}
.aus-aktuell-headline{margin-top:12em;}

.aus-aktuell-line{
    height: 10em;
    top: 2em;
    left: 8.5em;
}
.aus-aktuell-singles .start-aktuelles-single{margin-bottom:0.5em}
.start-aktuelles-single-title{border:solid 2px var(--white);padding:0.5em 1.5em;width:100%;transition:all .3s ease;margin-bottom:;display: inline-block;font-size:var(--fontbig);cursor:pointer}
.start-aktuelles-single-title:hover, .cur .start-aktuelles-single-title{border:solid 2px var(--yellow);color:var(--yellow);font-weight:700}

.aus-aktuell-singles{margin-top:4em}
.start-aktuelles-single-content{height:0;transition:height .3s ease;width:100%;overflow:hidden}
.start-aktuelles-single-content-inner{border:2px solid white;background-color:#8196ad;color:var(--blue);padding:1em;font-weight:700}
.start-aktuelles-single-content-inner li{color:#fff;font-weight:400}


.aus-weiter-headline{margin-top:12em;}

.aus-weiter-numbers{display:inline-block;width:100%;margin-top:7em}
.aus-weiter-number{width:20%;display:inline-block;float:left;margin-right:6.666%;position:relative;}
.aus-weiter-number:last-of-type{margin-right:0}
.aus-weiter-number:after{content:"";height:2px;width:5em;background-color:#8196ad;top:3em;left:100%;}
.aus-weiter-number-number{color:#365a7e;font-size:15em;line-height:1em;position:relative;z-index:1;font-family:"Manrope";transition:color .5s ease}
.aus-weiter-number-text {
    color: var(--yellow);
    position: absolute;
    left: 6.5em;
    transition: transform .4s ease;
    text-align: center;
    width: 10em;
    font-weight: 700;
    top: 8em;
	z-index:3
}
.aus-weiter-number-icon {
    left: 9em;
    width: 5em;
    height: 5em;
    position: absolute;
    top: 2em;
	transition:transform .4s ease
}
.aus-weiter-number-icon .icon, .aus-weiter-number-icon .icon-hover{position:absolute;left:0;top:0;width:100%;height:100%;object-fit:cover;}

.aus-weiter-number-icon .icon{opacity:1}
.aus-weiter-number-icon .icon-hover{opacity:0}
.aus-weiter-number:hover .aus-weiter-number-number{color:var(--yellow)}
.aus-weiter-number:hover .aus-weiter-number-text{transform:translateX(1em)}
.aus-weiter-number:hover .aus-weiter-number-icon{transform:translateX(1em);}
.aus-weiter-number:hover .aus-weiter-number-icon .icon{opacity:0}
.aus-weiter-number:hover .aus-weiter-number-icon .icon-hover{opacity:1}

.aus-weiter-line {
    right: 10em;
    height: 25em;
    top: 0.5em;
}

.aus-bewerben-headline{margin-top:10em;}

.aus-bewerben-line{left:11em;height:10em;top:-2em}

.aus-arbeitsbereiche .start-arbeitsbereiche-singles .start-kurz-text-image {
    margin-bottom: 3em;
    display: inline-block;
    padding: 7.5em 0 6em 0;
}

.aus-arbeitsbereiche-line {
    right: 10em;
    top: -7em;
    height: 44em;
}

.aus-blick .start-arbeitsbereiche-headline{margin-top:8em;}



.aus-blick-line {
    top: -11em;
    left: 10em;
    height: 18em;
}

.aus-ansprech-line{right:10em;top:1em;height:22em;}
.aus-blick video{width:100%;margin-top:5em}


.blick-image{width:100%;margin-top:3em;height:45em;}
.blick-image img{opacity:0;transition:opacity .3s ease;width:100%;height:100%;object-fit:cover;position:absolute;left:0;top:0;}
.blick-image img.cur{opacity:1}
.blick-image-container{position:relative;}
.blick-pagination{position:absolute;right:2em;bottom:1em;}

.form-grid{margin-top:1em;  display: grid;
    grid-template-columns: repeat(2, 1fr);
	gap: 0.5em 2em;
}

.form-grid div div:nth-child(2){display: inline-block;;
  width:30%;
	float:left
}

.form-grid div div:nth-child(3){display: inline-block;;
width:calc(70% - 2em);
	float:right
}


 form p {
    display: block;
    margin-block-start: 0em;
    margin-block-end: 0em;
    margin-inline-start: 0px;
    margin-inline-end: 0px;
    unicode-bidi: isolate;
}

/* Basis-Formfelder */
form input:not([type="submit"]):not([type="button"]):not([type="reset"]),
form textarea,
form select {
  width: 100%;
  box-sizing: border-box;

  border: 2px solid var(--white);
  background: var(--blue);
  color: var(--white);
font-family:"Inter";
	font-size:var(--font);
  padding: .5em;
	margin-top:0.6em;
	margin-bottom:1em;
  font-family: inherit;

  outline: none;
}
.form-add {
    color: var(--heatherblue);
    margin: 0.5em 0 2em 0;
    display: inline-block;
}
form select {
  appearance: none;
  -webkit-appearance: none;
  -moz-appearance: none;

  background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' width='12' height='8' viewBox='0 0 12 8' fill='white'%3E%3Cpath d='M1 1l5 5 5-5' stroke='white' stroke-width='2' fill='none'/%3E%3C/svg%3E");

  background-repeat: no-repeat;
  background-position: right 1.2em center; /* ← Abstand vom Rand */
  background-size: 1em;
  
  padding-right: 3em; /* Platz für Pfeil */
}
form input[type="date"] {
  color-scheme: dark;
}
/* Placeholder-Farbe */
form input::placeholder,
form textarea::placeholder {
  color: var(--heatherblue);
  opacity: 1; /* wichtig für Firefox */
}

/* Optional: Focus-State (sieht meist besser aus) */
form input:focus,
form textarea:focus,
form select:focus {
  border-color: var(--yellow);
}

/* Submit/Buttons wie .button */
form input[type="submit"],
form button[type="submit"],
form input[type="button"],
form button {
  border: solid 2px var(--yellow);
  padding: 0.6em 2.5em;
  font-size: var(--fontbig);
  line-height: 1em;
  box-shadow: rgba(230, 191, 0, 0.5) 0em 0 0.5em;
  transition: color .2s ease;

  background: transparent; /* oder var(--blue), falls du ihn gefüllt willst */
  color: var(--white);
  font-family: inherit;

  cursor: pointer;
}

/* Hover wie .button:hover */
form input[type="submit"]:hover,
form button[type="submit"]:hover,
form input[type="button"]:hover,
form button:hover {
  color: var(--yellow);
}

footer{background-color:var(--white);}
footer .container-inner{height:7em}
.footer-content{width:15em;padding:2.3em;float:right;display: inline-block;bottom:1.5em;position: absolute;right:0;background-color:var(--white);text-align:center;font-weight:500}
.footer-content a{color:var(--blue);display:inline-block;margin-top:0.5em;}
.footer-content a img{margin:0.2em;width:1.8em;margin-top:0.5em}


.vertrieb-mehr-headline{margin-top:10em}
.vertrieb-mehr-singles{margin-top:5em;display:grid;  grid-template-columns: repeat(2, 1fr);
	gap: 5em 12em;margin-bottom:4em;}

.vertrieb-mehr-single-image{width:3em;height:3em;margin-right:1em;display:inline-block;}
.vertrieb-mehr-single-image img{width:100%;height:100%;object-fit:contain}
.vertrieb-mehr-single-head{display:inline-block;margin-top:0;}
.vertrieb-mehr-single-head h3{transform:translateY(-0.5rem)}
.vertrieb-mehr-single-text{margin-top:1em;width:100%;display:inline-block;}

.vertrieb-hero-content h1{margin-bottom:1em;}
.vertrieb-text-image{margin-top:8em;}
.vertrieb-aktuell-line {
    height: 27em;
    top: -1em;
    left: unset;
    right: 15em;
}

.vertrieb-bewerben-line {
    left: 11em;
    height: 7em;
    top: 2em;
}


.datenschutz-content .container-inner{margin-top:2em;margin-bottom:10em;width:70%;margin-right:20%}

@media (orientation: portrait){
	.datenschutz-content .container-inner{width:90%;margin-right:0}

.burger-menu {
        z-index: 3;
        position: absolute;
        right: 0;
        top: 0.5em;
        font-size: 3em;
        pointer-events: auto;
        cursor: pointer;
    }
.burger-menu-text{font-size:var(--fontsmall);line-height:1.45em;color:var(--white);transition: opacity .5s ease, color .3s;margin-right:1em;}
.heather .burger-menu-text{color:var(--dblue)}
.burger-menu-icon{width:1em;height:1em;display:inline-block;position:relative;transform:translateY(0.48em)}
.burger-menu-icon-line{width:100%;height:1px;background-color:var(--white);position:absolute;top:0.3em;transition:transform .5s, background-color .3s}
.burger-menu-icon-line.line-1{transform:translateY(-0.3em)}
.burger-menu-icon-line.line-3{transform:translateY(0.3em)}

.heather .burger-menu-icon-line{background-color:var(--dblue)}
.header.active .burger-menu-icon-line{background-color:var(--white)}
.header.active .burger-menu-icon-line.line-1.step1{transform:translateY(0)}
.header.active .burger-menu-icon-line.line-2.step1{transform:translateY(0)}
.header.active .burger-menu-icon-line.line-3.step1{transform:translateY(0)}

.header.active .burger-menu-icon-line.line-1.step2{transform:translateY(0) rotate(45deg)}
.header.active .burger-menu-icon-line.line-2.step2{transform:translateY(0) rotate(45deg)}
.header.active .burger-menu-icon-line.line-3.step2{transform:translateY(0) rotate(-45deg)}



  .mobile-only{display: inline-block;}
.start-dazu-singles {
    margin-top: 5em;
    display: grid;
    grid-template-columns: repeat(2, 1fr);
    gap: 5em;
}

.start-dazu-single:hover .start-dazu-single-nr{color:#2f5073}
.start-dazu-single:hover .start-dazu-single-text{transform:translateX(0em)}


.start-arbeitsbereiche-singles .text, .start-kurz-text-image .text {
    width: 100%;
    text-align:center;
    float: right;
}

.start-kurz .start-kurz-text-image .text{padding-bottom:7em;text-align: left}
.start-arbeitsbereiche-singles .image, .start-kurz-text-image .image {
    width: 100%;
    left: 0 !important;
display: inline-block;
    position: relative;
    top: -6em;
}
.image-gradient {
    width: 100% !important;
    height: 15em !important;
    margin-top: -1px;
    background: linear-gradient(to bottom, rgba(3, 48, 94, 1), rgba(3, 48, 94, 0) 100%) !important;
}
.text-text {
    display: inline-block;
    margin-bottom: 4.8em;
}
.start-arbeitsbereiche-singles .start-kurz-text-image{margin-bottom:0}
.start-arbeitsbereiche-singles .start-kurz-text-image{padding:0}


.start-aktuell-single a {
    padding: 1em;}


    .start-arbeitsbereiche-line {
    right: 8em;
    height: 14em;
}

.start-aktuell-line {
    right: 23em;
    height: 9em;
    top: -3.6em;
}

.start-dazu-line {
    right: 8em;
    height: 23em;
    top: -4.2em;
}

.start-kurz-line {
    left: 8em;
    height: 8em;
    top: -2.3em;
}


.start-ansprech-line {
    left: 7.5em;
    top: 1em;
    height: 7em;
}

.start-ansprech-line-2 {
    left: 7.5em;
    top: 14.2em;
    height: 4em;
}

.start-ansprech-person-text {
    display: inline-block;
    width: 20em;
    margin-top: 2em;
}

.footer-content img{display: none}
.footer-content a img{display: inline-block}

.start-ansprech-person {
    margin-top: 5em;
}

header.scroll .logo, .logo
 {
    width: 9em;
    z-index:3;
    position: relative;
}


.navigation a {
  width:100%;display: inline-block;
  margin:1em 0;
  font-size:2em;
}
.navigation a:after {
display:none;
}
header.active .navigation{top:0;opacity: 1}

    .navigation {
        z-index: 2;
        position: absolute;
        top: -100dvh;
        transition:all 0.7s ease;
        left: -5vw;
        width: 100vw;
        height: 100dvh;
        background-color: var(--blue);
        margin: 0 !important;
        text-align:center;
        opacity:0;
    }
.navigation-container{position:absolute;top:50%;transform:translateY(-50%);width:100%;}

    .aus-aktuell-line {
        height: 8.5em;
        top: 2.5em;
        left: 8.5em;
    }
	
	    .aus-weiter-numbers {
        margin-top: 5em;
        display: grid;
        grid-template-columns: repeat(2, 1fr);
        gap: 5em;
    }
	
	.aus-weiter-number {
    width: 100%;
    display: inline-block;
    float: left;
    margin-right: 0;
    position: relative;
}
	
	
	.aus-weiter-line {
    right: 10em;
    height: 10em;
    top: 1em;
}
	
	
	.aus-weiter-number-icon {
    left: 8.5em;
    width: 5em;
    height: 5em;
    position: absolute;
    top: 2em;
    transition: transform .4s ease;
}
	
	.aus-weiter-number-text {
    color: var(--yellow);
    position: absolute;
    left: 5.5em;
    transition: transform .4s ease;
    text-align: center;
    width: 10em;
    font-weight: 700;
    top: 8em;
    z-index: 3;
}
	
	
	.form-grid {
    margin-top: 1em;
    display: inline-block;
    width: 100%;
}
	
	.form-grid div{display:inline-block;width:100%}
	
	.aus-arbeitsbereiche-line {
    right: 10em;
    top: -7em;
    height: 21em;
}
	
	.aus-hero-right-text{display:none;}
	
	.aus-hero-text {
    width: 100%;
    margin-bottom: 5em;
    margin-top: 2em;
}
	
	.aus-hero-right {
    position: absolute;
    right: 0;
    top: 20.5em;
    text-align: right;
    top: unset;
    bottom: -1em;
}
	
	.aus-arbeitsbereiche .start-arbeitsbereiche-singles .start-kurz-text-image {
    margin-bottom: 0em;
    display: inline-block;
    padding: 3.5em 0 0em 0;
}
	
	.aus-blick-line {
    top: -4em;
    left: 10em;
    height: 10em;
}
	
	.aus-ansprech-line {
    right: 10em;
    top: 1em;
    height: 7em;
}
	
	
	.start-ansprech-person-image {

    margin-right: 0em;
}
	footer {
    margin-top: 5em;
}
	
	
	.vertrieb-mehr-singles{display:inline-block;width:100%}
	
	.vertrieb-aktuell-line {
    height: 17em;
    top: -3em;
    left: unset;
    right: 15em;
}
	
	.vertrieb-mehr-single{margin-bottom:5em}
	
	.vertrieb-mehr-singles {
    margin-bottom: 0em;
}
	
	.blick-image {
    width: 100%;
    margin-top: 3em;
    height: 25em;
}
	
}