* {
	box-sizing: border-box;
	margin: 0;
	padding: 0;
	scroll-behavior: smooth;
	font-family: 'Gothic A1', sans-serif;
	color: white;
}

body {
	font-size: 18px;
	background-color: #C5C1C0; /*#F0FDF0;*/
	letter-spacing: 1.5px;
}

summary {
cursor: pointer;
}

.noScroll {
	overflow: hidden;
}

.desktop_menu_bar {
	display: none;
}

.mobile_hamburger_menu_bar {
	background: #008C19; 
	padding: 0 12px;
	border-bottom: 2px solid #1d682b;
	box-shadow: 0 3px 10px black;
	position: fixed;
	width: 100%;
	z-index: 999;
	display: none;
	top: 0;
	left: 0;
}

.mobile_hamburger_menu_container {
	display: flex;
	justify-content: space-between;
	align-items: center;
}

.mobile_hamburger_menu_logo {
	width: 45px;
	margin-top: 10px;
}

#mobile_hamburger_menu {
	width: 60px;
	height: 60px;
	background: #008C19;
	border: none;
}

.mobile_hamburger_menu_button {
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: auto;
	height: 100%;
}

.bar {
	width: 35px;
	height: 4px;
	background-color: white;
	display: block;
	margin: 3px 0;
}

#sidebar_menu {
	visibility: hidden;
}

#sidebar_menu.active {
	visibility: visible;
	position: fixed;
	top: 0;
	right: 0;
	width: 200px;
	height: 100%;
	background-color: #5c5c5c;
	padding: 0 10px;
	box-sizing: border-box;
	transition: ease-in-out 0.3s;
}

.sidebar_menu_underline {
	width: 100%;
	height: 3px;
	display: inline-block;
	background-color: white;
	border-radius: 4px;

}

#sidebar_menu h3 {
	margin: 20px 20px 6px 20px;
	font-size: 18px;
	color: white;
}

ul {
	list-style-type: none;
}

#sidebar_menu li {
	margin: 10px;
	font-size: 15px;
}

a {
	text-decoration: none;
	color: white;
}

.mobile_overlay {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	opacity: 0;
	visibility: hidden;
	transition: opacity .35s, visibility .35s, height .35s;
	overflow: hidden;
	background: black;
	z-index: 1;
}

.mobile_overlay.active {
	position: fixed;
	visibility: visible;
	opacity: 0.4;
}

.page_1_bg_image_container {
	background-image: linear-gradient(rgba(0 0 0 / 10%), rgba(0 0 0 / 10%)), url("Bilder/0_Titelbild/1_mobile.jpg");
	height: 100vh;
	background-size: cover;
	display: flex;
	align-items: flex-end;
}

.page_1_text_container {
	background-color: #0000008c;
	color: white;
	padding: 20px;
	margin-bottom: 30px;
	box-shadow: 0 0 12px 6px black;
	text-align: center;
	text-shadow: 0 2px 3px black;
	backdrop-filter: blur(1px);
	border-top: 3px solid green;
	border-bottom: 3px solid green;

}

#page_1 h3 {
	margin-bottom: 10px;
	font-size: 18px;
	font-weight: bold;
}

p, h4 {
	font-size: 15px;
}

.page_2, #page_3, #page_4, #page_5, #disclaimer {
	margin-top: 30px;
}

.page_2 h3, #page_3 h3, #page_4 h3, #page_5 h3 {
	text-align: center;
	background-color: #008C19;
	padding: 16px;
	text-shadow: 0 3px 3px #003a0d;
	font-size: 18px;
}

#page_2_services_container h3, #page_3 h3, #page_4 h3, #page_5 h3 {
	position: relative;
	box-shadow: 0 2px 8px black ;
}

.page_2_text_container {
	text-align: center;
	background-color: #759a76;
	padding: 16px;
	text-shadow: 0 3px 3px #003a0d;
	font-size: 18px;

}

.service_headline_and_img, .page_3_img_and_text, .page_4_img_and_text, .page_5_contact_form, .houses, .hinged_div, .masonry, .mod, .outdoor, .pool, .planning, .imprint, .privacy, .company {
	background-color: #759a76;
	padding: 10px;
	margin: 0 10px 10px 10px;
	display: flex;
	align-items: center;
	flex-direction: column;
	text-align: center;
	box-shadow: 2px 2px 6px black;
    padding-top: 10px;
    padding-bottom: 40px;    
}

.service_img, .page_3_img, .page_4_img {
	width: 100%;
	height: auto;
	margin: 10px 20px;
	border: 2px solid #003a0d;
}

#page_2_services_container p {
	display: flex;
	align-items: center;

}

.page_3_img_and_text p, .page_4_img_and_text p {
	display: flex;
	justify-content: center;
	align-items: center;
	margin-top: 10px;
}

#page_2_services_container .fa-arrow-alt-circle-right, .page_3_img_and_text .fa-arrow-alt-circle-right {
	margin-right: 10px;
}

.page_2_references {
	margin-top: 30px;
	background-color: #f6edd9;
	padding: 20px;
	margin-bottom: 30px;
	text-align: center;
	box-shadow: 2px 2px 6px black;
}

.page_2_references_text h3, .page_2_references_text p {
	color: black;
	text-shadow: none;
	background-color: #f6edd9;
}

.page_2_references_text h3 {
	margin-bottom: 0;
}

.page_2_references_text p {
	margin-bottom: 20px;
}

.page_2_references .fa-arrow-alt-circle-right {
	color: black;
}

.fa-arrow-alt-circle-right {
	font-size: 24px;
	color: white;
}

.page_5_contact_address {
	background-color: #f6edd9;
	padding: 20px;
	margin: 0 10px 10px 10px;
	display: flex;
	align-items: center;
	justify-content: space-between;
	box-shadow: 2px 2px 6px black;
}

.page_5_contact_address p, .fa-phone, .fa-envelope {
	color: black;
}

.page_5_contact_address p {
	margin-bottom: 3px;
}

.contact_img {
	font-size: 70px;
}

.qr_code {
	display: none;
}

.fa-map-marker-alt {
	color: black;
}

fieldset {
	display: flex;
	flex-direction: column;
	font-size: 15px;
	gap: 15px;
	border: none;
}

.text_field {
	display: flex;
	flex-direction: column;
	align-items: flex-start;
}
.text_input {
	width: 100%;
    color: black;
}

.submit_btn {
	margin: 20px 0 0 0;
}

.btn_input {
	background-color: #f6edd9;
	color: black;
	text-align: center;
	border: 1px solid black;
	font-weight: 600;
	font-size: 15px;
	padding: 3px;
	width: 110px;
}

.disclaimer_and_privacy {
	display: flex;
	justify-content: center;
	gap: 50px;
    background-image: url('Bilder/Logo/Mauer4.jpg');
    background-position: center;
	background-color: #C5C1C0; /*#759a76;  */
    background-repeat: no-repeat;
	padding: 30px;
	margin: 0 20px 15px 20px;  
	flex-direction: row;   

}

.disclaimer_links {
	color: black;
	font-size: 16px;
    font-weight: bold;
}

/* New Pages (Services) */

.houses, .masonry, .mod, .outdoor, .pool, .planning, .imprint, .privacy, .company {
	margin-top: 75px;
	/*
	padding-top: 90px
	 */
}

.houses_image, .reference_object, .masonry_image, .mod_image, .outdoor_image, .pool_image, .planning_image {
	width: 100%;
	margin: 15px 0 15px 0;
	border: 2px solid #003a0d;
}

.houses h3, .masonry h3, .mod h3, .outdoor h3, .pool h3, .planning h3, .company h3 {
	text-shadow: 1px 1px 2px black;
}

.imprint h3, .privacy h3 {
	text-shadow: 1px 1px 2px black;
	margin-bottom: 15px;
}

.summary_p {
	margin-top: 15px;
}

.facts_headline {
	margin-bottom: 15px;
	font-size: 22px;
	font-weight: bold;
}

.facts_container {
	display: flex;
	flex-direction: column;
	align-items: center;
	row-gap: 10px;
}

/* Page Company */

.company_image {
	width: 80vw;
	margin: 10px;
	border: 2px solid #003a0d;
}

.company_table {
    border: 1px;
    vertical-align: top;
    text-align: left;
    width: 100%;
    border-collapse: collapse;
}

table,
th,
td {
        border: 1px solid #cccccc;
        border-collapse:collapse;
        border-spacing:0;
        vertical-align: top;
}

.chronik {
    vertical-align: top;
    text-align: left;
}


/* Anpassung Tablet */

@media screen and (min-width: 720px) {

	#sidebar_menu h3 {
		font-size: 22px;
	}

	.page_1_text_container {
		padding: 50px;
	}

	#page_1 h3, #page_2_services_container h3, .page_2_references h3, #page_3 h3, #page_4 h3, #page_5 h3 {
		font-size: 22px;
	}

	.page_2_references {
		padding: 75px;
	}

	p, h4, fieldset, .btn_input, .page_5_links, #sidebar_menu li, summary {
		font-size: 20px;
	}

	.qr_code {
		display: inline;
	}

	.page_5_contact_address {
		justify-content: space-evenly;
	}

	.fa-map-marker-alt {
		visibility: hidden;
	}

	#sidebar_menu.active {
		width: 300px;
	}
}

/* Anpassung Desktop klein */

@media screen and (min-width: 900px) {

	.mobile_hamburger_menu_bar {
		display: none;
	}

	.desktop_menu_bar {
		display: flex;
		position: fixed;
		top: 0;
		left: 0;
		width: 100%;
		justify-content: space-between;
		z-index: 999;
	}

	.desktop_menu_logo {
		width: 200px;
		background-color: #008C19;
		padding: 25px 10px 25px 10px;
		margin-left: 20px;
		box-shadow: 10px 10px #003a0d;
		opacity: 1;
		transition: opacity 0.5s ease-out;
	}

	.logo_inactive {
		opacity: 0;
		transition: opacity 0.5s ease-in;
	}
                                                                                                             
	.hide_or_show_logo {
		visibility: visible;  
	}

	.desktop_menu_bar_buttons {
		color: white;
		background-color: #008C19;
		height: 55px;
		display: flex;
		align-items: center;
		column-gap: 66px;
		padding: 0 50px;
		margin-right: 20px;
		box-shadow: 10px 10px #003a0d;
	}


}

/*Anpassung große Bildschirme*/

@media screen and (min-width: 1200px) {

	p, h4, fieldset, .btn_input, .page_5_links {
		font-size: 16px;
	}

	.page_1_bg_image_container {
		background-image: linear-gradient(rgba(0 0 0 / 10%), rgba(0 0 0 / 10%)), url("Bilder/0_Titelbild/1.jpg");
	}

	.page_1_text_container {
		width: 100%;
		padding: 10vh;
		box-shadow: 0 0 50px black;
	}

	.page_2, #page_3, #page_4, #page_5, #impress {
		margin: 30px 7vw;
	}

	.services_headline_and_img_wrapper {
		display: flex;
		flex-wrap: wrap;
		justify-content: center;
	}

	.service_headline_and_img {
		width: 40vw;
		height: 54vh;
	}

	.page_2_references {
		width: 95%;
		margin: 30px auto;
	}

	.service_img, .houses_image, .masonry_image, .mod_image,
	.outdoor_image, .planning_image, .pool_image {
		width: 90%;
		height: 90%;
	}

	.page_3_img, .page_4_img {
		width: 39%;
		height: auto;
	}

	.page_3_img_and_text p, .page_4_img_and_text p {
		display: flex;
		justify-content: left;
	}

	.company_image {
		width: 40%;
		margin: 20px;
		background-color: #003a0d;
		padding: 2px;
	}

	.page_3_img, .page_4_img, .houses_image, .masonry_image, .mod_image, .outdoor_image, .planning_image, .pool_image {
		margin-right: 20px;
	}

	.page_3_img_and_text, .page_4_img_and_text {
		margin: auto;
		width: 95%;
		display: flex;
		flex-direction: row;
		height: 48vh;
	}

	.page_3_text_wrapper, .page_4_text_wrapper {
		display: flex;
		flex-direction: column;
		padding: 30px;
	}

	.page_3_text, .page_4_text {
		text-align: left;
		margin-bottom: 20px;
	}

	.page_5_contact_address_contact_form_wrapper {
		display: flex;
		width: 96%;
		margin: auto;
	}

	.page_5_contact_address {
		width: 50vw;
	}

	.page_5_contact_form, .facts_company_text {
		padding: 30px;
	}

	.houses, .masonry, .mod, .outdoor, .planning, .pool, .company, .privacy, .imprint {
		width: 75%;
		margin: 13vh auto 2vh;
	}

	.hinged_div {
		width: 75%;
		margin: auto;
	}

	.houses_image_and_p_wrapper, .masonry_image_and_p_wrapper, .mod_image_and_p_wrapper, .outdoor_image_and_p_wrapper, .planning_image_and_p_wrapper, .pool_image_and_p_wrapper {
		display: flex;
		align-items: center;
		margin-top: 30px;
	}

	.houses_p_container, .masonry_p_container, .mod_p_container, .outdoor_p_container, .planning_p_container, .pool_p_container {
		text-align: left;
		width: 80%;
	}

	.reference_object {
		margin: 20px;
		width: 43%;
	}

	.sub_page_text {
		font-size: 18px;
	}

	.summary_p {
		font-size: 18px;
	}

}