/* General Style */ 
/* JobNinja GmbH*/
/* by Tom Schmid*/
/* Juli 2025 */
/* Arbeitgeber */

@font-face { font-family: 'Syne';font-display:auto;src: url('../font/Syne.ttf') format('truetype'); }
@font-face { font-family: 'Inter';font-display:auto;src: url('../font/Inter-Regular.ttf') format('truetype'); }

html {scroll-behavior: smooth;}
body {font-family: 'Inter', sans-serif;background: #ffffff;margin: 0;padding: 0;color: #171324;}
 body.offer #main{text-align:center;}

h1 {font-size:3em;font-family: 'Syne', sans-serif;margin:1em 0 0.5em 0;padding:0;}
.offer h1, .hire h1{text-align:center;margin: 1em 0 0;}
.blog h1{color:#c10633;}

h1 span{position:relative;}
h1 span::after{  content: "";position: absolute;bottom: 0;left: 0;background-image: url(/templates/jobninja/images/home-hero-stroke.svg);background-size: 100% auto;background-position: 50%;background-repeat: no-repeat;height: 10px;width: 100%;}

h2 {color:#c10633;font-weight: 700;margin: 32px 0 0 0;font-family: 'Syne', sans-serif;}
.hire #main h2{text-align:center;margin:0;padding:0;}
.hire #main .newsflash h2{padding: 0.5em 0; min-height:3em;}
.audience h2{margin:0;}
.info h2{margin:0;}
.offer .info h2{margin: 0 0 1em 0;}
.timeline .timeline-card h2{padding:0 20px 0 40px;}
.hire #main h2.welcome{text-align: left;margin-top:2em;}
h2.top{text-align:center;font-size:57px;margin:0 0 1em 0;}
h2.call{color:#000000;}

h3 {margin:0; padding:0;font-size:1.5rem;font-family: 'Syne', sans-serif;}
.grid-3 h3{color:#c10633;font-size:2rem;}

h4 {margin: 0 0 1em 0;padding: 0;font-weight: 700;font-size: 1.1em;font-family: 'Syne', sans-serif;}

h5 {position: relative;font-weight: 700;font-size: 1em;font-family: 'Syne', sans-serif;}

h6{font-weight:normal;margin:1em 0 0 0;padding:0 0 0 0;font-size:0.9rem;font-family: 'Syne', sans-serif;}

ul li{font-size:1rem;list-style:none;margin-bottom:0.5em;}	
													  
p{line-height: 1.375rem;margin-top: .375rem;}	
p.top{widht:60%;margin:auto;}
.offer p{text-align:center;}										 
a {text-decoration:none;outline:none;font-weight:700;color:#000; font-size:0.9em;}
a.vistied{color:#171324;}
a.tipp{border: 2px solid #171324;border-radius:13px;color: #171324;background: none;padding: 10px 20px;font-weight:500;}
a.tipp:hover{border:2px solid #c10633;color:#c10633;}
																			 

/* Nur sichtbar für Tastaturnavigation */
:focus-visible {
    outline: 3px solid #007acc;
    outline-offset: 2px;
}
/* Fallback für ältere Browser, die :focus-visible nicht unterstützen */
:focus:not(:focus-visible) {
    outline: none;
}
/* Header */ 
.header {transition: all 0.2s ease-in-out;background:#ffffff;width:100%;}
header.sticky {position: fixed;top: 0;left: 0;width: 100%;z-index: 999;transition: all 0.2s ease-in-out;box-shadow: 0 0 5px 5px rgba(100, 100, 100, 0.5);}
header.sticky .banner{padding:10px;font-size:0.8em;}
header .banner .grid-2{grid-column-gap:0;}
header.sticky .banner .grid-2 img{height:3em;}
	
.start .header{background:none;}
.start .banner{background:none;}
.start header.sticky{background:#ffffff;}

/* Main */
#main {margin:0 auto 0;background:#ffffff;}
#main img{max-width:100%;height:auto;}
#main .leistung-top{text-align:center;}
#main .main{width: 90%;max-width:1440px;margin: 0 auto;}
#main article{padding: 0;}
/*.hire #main article{padding:40px 40px 0;}*/
.leistungen #main article p{max-width:1000px; width:90%; margin: 0 auto;}
.leistung #main article p{max-width:1000px; width:90%; margin: 1em auto 0;}
.leistung #main article p.info-text {font-size:1em;margin-top:0;}
.info{background:#f1f1f2;}
#main .info {text-align:left;background:#ffffff;padding:0;}
#main .info .more-info{padding: 40px 0;margin: 0 auto;width:90%;max-width:1440px;text-align:center;}
.bloginfo .more-info{width:90%;max-width:1440px;margin: 0 auto;}
.info .more-info{position:relative;margin:0 24px;}
.bloginfo .more-info{position:relative;margin:0 24px;}
#main .info .more-info-1{background:#f1f1f2;padding:0;}	
.ueber-uns .info .more-info-1 h3{text-align:center;margin: 0 0 1em 0;color:#c10633;font-size:3vw;}
.more-info-1 .blog-cta{padding:0;}

#main .info .more-info-3{background:#ffffff;margin: 0 0 1em 0;}
.ueber-uns #main .info .more-info-3{display:none;}

#main .bloginfo {text-align:left;background:#f1f1f2;padding:0 0 40px 0;}
#main .bloginfo .newsflash-image{text-align:center;}
#main .info .grid-2 .img-grid img{max-height: 13em;width: auto;}
.ueber-uns #main .info img{max-width:100%;height:auto;}
#main .bloginfo img{width: 100%;}

#main .info .bilder-item h2{text-align:center;}
#main article .list h2{font-size:1.3em; margin: 1em 0 0 0;}
#main article .list li{font-size:1.2rem;}

#main button.info{border: 2px solid #171324;color: #171324;background: none;padding:10px 20px;}
#main button.info:hover{border:2px solid #c10633;color:#c10633;}
#main button.info a{font-size: 1rem;}
#main button.info:hover a{color:#c10633;}


#main .info .button-cta{padding:2em 0;text-align:center;}
#main .info .button-cta button.cta,
#main .info .button-cta button.info{margin:0 5% 2em;padding:0.5em 2%}


#main .bloginfo{width:90%;background: #ffffff;border-radius: 40px;max-width: 1440px;margin: 0 auto;}
#main .bloginfo .more-info{width:100%; margin:40px auto 0;border-radius:15px;text-align:center;}
#main .bloginfo .more-info h2.title{margin: 0;}

/* Grid-2 */
.grid-2{display: grid;grid-template-columns: 45% 45%;grid-column-gap:10%;}
#main .grid-2 {margin: 2em auto 0;}
#main .grid-2 .content-left{text-align:right;margin:1em 0 0 0;padding:1em 0 0 0;}
.hire #main .grid-2 .content-left h2{text-align:right;}

#main .info .audience .grid-2,
#main .info .grid-2{grid-template-columns: 100%;grid-row-gap:40px;}
#main .info .audience  .grid-2-item{padding:20px 40px;text-align:left;}
#main .info .audience .grid-2-item img{max-width: 30%;}
#main .info .grid-2 p{text-align:center;margin:1em 0;}
#main .info .more-info .grid-2 p{text-align:left;}
#main .info .grid-2-item{background:#ffffff;padding:32px;border-radius:16px;border: 4px solid #ffffff;transition: all 0.5s;}
/*#main .info .grid-2-item:hover{border:4px solid #c10633;transition: all 0.5s;}*/
.start #main .info .grid-2-item .img-grid,
.hire #main .info .grid-2-item .img-grid{text-align:center;}
.case-study #main .grid-2-item img{max-width:50%;border-radius:15px;}
.case-study #main .grid-2 .top{text-align: center;}
.case-study #main .grid-2-item h2{margin:0;}
.case-study #main .comp .grid-2-item{background:#f1f1f2;border-radius:15px;padding:20px;}
.case-study #main .comp {grid-row-gap:4em;}
.more-info .newsflash, .more-info .custom{margin: 0;}
.more-info #termin {height: 40px;}
	
#main .bloginfo .newsflash-image{margin:0;padding:0;}
#main .autor {display:grid; grid-template-columns: 20% 80%; text-align:left;margin:0 0 1em 0;}
#main .more-info .autor{display:grid; grid-template-columns: 25% 75%;width:80%;height:3em;}

#main .autor img, .ueber-uns #main .info .autor  img{height:3em; width:auto;border-radius:50%;}
#main .autor h3{margin:0 1em;font-size:12px;}
#main article .autor p.name,#main .autor p.name{font-family: 'Syne', sans-serif;min-height:1em;}
#main article .autor p, #main .blog .autor p{margin:0 1em;font-size:12px;}
#main .more-info a.readmore{text-align:right;margin-top:-1em;}
.bilder-item:hover a.readmore{color:#c10633;}
.bloginfo .bilder-item h2{min-height: 1.3em;font-size: 1.3rem;min-height:3em;}
.bilder-item:hover h2 a{color:#c10633;}
/* Grid-3 */
.grid-3{display: grid;grid-template-columns: 100%;grid-row-gap: 40px;}
.offer .grid-3{background: #ffffff; border-radius:15px;padding:20px;}
.grid-3-info{padding:40px;border-radius: 15px;text-align:left;background:#ffffff;border:4px solid #B5B5B5;transition: all 0.5s;}
.offer .grid-3-info{padding:0 40px;}
.grid-3-info:hover{border:4px solid #c10633;transition: all 0.5s;}
.grid-3-info p{text-align:left;}


.grid-3-fakt{display: grid;grid-row-gap: 40px;width:90%;margin: 0 auto 0;grid-column-gap:5%; padding: 20px;}
/*.grid-3-fakt .grid-3-info{padding:20px 40px;}*/

.grid-3-fakt .grid-3-info{padding:20px 40px;border:none;text-align:center;}
/*.grid-3-fakt .grid-3-info p{font-size:1em;}*/

/*.grid-3-fakt .grid-3-info a{border: 4px solid #b5b5b5;background: #b5b5b5;padding: 5px 10px;max-width: 100%;color: #ffffff;border-radius: 10px;display: block;text-align:center;}*/
.grid-3-fakt .grid-3-info a{color: #c10633;width:100%; text-align:center;}

.grid-3-fakt .grid-3-info h3{text-align:center;}
.grid-3-fakt .grid-3-info ul{padding-left:0;}

.grid-3-price{display: grid;grid-row-gap: 40px;width:90%;margin: 0 auto 0;grid-column-gap:5%; padding: 40px 0;}
.grid-3-price .grid-3-info{padding: 30px;}
.offer .grid-3-price .premium{padding: 30px;border:4px solid #c10633;display:block;}
.offer .grid-3-price .premium:hover{border:4px solid #c10633;}
.grid-3-price .grid-3-info p{text-align:center;min-height:0em;margin: 0 0 1em 0;color:#c10633;}
.grid-3-price .grid-3-info h3{text-align: center;}
.grid-3-price .grid-3-info ul{padding-left:0;}
.grid-3-price .grid-3-info:hover{border:4px solid #B5B5B5;}
.grid-3-price .grid-3-info a{border: 4px solid #b5b5b5;padding: 5px 10px;text-align:center; max-width: 100%;border-radius: 10px;background: #b5b5b5;color: #ffffff;display:block;margin: 2em 0 0 0;transition: background-color 0.5s ease,  border-color 0.5s ease; }
.grid-3-price .grid-3-info a:hover{border:4px solid #c10633;background:#c10633;}
.grid-3-price .grid-3-info a.premium,.grid-3-price .grid-3-info a.premium:hover{border: 4px solid #c10633;background: #c10633;padding: 5px 10px;}



p span.price{color:#171324;font-size:1.5em;font-weight:800;line-height:1.5em;}
.offer .price-cta h2{margin:2em auto 1em;}
.offer .price-cta button.cta{font-size:1.5em;}

.price-help{display: grid;grid-template-columns: 49% 49%;width:90%;margin: 0 auto 0;padding: 0;grid-column-gap:2%;}
.grid-3-price .grid-3-info .price-help .grid-item-left p{text-align:right;margin:15px 0 0 0;line-height:0.5em;padding:0;}
.grid-3-price .grid-3-info .price-help .grid-item-right p{text-align:left;margin:0;padding:0;}

/*Grid-3 Test*/
#main .bilder-grid{display: grid;grid-template-columns:100%;grid-column-gap:3%;}
#main .bilder-item{padding: 40px;border-radius: 16px;text-align:left;background:#f1f1f2;border: 4px solid #f1f1f2;}
#main .bilder-item:hover{border: 4px solid #c10633;}
#main .bilder-item p{text-align:left;min-height:5em;}

/* Slider */
.slider{display:none;}
.start .slider{width:90%; max-width:1440px; margin: 3em auto 0;display:inherit;}

.slider h3{font-weight:normal;margin:0 0 2em;}
.slider .grid-2{display: grid;grid-template-columns: 90% 10%;margin: 0;}
.slider .grid-2 .slider-left{}
.start .slider .grid-2 .slider-right{margin:0;}
.slider{display:none;}
.slider button.cta{font-size:1.2rem;border-radius:16px;background: #c10633;}
.slider img{max-width:100%;height:auto;}

/*bearbeitet*/
.blog-cta {text-align:right;margin:40px 0 0;}
button{cursor:pointer;border-radius: 13px;color: #fff;padding: 10px 20px;margin-top: 10px;font-family: 'Syne';color:#c10633;}
.bullet button{border-radius: 13px;color: #fff;padding: 10px 20px;margin-top: 10px;font-family: 'Inter';color:#171324;cursor:auto;}
a button, button a{font-weight:500;text-decoration:none;}

button.cta{border: 2px solid #c10633;background: #c10633;color: #fff;font-size:1rem;}
button.cta:hover{background:#98092f;border: 2px solid #98092f;color:#ffffff;}
button.cta a{color:#ffffff;}
button.cta:hover a{color:#ffffff;}

a.cta{border: 2px solid #c10633;background: #c10633;color: #fff;font-size:1rem;}
a.cta:hover{background:#98092f;border: 2px solid #98092f;color:#ffffff;}
a.cta a{color:#ffffff;}
a.cta:hover a{color:#ffffff;}

/* ende bearbeitet*/

/* Menü */
nav.nav{display:inline-block;text-align:right;}
nav {display:inline-block;margin:0 auto 0;width:100%;}
nav ul {margin:0;/*display:block;padding:13px 0 0 0;*/}
nav ul li {display:inline-block; margin:0 0 0 3%;vertical-align:top; padding:0.5em 0 0 0;margin: 0;}
nav ul li a{text-decoration:none;font-size:0.75rem;font-weight:300;height: inherit;display: inline-block;padding: 0;margin: 0 0 0 10px;box-sizing: border-box;}
nav ul li a.hire-on{border-bottom:3px solid #343434;}
nav ul li a:visited{color:#1e1e1e;}
nav ul li ul{display:none;position:absolute;background:#ffffff;z-index:8000;margin:0;min-width:10%;text-align:left;}
nav ul li.active{border-bottom:2px solid #343434;}
nav ul li:hover ul{display:block;}
nav ul li a.login{font-weight:700;margin:0 0 0 62px;}
.grid-2 nav ul li{}
.banner .top-grid-item{margin: 0;}
 nav.sub{text-align:left;padding:0;}
 nav.sub ul{margin:0;padding:revert;}
 nav.sub ul li {margin: 0 32px 0 0;padding:0.5em 0 0 0;}
 nav.sub ul li a{margin:0;padding:0;font-weight:500;}
 /*neu Nov 2024*/
.desk .nav{display: inline-block;text-align: right;margin: 0 auto;width: 100%;}
.desk .nav {display:inline-block;margin:0 auto 0;width:100%;}
.desk .nav ul {padding:13px 0 0 0;margin:0;}
.desk .nav ul li {display:inline-block; margin:0 0 0 3%;vertical-align:top; padding:0.5em 0 0 0;margin: 0;}
.desk .nav ul li a{text-decoration:none;font-weight:500;height: inherit;display: inline-block;padding: 0;margin: 0 0 0 25px;box-sizing: border-box;}
.desk .nav ul li a.hire-on{border-bottom:3px solid #343434;}
.desk .nav ul li a:visited{color:#1e1e1e;}
.desk .nav ul li ul{display:none;position:absolute;background:#ffffff;z-index:8000;margin:0;min-width:10%;text-align:left;}
.desk .nav ul li.active{border-bottom:2px solid #343434;}
.desk .nav ul li:hover ul{display:block;}
.desk .nav ul li a.login{font-weight:700;margin:0 0 0 62px;}



.audience {background:#f1f1f2;margin: 0 0 1em 0;}
.newsletter{width:90%;max-width:1440px;margin:0 auto;padding:0;}
.info .newsletter .more-info .convertforms {margin: 2em auto;max-width: 100%;border: 1px solid rgba(23, 19, 36, 0.12); border-radius: 16px;padding: 32px;}
.newsletter .more-info .cf-fields{display:grid;grid-template-columns:60% 40%;}
.newsletter .more-info .convertforms .cf-input{border: 1px solid #171324;background: rgba(23, 19, 36, 0.12);font-size:1.5em;}
.newsletter .more-info .convertforms .cf-form-wrap{padding: 0 0 2em 0;}
.cf-btn-text{font-size:1.5em;}

/* Leistungen */
.leistungen #main .info .more-info-1,
.leistungen #main .info .audience{display:none;}

.leistung #main .info .more-info-1,
.leistung #main .info .audience{display:none;}

.leistungen #main .info .more-info{padding: 3em 0 0 0;}
.leistung #main .info .more-info{padding: 3em 0 0 0;}

.leistungen h1, .leistungen #main h2{text-align:center;}
.leistung h1, .leistung #main h2{text-align:center;}


.leistungen ul.check li::before {content: '';display: inline-block;margin-right: 10px;height: 2rem;width: 30px;background-image: url("../images/check.png");background-size: 1.5rem;background-repeat: no-repeat;background-position: bottom;}
.leistung ul.check li::before {content: '';display: inline-block;margin-right: 10px;height: 2rem;width: 30px;background-image: url("../images/check.png");background-size: 1.5rem;background-repeat: no-repeat;background-position: bottom;}

.hire ul.check li::before {content: '';display: inline-block;margin-right: 10px;height: 2rem;width: 30px;background-image: url("../images/check.png");background-size: 1.5rem;background-repeat: no-repeat;background-position: bottom;}
.offer ul.check li::before {content: '';display: inline-block;margin:0 10px -8px 0;height: 2rem;width: 30px;background-image: url("../images/check.png");background-size: 1.5rem;background-repeat: no-repeat;}


.leistungen ul.check li {list-style: none;font-size: 1.2rem;line-height: 2rem;max-width:1000px; width:90%; margin: 0 auto;}
.leistung ul.check li {list-style: none;font-size: 1.2rem;line-height: 2rem;max-width:1000px; width:90%; margin: 0 auto;}

.hire ul.check li {list-style: none;font-size: 1.2rem;line-height: 2rem;max-width:1000px; paddin: 0; margin: 0 auto;}
.offer ul.check li {line-height: 2rem;width: 100%;text-align: left;padding-left: 10px;}

.leistungen #main .leistung-top{text-align:center;}
.leistung #main .leistung-top{text-align:center;}

.leistungen #main img{margin: 0 0 2em 0;}
.leistungen #main .footer img{margin: 0 10px 0 0;}
.leistung #main img{margin: 0 0 2em 0;}
.leistung #main .leistung-all{width:90%; max-width:1000px;margin: 1em auto 0;}
.leistung #main .leistung-all img{margin: 0;}

.leistungen-all .grid-4 .img-grid,
.leistungen-all .grid-4-item h3{text-align:center;min-height:3em;font-size:1.3em;}
.leistungen-all .grid-4-item{border: solid 4px #dddddd;transition: all 0.5s;border-radius:16px;padding: 40px 40px 20px 40px;background:#ffffff;}
.leistungen-all .grid-4-item:hover {border: solid 4px #c10633;transition: all 0.5s;}
.leistungen-all .grid-4 .leis-but{position: relative;text-align: center;}
.leistungen-all img{filter: grayscale(0.9) brightness(1.2);transition: all 0.5s linear;}
.leistungen-all img:hover{filter: grayscale(0) brightness(1);transition: all 0.5s linear;}
.leistung-all img{filter: grayscale(0.9) brightness(1.2);transition: all 0.5s linear;}
.leistung-all img:hover{filter: grayscale(0) brightness(1);transition: all 0.5s linear;}
.leistung #main img.leistungsbilder {margin: 2em auto 0;}

/* Stellen in */
.stellenin #main .bloginfo .more-info{padding:0;}
.stellenin #main .stellen-in-portale  ul li{display: inline;list-style: disc;padding: 0 5% 0 0;}
.stellenin #main .info .more-info{padding:0;}
.stellenin .stellein-item{margin-top: 3em;}
.stellenin #main article {max-width: 1360px;margin: auto;text-align:center;}
.stellenin #main article .recht {text-align:left;}
.stellenin #main img.head-img{border-bottom: 2px solid #c10633;}
#main .stellen-in-portale{margin-top:5em;}
#main .stellenin-grid{display:grid;grid-template-columns:47.5% 47.5%;grid-column-gap:5%;}
#main .stellenin-grid .stellenin-item img{max-width:100%;height:auto;margin:0 0 2em 0;filter:grayscale(0.9) brightness(1.2);transition:all 0.5s linear;}
#main .stellenin-grid .stellenin-item img:hover{filter:grayscale(0) brightness(1);transition:all 0.5s linear;}
.stellenin #main ul{margin:80px 0;}

/* Blog */
.blog-main #main .bilder-item{margin:0 0 40px 0;}
.blog #main{width:90%;max-width:1440px;}
.blog #main article .com-content-article__body{margin:0;}
.blog .main{display:grid;grid-template-columns:100%;padding: 0 40px;}
.blog #main .news-side{margin: 0 20% 0 0;z-index:1;}
.blog #main .news-side .bilder-grid{grid-template-columns:100%;}
.blog #main .news-side .autor{display:none;}
.blog #main .bilder-item{margin-bottom:30px;padding:30px;border: solid 4px #f1f1f2;transition: all 0.5s;}
.blog #main .bilder-item:hover{border: solid 4px #c10633;transition: all 0.5s;}
.blog #main .bilder-item p{min-height:2em;font-size:1rem; line-height:1.2rem;margin: 0 0 0.5em 0;}
.blog .info{position:relative;z-index:5;}
.news-side h2{margin:0;padding:0;font-size:1.1em;}
.blog .news-main{padding:0;margin:0;}
.blog #main .info .more-info,
.blog #main article {text-align:left;}
.blog #main article p{font-size:1.1rem;}
.blog #main article p.fussnote{font-size: 0.9em;color: #4d4d4d;margin: 0 0 2em 0;}
.blog #main .bloginfo .more-info,
.info .more-info{width:90%;max-width:1440px;margin: 0 auto;}
.blog .bloginfo .newsflash{margin:0 40px 1em;}
table{margin:2em auto;width:100%;}
td{width:20%;}

hr #system-readmore{text-align:right;margin-top:-1em;}

.zsiq_theme1 .zsiq_flt_rel{background-color: #ffffff !important;}
.zsiq_theme1 .zsiq_user.siqicon{background-color: #c10633 !important;}

/* Footer */ 
footer{position:relative;background: #98092f;margin:0 auto;color:#ffffff;z-index:400;}
.footer-grid-outer{width:90%;max-width:1440px;margin:0 auto;}
/* .footer-grid{padding: 70px 0;display:flex;flex-direction:row;flex-wrap:wrap;margin: 0 40px;}
.footer-left, .footer-middle, .footer-right{flex:1 1;}*/


footer p{}
footer h5{}
footer h4{}
footer a{color:hsla(0,0%,100%,.72);text-decoration:none;font-weight:400;font-size:1em;}
footer li{color:hsla(0,0%,100%,.72);font-weight:400;font-size:1em;margin: 0 0 20px 0;}
footer a:hover, footer li:hover{color:#ffffff;}
footer li img {height: 1em;width: auto;margin: 0 10px 0 0;}

footer ul{margin:0;padding: 0;}
footer li{list-style:none;}

.footer-grid{padding:70px 0;}

/*hamburger*/
.hamburger {padding: 15px 15px;display: inline-block;cursor: pointer;transition-property: opacity, filter;transition-duration: 0.15s;transition-timing-function: linear;font: inherit;color: inherit;text-transform: none;background-color: transparent;border: 0;margin: 0;overflow: visible;text-align:right;width:90%;}
.hamburger-box {width: 5%;height: 2em;display: inline-block;position: relative;margin-top:1em;}
.hamburger #banner-text{text-align:center;display:inline-block;width:78%;vertical-align:top;}
.hamburger #banner-text #logo{float:none;display:inline-block;width:100%;}
.hamburger-inner {display: block;top: 50%;margin-top: -2px; }
.hamburger-inner, .hamburger-inner::before, .hamburger-inner::after {width: 30px;height: 2px;background-color: #000000;border-radius: 4px;position: absolute;transition-property: transform;transition-duration: 0.15s;transition-timing-function: ease;}
.hamburger-inner::before, .hamburger-inner::after {content: "";display: block; }
.hamburger-inner::before {top: -10px; }
.hamburger-inner::after {bottom: -10px; }
.hamburger--collapse .hamburger-inner {top: auto;bottom: 0;transition-duration: 0.13s;transition-delay: 0.13s;transition-timing-function: cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse .hamburger-inner::after {top: -20px;transition: top 0.2s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), opacity 0.1s linear; }
.hamburger--collapse .hamburger-inner::before {transition: top 0.12s 0.2s cubic-bezier(0.33333, 0.66667, 0.66667, 1), transform 0.13s cubic-bezier(0.55, 0.055, 0.675, 0.19); }
.hamburger--collapse.is-active .hamburger-inner {transform: translate3d(0, -10px, 0) rotate(-45deg);transition-delay: 0.22s;transition-timing-function: cubic-bezier(0.215, 0.61,0.355, 1); }
.hamburger--collapse.is-active .hamburger-inner::after {top: 0;opacity: 0;transition: top 0.2s cubic-bezier(0.33333, 0, 0.66667, 0.33333), opacity 0.1s 0.22s linear; }
.hamburger--collapse.is-active .hamburger-inner::before {top: 0;transform: rotate(-90deg);transition: top 0.1s 0.16s cubic-bezier(0.33333, 0, 0.66667, 0.33333), transform 0.13s 0.25s cubic-bezier(0.215, 0.61, 0.355, 1); }

  /*Accordion*/
.list {width: 100%;width: 70%;margin: 3em auto;}
.list .accordion {width: 100%;display: flex;flex-direction: column;margin: 0 0 2rem 0;}
.list .accordion input {position: absolute;z-index: -1;opacity: 0;}
.list .accordion input:checked ~ label img {transform: translate(0, -50%) rotate(180deg);}
.list .accordion input:checked ~ .content {height: auto;opacity: 1;transform: translate(0, 0);padding: 1em;}
.list .accordion label {width: 98%;background-color: #ffffff;padding: 1rem;border-radius: 1rem;cursor: pointer;transition: all 150ms;position: relative;z-index: 2;color:#171324;border:1px solid #171324;}
.list .accordion label p{font-size: 1.4em;max-width:80%;}
.list .accordion label:hover {background: #ffffff;color: #c10633;border:1px solid #c10633;}
.list .accordion label img {width: 1.5rem;position: absolute;top: 50%;right: 2rem;transform: translate(0, -50%);transition: 350ms all;}
.list .accordion .content {width: 100%;position: relative;z-index: 1;transform: translate(0, -20%);height: 0;opacity: 0;transition: 350ms all;overflow: hidden;}
.list .accordion .content p {padding: 1rem;margin: 0;}
.list .tabelle-2 .icon img{max-width:100%;}

/* Visform */
.vis-form #main article{width:90%;max-width: 1440px;}
.vis-form  .visCSSlabel{font-size:1.2rem;}
.visform input{width:100%;margin: 0 0 1em 0;}
.visform input:not(.btn){border-radius: 5px;font-size: 1.2rem;padding:0.6rem;background: #f7f7f7;border: 1px solid #cdcdcd;box-shadow: 5px 5px 5px #cdcdcd;}
.vis-form .visform input:not(.btn) .field15{font-size: 1rem;}
.visform textarea{width:100%; height:7em;border-radius: 5px;font-size: 1.2rem;padding:0.3rem;background: #f7f7f7;border: 1px solid #cdcdcd;box-shadow: 5px 5px 5px #cdcdcd;margin: 0 0 1em 0;}
.visform input.btn{  border-radius: 10px;font-size: 1.2rem;padding: 1rem;background: #c10633;border: 1px solid #cdcdcd;box-shadow: 5px 5px 5px #cdcdcd;color: #fff;cursor: pointer;transition: all 0.8s ease-in-out;}
.visform input.btn:hover{border: 1px solid #c10633;background:#ffffff;color:#c10633;transition: all 0.8s ease-in-out;}
/*.visform .field17{margin:2rem 0;}
.visform .field17 p{font-size:2rem;color:#c10633;}
.visform .visCSSlabel{width:50%;}	*/
.visform .visCSSlabel{width:100%;margin:1em 0 0.5em;}	
.visform .field3 .inputbox,.visform .field4 .inputbox, .visform .field15 .inputbox{width:5%;}
.visform .visBtnCon{margin-top:4em;}
.visform:not(.bt5):not(.bt4mcindividual):not(.uikit3):not(.uikit2) label.error{font-size:12px;}

/*Webinarformular*/
.webinar h1{color:#c10633;}
.webinar #main article p.fussnote{font-size: 0.9em;color: #4d4d4d;margin: 0 0 2em 0;}
.webinar .vis_mandatory{display:block;}

.webinar .visCSSinput{width:90%;}
.webinar .visform input{width:90%;}
.webinar input.btn {width:50%;}
.webinar .info{display: none;}
.webinar fieldset{border:none;}

/* Display none */
.ueber-uns .audience{display:none;}
.vis-form #main .info .more-info,
.blog-main #main .info .more-info,
.blog #main .info .more-info,
.faq #main .info .more-info{display:none;}

/* Terminvereinbarung Ifram */

.terminvereinbarung {padding-top:40px;}
.infofenster {margin: 0 0 5em 0;}

.vis-form .grid-3{margin:0 0 2em 0;}
.vis-form .visCSStop0 .visCSSbot5{box-shadow:none;}

.azubi2024 .info{display:none;}
.azubi2024 .kontakt .info{display:inline;}


.umfrage .visform .field35 input,
.umfrage .visform .field36 input,
.umfrage .visform .field37 input{width:100%;margin:0;}



.umfrage .visform input{width:2%;box-shadow:none;margin-top:20px;}
.umfrage .visform input.submit-1{width:20%;margin:0;}
.umfrage .visCSSrlinl{display:block;}
.umfrage .visform input:not(.btn) {box-shadow:none;}
.umfrage .visform .visCSStop10 {margin:0;}
.umfrage .visform .label{margin: 0 0 20px 0;}
.umfrage .visform .visCSSlabel{font-size:1.2em;font-weight:700;}

/*IFrame chat GPT*/
iframe.chat{border:solid 1px #eeeeee;box-shadow:10px 10px 10px #dddddd;}
iframe.chat nav.navbar, .chat navbar-expand-lg, .chat navbar-light, .chat bg-light{display:none !important;height:0;}
iframe.chat .navbar > .container-fluid{display:none !important;}
iframe.chat .bg-light {--bs-bg-opacity:0 !important; background-color:ffffff!important;height:0;}

/*BDS-Logo*/
#main img.bds-logo{righ:0;float:right;max-width:20%;height:auto;}

/*Preisliste*/
.grid-preise {display: grid;grid-template-columns: 10% 22.5% 22.5% 22.5% 22.5%;max-width: 1200px;margin: 20px auto;background-color: #ffffff;padding: 20px;border-radius: 8px;box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1);vertical-align:middle;}
.header-preise {background-color: #98092f;color: white;font-weight: bold; font-size: 2em;grid-column: span 5;padding: 10px;text-align: center;letter-spacing:2px;}

.grid-preise-item {padding: 15px;text-align: center;background-color: #ffffff;}
.preis-top {border-bottom: 1px solid #98092f;padding: 1.8em 0 0 0;}
.text-top{padding: 2em 0 0 0;}

.front{font-family: 'Syne', sans-serif;font-size:3em;writing-mode: sideways-lr;grid-area: 2 / 1 / 7 / 1;}
.paket{font-family: 'Syne', sans-serif;font-size:2em;margin:0 0 10px;}
.pakete {font-weight: bold;color: #666;}
.price {margin: 0;font-size: 1.4rem;}
.preis-fn {font-size: 0.8em;color: #888;}
.item-heigh{grid-area: 3 / 5 / 6 / 5;padding: 15px;text-align: center;background-color: #ffffff;padding-top:10px;}
.pl-left{grid-area: 7 / 2 / 7 / 3;}
.pl-right{grid-area: 7 / 4 / 7 / 5;}
/*}
.package-row {display: grid;grid-template-columns: 1fr 1fr 1fr 1fr;gap: 10px;}
*/

.package-row .grid-preise-item {padding: 10px;}

.offer .audience, .offer .bloginfo {display:none;}


	/* Mobile Style */
@media only screen and (min-width:1670px) {
		.start .slider{height:80vh;}
}	
@media only screen and (max-width:1670px) {
		.start .slider{height:40em;}
		
}	
@media only screen and (max-width:1300px) {
	.leistungen-all .grid-4-item{padding:25px;}
	.leistungen-all h3{font-size:1.1em;}
	.leistungen-all button.cta{font-size:0.8em;}
}

@media only screen and (min-width:1300px) {
	.start .slider .grid-2 .slider-right{margin:0 0 0 50px;}
	
	h1{font-size:57px;}
	.start article h1{display: inline-block;}
	h2{font-size:2.5rem;}
	/*p{font-size:1.3rem;}*/
	.slider button.cta{font-size:1.2rem;}

}	
@media only screen and (max-width:1300px) {
		.start #main {padding: 40px 0;}
		.start .slider{height:25em;}
		.start article h1{display: none;}
		.leistungen-all .grid-4{margin: 0 0 5em 0;}
}	

@media only screen and (min-width:1024px) {
	h2 {font-size:1.8rem;}
	.vis-form h2{font-size: 1.5rem;}
	.vis-form #main{width:90%;max-width:1440px;}
	.vis-form .main{margin:0 40px;}
	.visform .active{border: none;max-width: 1000px;margin: 0 auto;}
	.vis-form .formular{max-width: 1000px;margin: 0 auto;}

	body{font-size:16px;}
	p{font-size:1.2rem;}
	.offer .grid-4-item p{font-size: 1em;}
	.footer-grid{position:relative;margin:0 40px;}
	.footer-left, .footer-middle, .footer-right{flex-basis:auto;}	
	.info .more-info, .bloginfo .more-info{margin:0 40px;}
	#main .bilder-grid{grid-template-columns: 31.33% 31.33% 31.33%;}


	.slider .grid-2{grid-template-columns: 40% 70%;}
	/*.bloginfo h2{min-height: 2.3em;}*/
	header .banner{width:90%; max-width: 1440px;top:0;margin:auto;background:#ffffff;padding:24px 0;}
	header .banner .grid-2{display:grid;grid-template-columns:20% 80%;margin:0 40px;}
	header .banner .grid-2 img{height:59px;width:100px;}
	.blog .main{display:grid;grid-template-columns:30% 70%;padding: 0 40px;}
	#main article{padding:40px 40px 0;}
		
	.webinar .field45, .webinar .field46, .webinar .field47, .webinar .field48, .webinar .field49, .webinar .field50{display:inline-block;width:44%;padding:0 5% 0 0;}
	.offer ul.check li {font-size: 1em;}

}	
@media only screen and (max-width:1024px) {
	h2 {font-size:1.5rem;}
	p{font-size:1.1rem;}
		.start .slider{height:20em;}
	body{font-weight:500;background:#fff;margin:0;font-size:12px;overflow-x:hidden;}
	header .banner{width:100%; max-width: 1440px;top:0;margin:auto;background:#ffffff;padding:24px 0;}
	header .banner .grid-2{display:grid;grid-template-columns:20% 80%;margin:0 24px;}
	header .banner .grid-2 img{height:42px;width:auto;}
	.blog .news-main {grid-area:1/1;}
	.blog #main .news-side{margin:0;}
	.blog #main .news-main article{padding:0;}
	.autor .text p{font-size: 1rem;}
	.webinar .field45, .webinar .field46, .webinar .field47, .webinar .field48, .webinar .field49, .webinar .field50{display:block;width:100%;padding:0;}
}	
@media only screen and (min-width:900px) {
	body.start{background-image: url("../images/jobninja.jpg"); background-size: 70% auto;background-repeat:no-repeat;background-position-x: right;background-position-y:3em;}
	#main .info .audience .grid-2,
	#main .info .grid-2{grid-template-columns: 47.5% 47.5%;grid-column-gap:5%;grid-row-gap:5%;}
	.grid-3-price{grid-template-columns: 30% 30% 30%;}
	.grid-3-fakt{grid-template-columns: 30% 30% 30%;}
	.grid-3{display: grid;grid-template-columns: 31.33% 31.33% 31.33%;grid-column-gap:3%;}
	.grid-3-info p{min-height:5em;}
	.grid-3-fakt .grid-3-info p{min-height: 1em;}
	.offer .grid-3-fakt .grid-3-info p{min-height: 4em;}
	.grid-3-fakt .grid-3-info ul{padding-left:0;}
	nav ul li a{font-size:1rem;margin: 0 0 0 32px;}
	.hire #main .grid-2 .content-right img{max-width:70%;}
	.leistungen-all .grid-4{display:grid; grid-template-columns:23.5% 23.5% 23.5% 23.5%;grid-column-gap:2%;margin:0;grid-row-gap:40px;}
	.leistung-all .grid-4{display:grid; grid-template-columns:23.5% 23.5% 23.5% 23.5%;grid-column-gap:2%;margin:0;grid-row-gap:40px;}
	.grid-4-fakt{display:grid; grid-template-columns:23.5% 23.5% 23.5% 23.5%;grid-column-gap:2%;margin:0;grid-row-gap:40px;}
	.grid-4-fakt .grid-4-item {border:none;}
	.offer-all .grid-4-fakt{magrin:3em 0 0 0;}
	.grid-3-fakt .grid-3-info p{font-size:1em;}
	.grid-3-price .grid-3-info h3, .grid-3-fakt .grid-3-info h3{font-size: 1.2em;}
	.grid-3-fakt .grid-3-info p{min-height:5em;text-align: center;}	
	.grid-3-fakt .grid-3-info a{font-size:1em;}
	.grid-3-price .grid-3-info p{font-size: 1em;}
	.grid-3-price .grid-3-info a{font-size:1em;}
	.az-info .grid-3 {grid-row-gap:40px;}

}
@media only screen and (max-width:900px) {
	body.start{background-image:none;}
	#main .info .audience .grid-2, #main .info .grid-2,
	#main .bilder-item{margin: 20px 0;}
	.leistungen-all .grid-4{display:grid; grid-template-columns:48% 48%;grid-column-gap:4%;margin:0 0 18em 0;grid-row-gap:4%;}
	.leistung-all .grid-4{display:grid; grid-template-columns:48% 48%;grid-column-gap:4%;margin:0 0 2em 0;grid-row-gap:2em;}
	.leistungen .leistungen-all .grid-4{margin: 0 0 10em 0;}
	.leistung .leistungen-all .grid-4{margin: 0 0 10em 0;}
	.grid-3-price{grid-template-columns: 100%;}
	.grid-3-fakt{grid-template-columns: 100%;}
	.grid-3-price .grid-3-info h3, .grid-3-fakt .grid-3-info h3{font-size: 1.5rem;}
	.grid-3-fakt .grid-3-info p{text-align: center;}
	.grid-3-fakt .grid-3-info a{font-size:1.5em;}
	.grid-3-price .grid-3-info a{font-size:1.3em;}
 	.offer h2{font-size:2.5em;}   
	.az-info .grid-3 {grid-row-gap:0;}	
	.offer .grid-4-item {margin-bottom:40px;}
	.offer .grid-3 ul.check{margin-top:0; margin-bottom:0;padding-bottom:0;padding-top:0;margin-left:-20px;}
}	

@media only screen and (min-width:700px) {
	.footer-grid{display:grid;grid-template-columns: 23.5% 23.5% 23.5% 23.5%;grid-column-gap: 2%;}
	.slider .grid-2{display: grid;grid-template-columns: 70% 20%;}
	.sub{display:inline-block;width:100%;text-align:right;}
	.hamburger-box{display:none;}
	.hamburger{padding:0;margin:0;}
	#main .stellenin-grid{display:grid;grid-template-columns:21.25% 21.25% 21.25% 21.25%;grid-column-gap:5%;margin: 0 auto 5em;}
	button.content-top{display: inline-block;border:none;margin: 0 1% 1% 0;padding:8px 16px;}
	.hire #main .grid-2 {margin: 2em auto 0;}
	.hire #main .grid-2 .content-left{text-align:right;margin:1em 0 0 0;padding:1em 0 0 0;}
	.hire #main .grid-2 .content-left h2{text-align:right;}
	.hire #main .grid-2{display: grid;grid-template-columns: 45% 45%;grid-column-gap:10%;}
	.mobil-menu{max-width:1440px; margin: -1em auto 1em;}
	.mobil-menu .sub{max-width:90%;}
}

@media only screen and (max-width:700px) {
	.footer-grid{padding: 70px 0;display:grid;grid-template-columns: 48% 48%;margin: 0 40px;grid-column-gap: 40px;}
	.mobil-menu nav{max-height: 0;overflow: hidden;transition: 0.8s ease-out;}
	.mobil-menu nav.is-active{display:inline-block; margin:auto;transition-duration:0.5s;max-height:19em;}
	.mobil-menu nav ul{margin: 0;padding: 5%;display: block;background: #fff;width: 100%;position: relative;text-align:center;z-index: 9;}
	
	
	
	
	nav.sub ul li{width:100%;}
	nav.sub ul li a{padding:0;}
	button.content-top{display: none;}
	.blog .main{padding: 0;}
	.hire #main .grid-2 {margin: 2em auto 0;display: grid;grid-template-columns:100%;grid-column-gap:10%;}
	.hire #main .grid-2 .content-left{text-align:center;margin:1em 0 0 0;padding:1em 0 0 0;}
	.hire #main .grid-2 .content-left h2{text-align:center;}
		.hire #main .grid-2 .content-right img{max-width:100%;}
		.hire #main .grid-2 h2{margin: 1em 0 0 0;}
		.hire #main .grid-2 .content-right{max-width:90%;margin:auto;}
}
@media only screen and (min-width:550px) {
	#main .main{width: 90%;}
	#main .info .more-info{width: 90%;}
	.bloginfo .more-info{width:90%;}
	#main .bloginfo{width:90%;}
	.start .slider{width:90%;}
	.newsletter{width:90%;}
	.blog #main{width:90%;padding:0;margin:0 auto;}
	.info .more-info{width:90%;}
	.footer-grid-outer{width:90%;}
	.vis-form #main article{width:90%;}
	#main .bloginfo .more-info h2.title{margin: 0 40px;}
.more-info .newsflash, .more-info .custom{margin: 0 40px;}
.slider .grid-2{margin: 0 40px;}
.banner .top-grid-item{margin: 0 40px;}
#main article{padding:0 40px 40px;}
.hire #main article{padding:0 40px 0;}
#main .autor{width:50%;}
.blog #main article td p{font-size: 1.1rem;}
nav ul li a{font-size: 1rem;font-weight:500;margin: 0 0 0 25px;}
.leistungen-all .grid-4-item{padding:40px;}
.leistung .leistung-all .grid-4-item{padding:0px;}
	.leistungen-all h3{font-size:1.3em;}
	.leistungen-all button.cta{font-size:1em;}

}

@media only screen and (max-width:550px) {
	.leistungen-all button.cta{font-size:1.8em;}
	header .banner .grid-2{display:grid;grid-template-columns:100%;margin:0 24px;}
	.grid-2 .desk {grid-area: 1/1;}
	header .banner{width:100%; max-width: 1440px;top:0;margin:auto;background:#ffffff;padding:0;}
	.desk nav ul{padding:0 0 13px 0;text-align:center;}
	.logo{text-align:center;widht:50%; text-align:left;}
	.banner .top-grid-item {  margin: -5em 40px 0 0;  position: absolute;  width: 40%;  right: 24px;  text-align: right;}
	.vis-form #main{width:90%;}
	.leistungen-all .grid-4{display:grid; grid-template-columns:100%;grid-column-gap:4%;grid-row-gap:40px;}
	#main .autor{width:80%;}
	.blog #main article td p{font-size: 1rem;}
	/*nav ul li a{font-size: 0.9rem;}*/
	.leistungen-all .grid-4{display:grid; grid-template-columns:100%;grid-column-gap:4%;grid-row-gap:1%;margin: 0 0 17em 0;}
	.footer-grid{margin:0;}
	 .leistung .leistungen-all .grid-4 {
    margin: 0 0 36em 0;
  }
}


.dot {display: inline-block;width: 10px;height: 10px;border-radius: 50%;background-color: red;margin:1px 4px 0 0;}
.gallery {display: flex;flex-wrap: wrap;justify-content: space-between;}
.gallery img {max-width: 100%;height: auto;margin-bottom: 20px;}
.category {cursor: pointer;margin-right: 20px;font-weight: bold;}
.category.active {color: red;}
.image {display: none;}
.image.active {display: block;}
.transition {transition: opacity 0.3s ease-in-out;}