/*
 Theme Name:     DEX.Mod
 Theme URI:      https://dietrich.expert
 Description:    Grundgestell DEX
 Author:         Tobias Dietrich
 Author URI:     https://dietrich.expert
 Template:       Divi
 Version:        1.2.0
*/
 
 
/* =Theme customization starts here
------------------------------------------------------- */

/*** CSS GRID ***/
@supports (display: grid) { /* open @supports */
.et_pb_section.grid-container {
	max-width: 1920px;
	margin: auto;
	display: -ms-grid;
	display: grid;
	-ms-grid-columns: (20px 1fr)[12];
	grid-template-columns: repeat(20, 1fr);
	grid-auto-rows: auto;
	grid-column-gap: 20px;
	grid-row-gap: 20px;
	background-color: white;
	padding: 0px !important;
    overflow: hidden;
	place-items: stretch / stretch !important;
}
}
.et_pb_row.grid-item {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
    grid-area: auto / auto / span 1 / span 1;
	overflow: hidden;
    width: 100%!important;
    max-width: 100%!important;
	min-height:0px;
    margin: 0px!important;
	padding: 0px;
}

@media all and (max-width: 980px) {
	.et_pb_row.grid-item {
		min-height: 0px;
	}
}

.et_pb_row.grid-item.grid-item-xs 	{grid-area: auto / auto / span 1 / span 4;}
.et_pb_row.grid-item.grid-item-s 	{grid-area: auto / auto / span 1 / span 4;}
.et_pb_row.grid-item.grid-item-m 	{grid-area: auto / auto / span 1 / span 5;}
.et_pb_row.grid-item.grid-item-l 	{grid-area: auto / auto / span 1 / span 8;}
.et_pb_row.grid-item.grid-item-xl 	{grid-area: auto / auto / span 1 / span 10;}
.et_pb_row.grid-item.grid-item-xxl 	{grid-area: auto / auto / span 1 / span 20;}

@media all and (max-width: 1199px) {
	.et_pb_row.grid-item.grid-item-xs 	{grid-area: auto / auto / span 1 / span 4;}
	.et_pb_row.grid-item.grid-item-s 	{grid-area: auto / auto / span 1 / span 4;}
	.et_pb_row.grid-item.grid-item-m 	{grid-area: auto / auto / span 1 / span 5;}
	.et_pb_row.grid-item.grid-item-l 	{grid-area: auto / auto / span 1 / span 12;}
	.et_pb_row.grid-item.grid-item-xl 	{grid-area: auto / auto / span 1 / span 20;}

}

@media all and (max-width: 980px) {
	.et_pb_row.grid-item.grid-item-xs 	{grid-area: auto / auto / span 1 / span 4;}
	.et_pb_row.grid-item.grid-item-s 	{grid-area: auto / auto / span 1 / span 6;}
	.et_pb_row.grid-item.grid-item-m 	{grid-area: auto / auto / span 1 / span 20;}

}

@media all and (max-width: 767px) {
	.et_pb_row.grid-item.grid-item-xs 	{grid-area: auto / auto / span 1 / span 4;}
	.et_pb_row.grid-item.grid-item-s 	{grid-area: auto / auto / span 1 / span 20;}
}
	


/* close @supports */

/*** TYPO ***/
@font-face {
	font-family: "Klavika Basic";
	font-weight: 100;
	font-weight: 200;
	font-weight: 300;
	font-weight: 400;
	src: url(https://dietrich.expert/wp-content/uploads/fonts/KlavikaBasic-Regular.otf);
}

@font-face {
	font-family: "Klavika Basic";
	font-weight: 500;
	font-weight: 600;
	font-weight: 700;
	font-weight: 800;
	src: url(https://dietrich.expert/wp-content/uploads/fonts/KlavikaBasic-Bold.otf);
}

body {
	font-family: "Klavika Basic", sans-serif;
	font-size: 25px;
	line-height: 1.7em;
	letter-spacing: 1px;
}

h1, h2, h3, h4, h5, h6 {
	line-height: 1.3em;
	letter-spacing: 2px;
}

h1 {
	font-size: 1.5em;
	font-weight: 900;
	text-transform: uppercase;
	color: #868889 !important;
}

h2, h3, h4, h5, h6 {
	font-weight: 700;
}

@media all and (max-width: 1199px) {
	body {
		font-size: 20px;
		letter-spacing: 2px;
	}
}

@media all and (max-width: 767px) {
	body {
		font-size: 16px;
		letter-spacing: 1px;
	}
}

/* NAVIGATION */
#main-header {
	border-bottom: 20px solid white;
}

header#main-header.et-fixed-header, #main-header{
	-webkit-box-shadow:none !important;
	        box-shadow:none !important;
}

#et-top-navigation {
	padding-left: 0px !important;
	float: none;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

@media all and (max-width: 1199px) {
	#et-top-navigation {
		padding-left: 283px !important; /* check inspector for value */
	}
}

/*** ELEMENTE ***/
/* BIG HEADER */
#big-header {
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

@media all and (max-width: 980px) {
	#big-header #logo-big {
		-webkit-box-ordinal-group: 2;
		    -ms-flex-order: 1;
		        order: 1;
		margin-bottom: 60px;
	}
	
	#big-header #kontakt {
		-webkit-box-ordinal-group: 3;
		    -ms-flex-order: 2;
		        order: 2;
		margin-bottom: 60px;
	}
	
	#big-header #anschrift {
		-webkit-box-ordinal-group: 4;
		    -ms-flex-order: 3;
		        order: 3;
		margin-bottom: 0px;
	}
	
	#big-header #anschrift p {
		text-align: center;
	}
}


.kontakt-box {
	max-width: 300px;
	float: right;
}

@media all and (max-width: 980px) {
	.kontakt-box {
		float: none;
		margin: auto;
	}
}

.kontakt-box h3 {
	text-transform: uppercase;
	border: 3px solid white;
	padding: 0.2em 1em;
	margin-bottom: 0.5em;
	text-align: center;
	font-size: 1em;
}

.kontakt-box ul {
	list-style-type: none;
	padding: 0px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-align: end;
	    -ms-flex-align: end;
	        align-items: flex-end;
	-ms-flex-pack: distribute;
	    justify-content: space-around;
}

.kontakt-box ul li {
	width: 30%;
}

.kontakt-box ul li:hover {
	opacity: 0.6;
}

.kontakt-box ul li img {
	width: 100%;
	height: auto;
}

/* STARTSEITE NAVI BLURBS */
.elektro-blurb .et_pb_blurb_content {
    max-width: 100%;
}
.elektro-blurb .et_pb_main_blurb_image {
	margin: 0px;
	width: 100%;
}

.elektro-blurb .et_pb_main_blurb_image img {
	width: 100%;
}

.elektro-blurb .et_pb_blurb_container {
	padding: 1em;
}

.start-button {
	margin: 0px 1em 2em 1em;
}

/* UNTERSEITEN HEADER */
.et_pb_row.headline {
	min-height: 500px !important;
}

.et_pb_row.headline .et_pb_text {
	display: inline-block;
	padding: 0.2em 0.5em;
	margin-top: 0.8em;	
	font-size: 4em;
	line-height: 1em;
}

.et_pb_row.headline .et_pb_text h2 {
	padding: 0px;
	font-size: inherit;
	font-weight: 900;
	line-height: inherit;
	text-transform: uppercase;
}

/* UNTERSEITEN LEISTUNGEN */
.et_pb_row.leistungen ul {
	list-style: none; /* Remove list bullets */
	padding: 0;
	margin: 0;
}

.et_pb_row.leistungen ul li {
	display: block;
	margin-top: 0.5em;
	margin-bottom: 0.5em;
}

.et_pb_row.leistungen ul li a {
	display: inline-block;
	padding: 0.2em 1em;
	color: inherit;
	border: 2px solid white;
}

.et_pb_row.leistungen ul li a::before {
	content: "▪";
	padding-right: 0.5em;
	color: white; 
}

/* UNTERSEITEN SUBHEADLINE */
.et_pb_row.subheadline .et_pb_column {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

.et_pb_row.subheadline .et_pb_module {
	width: 100%;
}





/*** GENERAL ***/



/* GERINGERE CONTENT BREITE */
.slim-width {
	width: 80%;
	max-width: 960px;
	margin: auto;
}

/* DIV PADDING */
.min-pad {
	padding: 2em 3em !important;
}

/* BUTTONS */

body.et_pb_button_helper_class .et_pb_button,
body.et_pb_button_helper_class .et_pb_button:hover {
	padding: 0.2em 1em !important;
	line-height: 1em !important;
}

body.et_pb_button_helper_class .et_pb_button.et_pb_bg_layout_dark,
body.et_pb_button_helper_class .et_pb_button.et_pb_bg_layout_dark:hover {
	border-color: #fff !important;
}

/* FOOTER */
/* FOOTER GRID ZEILE */
#elektrik-footer .et_pb_column {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
	-webkit-box-align: center;
	    -ms-flex-align: center;
	        align-items: center;
	-ms-flex-line-pack: center;
	    align-content: center;
}

#elektrik-footer .et_pb_module {
	width: 100%;
}

#elektrik-footer .et_pb_widget_area {
	padding: 0px;
	border: none;
}

#elektrik-footer .widget_nav_menu {
	margin: 0px auto;
	float: none;
	width: 75%;
}

@media all and (max-width: 980px) {
	#elektrik-footer .widget_nav_menu {
		width: 100%;
	}
}

#elektrik-footer .menu {
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: space-evenly;
	    -ms-flex-pack: space-evenly;
	        justify-content: space-evenly;
	-ms-flex-wrap: wrap;
	    flex-wrap: wrap;
}

#elektrik-footer .menu li {
	margin: 0px 1em;
}

/* SOCIAL MEDIA ICONS */
ul#social-contacts {
	list-style-type: none;
	padding: 0px;
	display: -webkit-box;
	display: -ms-flexbox;
	display: flex;
	-webkit-box-pack: center;
	    -ms-flex-pack: center;
	        justify-content: center;
}

#main-footer {
	border-top: 20px solid white;
}

#main-footer > .container {
	display: none;
}

#footer-info {
    float: none;
    text-align: center;
	font-size: 12px !important;
}