
/* Scrollbar Browser - Farbe anpassen - Start */
html,body{
    scrollbar-color: rgba(33, 40, 48,1) transparent !important;
}

::-webkit-scrollbar {
    width: 16px;
    height: 16px; }

::-webkit-scrollbar-thumb {
    background-color: rgba(33, 40, 48, 1);
    -webkit-box-shadow: inset 1px 1px 0 rgba(33, 40, 48,0.10),inset 0 -1px 0 rgba(33, 40, 48,0.07);
}
/* Scrollbar Browser - Farbe anpassen - Ende */

/* Generelle Designanpassungen - START */

/* Selectionfarbe anpassen - Auswahlfarbe -> Mausmarkierung*/
::selection {
	background-color: hsl(212, 19%, 16%, 0.8);
	color: white;
}

/* Text zentrieren */
.center-text {
	text-align: center;
}

/* Text linksbündig erzwingen (Mobil / Tablet) */
@media only screen and (max-width: 1024px) {
	.force-text-align-left-mobile {
		text-align: left;
	}
}

/* Content zentrieren */
.center-content {
	display: grid;
	justify-content: center;
}

/* Display Grid - Justify-content: unset*/
.display-grid {
	display: grid;
	justify-content: unset;
}

/* Content zentrieren ohne Display: Grid --> Margin Inline - Auto (Desktop) */
@media only screen and (min-width: 1025px) {
.margin-inline {
	margin-left: auto !important;
	margin-right: auto !important;
}
}

/* Heroshot Designfixes - START */
/* Heroshot / Bild - Abstand Top (Tablet) */
/*
@media only screen and (min-width: 641px) and (max-width: 1024px) {
.heroshot-ratgeber {
	margin-top: 20vh !important;
}
}
*/

.heroshot-ratgeber {
	margin-right: 0 !important;
	margin-left: 0 !important;
}

/* Teasertext - Heroshot/Above-Fold-Bild - START */
@media only screen and (min-width: 1025px) {
	.teasertext-heroshot {
		position: absolute;
		width: 70% !important;
		/*top: 40%;*/
	}
}
	
@media only screen and (min-width: 1025px) and (max-width: 1440px) {
	.teasertext-heroshot {
		left: 5% !important;
		/*top: 47.5%;*/
	}
}
@media only screen and (min-width: 1441px) and (max-width: 1620px) {
	.teasertext-heroshot {
		left: -5% !important;
	}
}
@media only screen and (min-width: 1621px) and (max-width: 1790px) {
	.teasertext-heroshot {
		left: -10% !important;
	}
}
@media only screen and (min-width: 1791px) {
	.teasertext-heroshot {
		left: -15% !important;
	}
}

/* Teasertext - Heroshot/Above-Fold-Bild - ENDE */
/* Heroshot Designfixes - ENDE */

/* Keyfeatures anpassen (KI, Großes Jobnetzwerk, Full Services - Startseite) - START */
#kt-layout-id_f5e864-08 {
	margin-top: -190px;
}

#kt-layout-id_8609af-0b > .kt-row-column-wrap {
	padding-top: 25px;
}

@media only screen and (min-width: 1440px) {
	#kt-layout-id_f5e864-08 {
		height: 24vh;
	}
}

/* Border von Top bis Bottom ziehen */
.keyfeature-element > div {
	margin-bottom: 0 !important;
}

/* Keyfeature - Abstand Bottom (Mobile) */
@media only screen and (max-width: 640px) {
	.keyfeature-full-service {
		padding-bottom: 10vh;
	}
}
/* Keyfeatures - ENDE */

/* Padding hinzufügen - START */
/* Tablet / Mobile*/
@media only screen and (max-width: 1024px) {
	.padding-content {
		padding: 0 6% 0 6%;
	}
}
/* Desktop */
@media only screen and (min-width: 1025px) {
	.padding-content, #accordion-section > div {
		padding: 0 20% 0 33.3%;
	}
}
/* Padding hinzufügen - ENDE */

/* WIDGET - Ersten Buchstaben ROT färben */
.widget_pages li, .widget_nav_menu li::first-letter{
   color: red;
}

/* Schriftfarbe Weiß */
.color-white, .color-white span mark { 
	color: white !important;
}

/* Scroll UP - Position anpassen */
#kt-scroll-up{
	bottom: 95px;
	right: 34px !important;
}

/* Schriftfarbe - Mehr erfahren (LINK) */
.color-red {
	color: #d71f27 !important; 	
}
.color-red:hover, .color-red:hover .arrow-learn-more {
	color: white !important;
	stroke: white !important;
}

/* Overlay design element - START */
.header-bild-design-element{
	position: absolute;
	bottom: -10vw;
	right: 0;
	width: 12vw
}

@media only screen and (min-width: 1700px) {
	.header-bild-design-element{
		bottom: calc(-10vw + 2vh);
	}
}
@media only screen and (min-width: 1800px) {
	.header-bild-design-element{
		bottom: calc(-10vw + 4vh);
	}
}
@media only screen and (max-width: 1024px) {
	.header-bild-design-element{
		display: none;
	}
}
/* Overlay design element - ENDE */

/*arrange a-tags full width*/
.arrange-links{
	display: flex;
}
.arrange-links a{
	margin-right: 1rem;
}

/* Title transformation - START */
.beitrag-title{
	text-transform: uppercase;
	font-size: 16px;
	letter-spacing:.17rem;
	font-weight: initial;
}
.beitrag-title a{
	color: black;
}
.beitrag-content a{
	text-decoration: none;
	color: red;
}
/* Title transformation - ENDE */

/* Silbentrennung Ueberschriften*/
h1, h2, h3, h4, h5, h6 {
	-moz-hyphens: auto;
	-o-hyphens: auto;
	-webkit-hyphens: auto;
	-ms-hyphens: auto;
	hyphens: auto;
}

/* Abstand Überbegriffe zu h2 */
.h2-home {
	margin-top: -1.5vh !important;
}

/* Background Images - START */
/* Anpassungen Tablet/Mobile */
@media only screen and (max-width: 1024px) {
	.desktop-only-background > div {
		background-image: none !important;
	}
}

/* Position anpassen (kleine Displays) */
@media only screen and (min-width: 1025px) and (max-width: 1550px) {
	.desktop-only-background > div {
		background-position: 80% center !important;
	}
}

/* Background (Rocket) - Position anpassen - ENDE */

/* Background (Red Line) - Position anpassen (Desktop) - START */
@media only screen and (max-width: 1390px) {
	.hr-rocket-line > .kt-row-layout-inner {
		background-image: none !important;
	}
}
@media only screen and (min-width: 1391px) and (max-width: 1440px) {
	.hr-rocket-line > .kt-row-layout-inner {
		background-position: center -12vh !important;
	}
}
@media only screen and (max-width: 1899px) {
	.hr-rocket-line > .kt-row-layout-inner {
		background-position: center -13.5vh !important;
	}
}
@media only screen and (min-width: 1900px) and (max-width: 1970px) {
	.hr-rocket-line > .kt-row-layout-inner {
		background-position: center -16vh !important;
	}
}
/* Background (Red Line) - Position anpassen - ENDE */

/* [JOBBÖRSEN] - Abstand zu Kundensection anpassen (Desktop) */
@media only screen and (min-width: 1441px) {
	.jobboersen-block {
		margin-top: -10vh;
	}
}

/* Website Mockup-Bild - Größe und Position anpassen - START */
@media only screen and (min-width: 1441px) {
	.website-mockup > picture {
		display: block;
		width: 1412px !important;
		height: 941px !important;
		padding-top: 4vh;
		margin-left: -3vw !important;
	}
}

@media only screen and (max-width: 1440) {
	.website-mockup > picture {
		display: block;
		width: 1024px !important;
		height: 682px !important;
		padding-top: 7vh;
		margin-left: -3vw !important;
	}
}
/* Website Mockup-Bild - Größe und Position anpassen (Desktop) - ENDE */

/* Unsere Jobbörsen in der Übersicht anpassen - START */ 
/* Überschrift Abstand zu Button Unsere Jobbörsen (Tablet)*/
@media only screen and (min-width: 1025px) and (max-width: 1440px) {
 #unsere-jobborsen-in-der-ubersicht {
		margin-top: 5vh;
	}
}

/* Abstand zwischen Börsentitel, Text und Link verringern */
.jobboersen-uebersicht div div div p {
	margin-bottom: 0px !important;
}

/* Folgende Klasse ist dem DIV zugeordnet, welches die Links beinhaltet. Auf die Links werden 16px Padding angewandt -> Daher -16px Margin auf DIV */
.learn-more-button {
	margin-left: -16px;
}

/* Trennung zwischen Börsen (Desktop)*/
@media only screen and (min-width: 1025px) {
	.jobboersen-uebersicht-boerse {
		margin-right: 0 !important;
		padding: 2vh 0 2vh 0;
	}

	.jobboersen-divider {
		background: #F5F5F5	;
		width: 3px;
		margin: 1vh 1vw 1vh 1vw !important;
	}
}

/* Trennung 2. Reihe länge anpassen >>> Ganze Zeile auf 300px setzen */
#kt-layout-id_288746-60 > div {
	height: 300px
}

/* Unsere Jobbörsen in der Übersicht anpassen - ENDE */ 

/* Abstand Leistungen zu Bild (Counter/Zahlen Facebook, Jobsuchende, Nutzer) - Mobil  */
@media only screen and (max-width: 640px) {
	.counter-section {
		margin-top: -23vh;
	}
}

/* [Leistungen] - Abstand Top (Mobil) */ 
@media only screen and (max-width: 767px) {
	.leistungen-block-header {
		margin-top: 10vh !important;
	}
}

/* Leistungen - h2 Breite anpassen (Desktop) */
@media only screen and (min-width: 1440px) {
	#der-rund-um-service-fuer-ihre-bewerbersuche {
		width: 80%;
	}
}

/* Google Recruiting - Searchbar-SEO - Bild zentrieren*/
@media only screen and (min-width: 1024px) {
	.searchbar-seo-image {
		position: absolute;
		top: 60% !important;
		transform: translate(0, -50%) !important;
	}
}

/* Personalvermittlung - Kreis im Hintergrund - Größe anpassen */
@media only screen and (max-width: 640px) {
	.provisions-section > div {
		background-size: 180vw !important;
	}
}
/* Google Recruiting - Background (Rocket) - Positionfix kleinere Monitore */
@media only screen and (max-width: 1550px) {
	#kt-layout-id_2c29a2-70 {
		background-position: 80% 0% !important;
	}
}
@media only screen and (min-width: 1551px) and (max-width: 1750px) {
	#kt-layout-id_2c29a2-70 {
		background-position: 70% 0% !important;
	}
}

/* Heading-Überschrift - Margin anpassen */
.heading-ratgeber {
	margin-top: 3vh !important;
	margin-bottom: 3vh !important;
}
.heading-addition {
	margin-bottom: 1vh !important
}

/* Ratgeber - Backgroundposition anpassen (Desktop) */
@media only screen and (min-width: 1025px) {
.site-header-upper-inner-wrap {
	height: 0 !important;
}
}

/* Header Menü im Vordergrund - START */
.primary-menu{	
	z-index: 10000;
	position: absolute;
	top: 10;
}

.wp-block-kadence-rowlayout.alignwide {
	z-index: 10;
	position: relative;
	top: 5;
} 
.diversity_anklickbarer_text {
	z-index: 10000;
	position: relative;
}

.diversity_text_hintergrund {
	z-index: 1;
	position: relative;
}
/* Header Menü im Vordergrund - ENDE */

/* Talentpool - Button im Vordergrund - START */
.wp-block-kadence-column.inner-column-1.kadence-column-c4217a-ba {
	z-index: 1;
	position: absolute;
	top: 1;
}

.wp-block-kadence-advancedbtn.kt-btn-align-left.kt-btn-tablet-align-inherit.kt-btn-mobile-align-inherit.kt-btns-wrap.kt-btns_a54962 {
	z-index: 100;
	position: relative;
	top: 10;
}
/* Talentpool - Button im Vordergrund - ENDE */

/* Links ohne Underline und Fett */
.styled-link {
	text-decoration: none;
	font-weight: 900;
}

/* Webkit Flex überschreiben */
.webkit-flex-one {
	-webkit-flex: 1 !important;
}

@media only screen and (max-width: 1024px) {
	.text-suchmaschine {
		text-align:left!important;
	}
}

/* Image Carousel / Logo Carousel / Image-Slider - Pfeile Abstand zu Logos */
#kt-layout-id_c50ff2-1d > div > div > div > div.wp-block-kadence-advancedgallery.kb-gallery-wrap-id-_e5f99a-3c > div > div > div {
	padding: 0 5vw 0 5vw;
} */

/* ------------- */

/* Designfixes (Einzelne Beiträge oder Seiten) - START */

/* Suchenseite optimieren */
#archive-container {
	margin-top:10%;
}
.primary-sidebar {
	margin-top:25%;
}

/*Social media Recruiting - social media img mobile*/
.social-media-img figure{
	width: 100%;
}

/* Stellenanzeigen - Preis-Card Designfix */
.stellenanzeigen-standard > div {
    display: block !important;
}

/* Stellenanzeigen - Preis-Card - Einrückung verhindern / Linksbündig ausrichten */
.li-start-left > ul > li {
	justify-content: start !important;
}

/*Stellenanzeigen full width img - center*/
.stellenanzeigen-center img{
	margin:auto
}
/* Designfixes (Einzelne Beiträge oder Seiten) - ENDE */

/* ------------- */

/* Designfixes Navigation - START */
/* Navigation - Linkfarbe anpassen - START */
/* Hovereffekt */
.menu-item > a:hover {
	color: #D71F26 !important;
}

/* Effekt bei Mausklick */
@media only screen and (min-width: 1025px) {
.menu-item > a:active {
	color: black !important;
}
}

/* Submenü - Soll nicht rot werden bei Hover */
.sub-menu > .menu-item > a:hover  {
	color: white !important;
}

/* Submenü - Effekt bei Mausklick */
.sub-menu > .menu-item > a:active {
	color: black !important;
}
/* Navigation - Linkfarbe anpassen - ENDE */

/* Navigation - Abstände - START */
/* Desktop */
@media only screen and (min-width: 1400px) {
#main-header > div > div > div > div > div > div > div > div.site-header-main-section-left.site-header-section.site-header-section-left > div > div > a > picture:nth-child(1) > img {
	margin-top: 0.7em;
}
.site-main-header-wrap .site-header-row-container-inner>.site-container {
    padding: 0px 30px 10px 120px;
}
}
/* Tablet */
@media only screen and (min-width: 641px) and (max-width: 1450px) {
#mobile-header > div > div > div > div > div > div > div > div.site-header-main-section-left.site-header-section.site-header-section-left > div > div > a > picture:nth-child(1) > img {
	margin-top: 3vh;
}
#mobile-header > div > div > div > div > div > div > div > div.site-header-main-section-left.site-header-section.site-header-section-left {
    padding: 10px 30px 15px 0.6em;
}
}
/* Mobile */
@media only screen and (max-width: 640px) {
#mobile-header > div > div > div > div > div > div > div > div.site-header-main-section-left.site-header-section.site-header-section-left > div > div > a > picture:nth-child(1) {
	margin-top: 1vh;
}	
#mobile-header > div > div > div > div > div > div > div > div.site-header-main-section-left.site-header-section.site-header-section-left > div > div > a > picture:nth-child(1) > img {
	margin-top: 3vh;
}
#mobile-header > div > div > div > div > div > div > div > div.site-header-main-section-left.site-header-section.site-header-section-left {
    padding: 25px 30px 15px 0.8em;
	}

/* Search + Hamburgermenü einrücken */
.search-toggle-open-container {
    margin-left: -20px !important;
		padding: 0 !important;
}
.mobile-toggle-open-container {
    margin-left: -25px !important;
}
}
/* Navigation - Abstände - ENDE */

/*Logo positionieren (kleine Notebooks - bis 1440px */
@media only screen and (min-width: 1420px) and (max-width: 1450px) {
#main-header > div > div > div > div > div > div > div > div.site-header-main-section-left.site-header-section.site-header-section-left > div > div > a > picture:nth-child(1) > img {
    margin-left: 45px !important;
}
}

/*Logo und Hamburgermenü positionieren (Tablet) */
@media only screen and (min-width: 771px) and (max-width: 1024px) {
	.site-main-header-wrap .site-header-row-container-inner>.site-container {
		margin-left: -5vw !important;
    padding: 30px 0 30px 90px !important;
}
}

/* Logo positionieren - Display: Mobile */
#masthead .kadence-sticky-header.item-is-fixed:not(.item-at-start) .site-branding img {
		padding: 15px 0 10px 0 !important;
}

/* Navigation breite optimieren (kleine Notebooks - bis 1540px) */
@media only screen and (min-width: 1325px) and (max-width: 1540px) {
	.site-main-header-wrap .site-header-row-container-inner>.site-container {
		padding: 0px 30px 10px 25px !important;
	}
}

/* Navigation - Search Icon - Abstand Rechts vergrößern */
#main-header > div > div > div > div > div > div > div > div.site-header-main-section-right.site-header-section.site-header-section-right > div:nth-child(2) > div > button {
	padding-right: 4vw;
	padding-left: 0;
}

/* Navigation (Ratgeber) - Darstellung wie normale Navigation - START */
.non-transparent-header .kadence-svg-iconset svg {
    width: 1em !important;
    height: 1em !important;
}
#primary-menu {
	font-weight: 500;
}
.header-navigation .header-menu-container ul ul li.menu-item > a {
	font-size: 0.8em !important;
}
.header-navigation-layout-stretch-true, .non-transparent-header .search-toggle-open-container .search-toggle-open .search-toggle-icon {
	margin-right: 1rem !important;
	font-size: 1em !important;
}
/* Navigation (Ratgeber) - Ende */
/* Designfixes Navigation - ENDE */

/* ------------- */

/* Inhalte ausblenden - START */
/* Desktop Content für Mobile/Tablet Geräte ausblenden */
@media only screen and (max-width: 1024px) {
	.desktop-content {
		display: none !important;
	}	
}
/* Mobile/Tablet Content für Desktop Geräte ausblenden */
@media only screen and (min-width: 1025px) {
	.mobile-tablet-content {
		display: none !important;
	}	
}

/* Mobile (ONLY) Content für Desktop/Tablet Geräte ausblenden */
@media only screen and (min-width: 640px) {
	.mobile-content {
		display: none !important;
	}	
}
/* Inhalte ausblenden - ENDE */

/* ------------- */

.kt-accordion-header-wrap .kt-blocks-accordion-header.kt-accordion-panel-active {
    background-color: #fff !important;
    border-color: #f2f2f2 !important;
}

.header-navigation .header-menu-container ul ul li.menu-item > a:hover,
.header-navigation .header-menu-container ul ul li.menu-item.current-menu-item > a {
    background: var(--global-palette3) !important;
}
