/*
 Theme Name:     Divi Child
 Theme URI:      https://www.elegantthemes.com/gallery/divi/
 Description:    Divi Child Theme
 Author:         Elegant Themes
 Author URI:     https://www.elegantthemes.com
 Template:       Divi
 Version:        1.0.0
*/


/*********************************************************************************************************************************

	
	[Table of contents]
	
	01. Variablen
	02. Basics
	03. Helper classes
	04. Grid
	05. Navigation
	06. Elements
	07. Formular
	08. Responsive
	
	
	[Colors]
	
	# main color 		--> # = rgb()
	# black				--> #000000
	# white				-->	#ffffff
	
	
	[Typography]
	
	# content   		--> 
	# titles 			--> 
	

/*******************************************************************************************************************************/
/*****Variablen*****************************************************************************************************************/
/*******************************************************************************************************************************/

:root {
	--black: #000000;
	--white: #ffffff;
	--lightGrey: #f6f6f6;
	--fontColor: #272727;
	--cdBlack: #1D1D1B;
	--cdRot: #e4032d;
}

/*******************************************************************************************************************************/
/*****Basics********************************************************************************************************************/
/*******************************************************************************************************************************/

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

html, body {
	width: 100%;
	height: 100%;
	position: relative;
}

/*******************************************************************************************************************************/
/*****Helper classes************************************************************************************************************/
/*******************************************************************************************************************************/

.transition, .teaser *, .teaser:before, .background-image-zoom *, #menu-hauptnavigation a, #mobile_menu2 a {
	transition: all 250ms ease-in-out;	
	-moz-transition: all 250ms ease-in-out;	
	-webkit-transition: all 250ms ease-in-out;	
	-ms-transition: all 250ms ease-in-out;	
	-o-transition: all 250ms ease-in-out;	
}


/*******************************************************************************************************************************/
/*****Grid**********************************************************************************************************************/
/*******************************************************************************************************************************/

.row {
	clear: both;
	overflow: hidden;
}

.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {
    float: left;
}

.col {
	margin-right: 1.5%;
}

.span1 {
	width: 6.9583333333333%;
}

.span2 {
	width: 15.416666666667%;
}

.span3 {
	width: 23.875%;
}

.span4 {
	width: 32.333333333333%;
}

.span5 {
	width: 40.791666666667%;
}

.span6 {
	width: 49.25%;
}

.span7 {
	width: 57.708333333333%;
}

.span8 {
	width: 66.166666666667%;
}

.span9 {
	width: 74.625%;
}

.span10 {
	width: 83.083333333333%;
}

.span11 {
	width: 91.541666666667%;
}

.span12 {
	width: 100%;
}

/*******************************************************************************************************************************/
/*****Navigation****************************************************************************************************************/
/*******************************************************************************************************************************/

.hauptnavigation ul.et-menu li.menu-item-has-children {
	cursor: pointer;
}

.hauptnavigation ul.et-menu li ul.sub-menu {
	padding: 25px;
}

.hauptnavigation ul.et-menu li ul.sub-menu li {
	padding: 0;
}

.hauptnavigation ul.et-menu li ul.sub-menu li a {
	padding-left: 0;
	padding-right: 0;
}

.hauptnavigation ul.et-menu li ul.sub-menu li:hover a {
	color: var(--cdRot) !important;
}

.hauptnavigation ul.et-menu li ul.sub-menu li a:hover {
	background: transparent !important;
	padding-left: 10px;
}

.hauptnavigation .et_pb_menu__logo-slot {
	padding-left: 20px !important;
	padding-right: 20px !important;
}



/*******************************************************************************************************************************/
/*****Elements******************************************************************************************************************/
/*******************************************************************************************************************************/

/* Blog */

.myls-blog > div {
	display: grid;
	grid-template-columns: repeat(3, 1fr);
	gap: 30px;
}

.myls-blog article {
	background: var(--lightGrey);
	padding: 30px;
	margin-bottom: 0;
}

.myls-blog  a.entry-featured-image-url {
	margin: -30px;
	margin-bottom: 30px;
}

.myls-blog article img {
	aspect-ratio: 4/3;
  	object-fit: cover;
}


/* Jobs */

.myls-jobs .no-jobs-available {
	padding: 0 !important;
	border: 0 !important;
	font-size: 20px;
	font-weight: 400;
	color: var(--fontColor) !important;
	background: var(--white) !important; 
}

.myls-jobs .job-preview {
	display: flex !important;
	padding: 30px !important;
	flex-direction: row;
	justify-content: space-between;
	align-items: center;
	border: 0 !important;
}

.myls-jobs .job-preview:after {
	display: none !important;
}

.myls-jobs .job-preview .job-content {
	padding: 0 !important;
	display: initial !important;
	width: initial !important;
	height: initial !important;
}

.myls-jobs .job-preview .job-content h5 {
	font-size: 28px !important;
	line-height: 1.2 !important;
	padding: 0 !important;
	margin: 0 !important;
}

.myls-jobs .job-preview .job-content .job-additional-information {
	font-size: 14px !important;
	font-weight: 400 !important;
	line-height: 1.2 !important;
	color: var(--cdRot) !important;
	margin: 0 !important;
	margin-top: 2px !important;
}

.myls-jobs .job-preview .job-content .job_custom_message {
	display: none !important;
}

.myls-jobs .job-preview .job-cta {
	padding: 0 !important;
	display: initial !important;
	width: initial !important;
	height: initial !important;
}

.myls-jobs .job-preview .job-cta a {
	padding: 15px 40px !important;
	font-size: 18px !important;
}


.job-post {
	width: 85% !important;
	max-width: 1280px !important;
	padding: 140px 0 !important;
	margin: 0 auto !important;
}

.job-content  {
	width: 65% !important;
	padding: 0 !important;
	margin-bottom: 0 !important;
}

.job-content .job-content-wrap {
	padding: 0 !important;
	padding-left: 5.5% !important;
}

.job-content .job-content-wrap .jobs-row-label {
	margin: 0 !important;
	padding: 0 !important;
}

.job-content .job-content-wrap .jobs-row {
	margin-top: 0 !important;
	margin-bottom: 40px !important;
}

.job-content .job-content-wrap .jobs-row:last-child {
	margin-bottom: 0 !important;
}

.job-content .job-content-wrap .jobs-row-button {
	margin-top: -20px !important;
}

.job-content .job-content-wrap .jobs-row h2 {
	font-size: 28px !important;
	line-height: 1.2 !important;
	text-align: left !important;
	margin-bottom: 10px !important;
}

.job-content .job-content-wrap .jobs-row p {
	font-size: 20px !important;
	font-weight: 300 !important;
	line-height: 1.8 !important;
	text-align: left !important;
}

.job-content .job-content-wrap .jobs-row a.button {
	display: inline-block !important;
	width: auto !important;
	border-radius: 0 !important;
	padding: 15px 40px !important;
	font-size: 18px !important;
	font-weight: 400 !important;
}

.job-side  {
	width: 35% !important;
	padding: 0 !important;
}

.job-side .job-content-wrap {
	border: none !important;
	background: var(var(--lightGrey)) !important;
	padding: 50px 40px !important;
}

.job-side .position_logo img {
	margin: 0 !important;
	max-width: 100% !important;
}

.job-side .jobs-row {
	margin: 0 !important;
	padding: 0 !important;
	margin-bottom: 20px !important;
}

.job-side .jobs-row:last-child {
	margin-bottom: 0 !important;
}

.job-side .jobs-row.position_logo {
	margin-bottom: 40px !important;
}

.job-side .jobs-row .jobs-row-label { /* Überschrift */
	font-family: 'Karla', Helvetica, Arial, Lucida, sans-serif;
	font-size: 18px !important;
	font-weight: 500 !important;
	line-height: 1.2 !important;
	margin: 0 !important;
	padding: 0 !important;
	border: 0 !important;
}

.job-side .jobs-row .jobs-row-label span {
	border: 0 !important;
}

.job-side .jobs-row .jobs-row-input {
	font-size: 20px !important;
	font-weight: 300 !important;
	line-height: 1.8 !important;
}

.job-side .jobs-row a.job-pdf-export:hover {
	color: var(--cdRot);
}

.job-side .jobs-row .jobs-row-input svg {
	margin-right: 0 !important;
}



/* Portfolio */

.fancybox-slide {
	z-index: 999999999999 !important;
}

.vp-portfolio__item-overlay {
	background: transparent !important;
}

.myls-projects .vp-portfolio__layout-elements div {
	width: 100% !important;
}

.myls-projects .vp-filter {
	display: flex;
	flex-direction: column !important;
	justify-content: flex-start !important;
	width: 100% !important;
}

.myls-projects .vp-filter .vp-filter__item a {
	display: block;
	width: 100%;
	border-radius: 0 !important;
	background: var(--lightGrey) !important;
	font-size: 18px !important;
	font-weight: 500 !important;
	color: var(--cdBlack);
	text-transform: uppercase !important;
	padding: 15px 40px !important;
}

.myls-projects .vp-filter .vp-filter__item a:hover,
.myls-projects .vp-filter .vp-filter__item-active a {
	background: var(--cdBlack) !important;
	color: var(--white) !important;
}



/* Telefon-Button */

#callnowbutton {
	bottom: 30px !important;
	right: 30px !important;
}


/* Effekte */

.background-image-zoom {
	overflow: hidden;
}

.background-image-zoom::before {
	content: "";
	display: block;
	position: absolute;
	top: 0;
	right: 0;
	bottom: 0;
	left: 0;
	width: 100%;
	height: 100%;
	z-index: -2;
	background-size: cover !important;
	background-position: center !important;
	transition: all 250ms ease-in-out;
}

.background-image-zoom:hover::before {
	transform: scale(1.02);
}

.background-image-zoom:hover * {
	padding-left: 5px;
}


/* Leaflet-Karte */

.leaflet-control-attribution {
	display: none;
}


/* myls-Öffnungszeiten */

#openingHours .business-hours {
	max-width: 100% !important
}

#openingHours .openingHours-day {
	display: flex !important;
  	justify-content: start !important;
	gap: 5px !important;
}

#openingHours .openingHours-day:nth-child(6), /* Samstag */
#openingHours .openingHours-day:nth-child(7), /* Sonntag */
#openingHours .openingHours-day:nth-child(8){
	display: none !important;
}

#openingHours .openingHours-day div:first-child:after {
	content: ": ";
}

#openingHours .openingHours-time br {
	display: none !important;
}


/*******************************************************************************************************************************/
/*****Formular******************************************************************************************************************/
/*******************************************************************************************************************************/





/*******************************************************************************************************************************/
/*****Responsive****************************************************************************************************************/
/*******************************************************************************************************************************/

@media all and (max-width: 1280px) {
	
}


/* Tablet */

@media all and (max-width: 980px) {
	
	.span1, .span2, .span3, .span4, .span5, .span6, .span7, .span8, .span9, .span10, .span11, .span12 {
		width: 100%;
		float: none;
	}
	
	.col {
		margin-right: 0;
	}
	
	.custom_row {
		display: -webkit-box;
		display: -moz-box;
		display: -ms-flexbox;
		display: -webkit-flex;
		display: flex;
		-webkit-flex-wrap: wrap;
		flex-wrap: wrap;
	}
	
	.first-on-mobile {
		-webkit-order: 1;
		order: 1;
	}
	
	.second-on-mobile {
		-webkit-order: 2;
		order: 2;
	}
	
	.third-on-mobile {
		-webkit-order: 3;
		order: 3;
	}
	
	.fourth-on-mobile {
		-webkit-order: 4;
		order: 4;
	}

	.hauptnavigation ul.et_mobile_menu {
		top: calc(100% + 30px);
	}

	.hauptnavigation .mobile_nav.opened .mobile_menu_bar:before {
		content: "\4d" !important;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 ul.hide {
		display: none !important;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 li {
		position: relative;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 li a {
		background: transparent;
		font-weight: initial !important;
	}

	.hauptnavigation ul.et_mobile_menu#mobile_menu2 li:hover > a[href] {
		padding-left: 25px;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 > li:last-child a {
		border-bottom: none !important;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 li li {
		padding-left: 0;
		padding-right: 0;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 li a + span {
		position: absolute;
		display: block;
		right: 0;
		top: 0;
		left: 0;
		width: 100%;
		text-align: right;
		padding: 10px 15px;
		cursor: pointer;
		z-index: 3;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 li.menu-item-has-children > a + span.menu-closed:before {
		content: "\33";
		display: block;
		color: var(--rot);
		font-size: 32px;
		font-family: ETmodules;
	}
	
	.hauptnavigation ul.et_mobile_menu#mobile_menu2 li.menu-item-has-children > a + span.menu-closed.menu-open:before {
		content: "\32";
	}

	.has_et_pb_sticky .hauptnavigation ul.et_mobile_menu {
		top: calc(100% + 20px);
	}

	.myls-blog > div {
		grid-template-columns: repeat(2, 1fr);
		gap: 30px;
	}

	.myls-jobs .no-jobs-available {
		font-size: 19px;
		line-height: 1.7;
		text-align: left !important;
	}

	.myls-jobs .job-preview {
		padding: 25px !important;
		flex-direction: column;
		gap: 10px;
		justify-content: flex-start;
		align-items: flex-start;
	}

	.job-post {
		padding: 100px 0 !important;
	}

	.job-content  {
		width: 100% !important;
	}

	.job-content .job-content-wrap {
		padding-left: 0 !important;
	}

	.job-content .job-content-wrap .jobs-row {
		margin-bottom: 30px !important;
	}

	.job-content .job-content-wrap .jobs-row-button {
		margin-top: -10px !important;
	}

	.job-content .job-content-wrap .jobs-row h2 {
		font-size: 28px !important;
		line-height: 1.2 !important;
		text-align: left !important;
		margin-bottom: 10px !important;
	}

	.job-content .job-content-wrap .jobs-row p {
		font-size: 19px !important;
		line-height: 1.7 !important;
	}

	.job-content .job-content-wrap .jobs-row a.button {
		padding: 14px 35px !important;
		font-size: 17px !important;
	}

	.job-side  {
		width: 100% !important;
		padding: 0 !important;
	}

	.job-side  {
		width: 100% !important;
		padding: 0 !important;
	}

	.job-side .job-content-wrap {
		padding: 40px 35px !important;
		margin-bottom: 30px !important;
	}

	.job-side .jobs-row .jobs-row-label { /* Überschrift */
		font-size: 17px !important;
	}

	.job-side .jobs-row .jobs-row-input {
		font-size: 19px !important;
		line-height: 1.7 !important;
	}
	
}


/* Smartphone*/

@media all and (max-width: 767px) {
		
	.myls-blog > div {
		grid-template-columns: repeat(1, 1fr);
		gap: 0px;
	}

	.myls-blog article:last-child {
		margin-bottom: 0 !important;
	}

	.myls-jobs .no-jobs-available {
		font-size: 18px;
		line-height: 1.6;
	}

	.job-post {
		padding: 60px 0 !important;
	}

	.job-content .job-content-wrap .jobs-row h2 {
		font-size: 28px !important;
		line-height: 1.2 !important;
		text-align: left !important;
		margin-bottom: 10px !important;
	}

	.job-content .job-content-wrap .jobs-row p {
		font-size: 18px !important;
		line-height: 1.6 !important;
	}

	.job-content .job-content-wrap .jobs-row a.button {
		padding: 13px 30px !important;
		font-size: 16px !important;
	}

	.job-side .job-content-wrap {
		padding: 30px !important;
		margin-bottom: 0px !important;
	}

	.job-side .jobs-row {
		margin-bottom: 15px !important;
	}

	.job-side .jobs-row.position_logo {
		margin-bottom: 30px !important;
	}

	.job-side .jobs-row .jobs-row-label { /* Überschrift */
		font-size: 16px !important;
		margin-bottom: 5px !important;
	}

	.job-side .jobs-row .jobs-row-input {
		font-size: 18px !important;
		line-height: 1.6 !important;
	}

}


@media all and (max-width: 480px) {
	
	#openingHours .openingHours-day {
		display: flex !important;
		justify-content: space-between !important;
		gap: 0px !important;
	}

	#openingHours .openingHours-day:nth-child(6), /* Samstag */
	#openingHours .openingHours-day:nth-child(7), /* Sonntag */
	#openingHours .openingHours-day:nth-child(8){
		display: none !important;
	}

	#openingHours .openingHours-day div:first-child:after {
		content: "";
		display: none !important;
	}
	
	#openingHours .openingHours-time {
		text-align: right !important;
	}

	#openingHours .openingHours-time br {
		display: block !important;
	}
	
}