html, body{
	font-family: Verdana;
	font-size: 14px;
	line-height: 20px;
	padding: 0;
	margin: 0;
	background: #882a3a;
}

.clear {
	clear: both;
}


/* Header */

header {
	width: 100%;
	text-align: center;
	background: #FFF;
}

header img {
	width: 100%;
	height: auto;
}


/* Section */

section {
	padding: 0 5%;
	z-index: 1;
    position: relative;	
	background: #FFF;
	width: 90%;
	text-align: center;
	margin: 0 auto; 
}

.container {
	max-width: 1150px;
	margin: 0 auto;
	
	display: flex;
    align-items: end;
    flex-wrap: wrap;
}

.images {
	margin-bottom: 30px;	
}

.images img {
	width: 100%;
	height: auto;
}

.images .image-one {
	width: 32%;
	float: left;
	margin-right: 1%;
}

.images .image-two {
	width: 32%;
	float: left;
	margin-right: 1%;
}

.images .image-three {
	width: 32%;
	float: left;
}

/* Kontaktformular */

.contact {
	width: 90%;
	-webkit-box-shadow: 0px 0px 14px -6px #000000; 
	box-shadow: 0px 0px 14px -6px #000000;
	border-radius: 8px;
	padding: 20px 5% 40px;
	margin-bottom: 30px;	

}

.contact p {
	margin: 0;
}

form {
	text-align: center;
}

input, textarea{
	padding: 0.4rem;
	border: 1px solid #dfdfdf;
	width: 95%;
	border-radius: 8px;
	margin-top: 1rem;
	font-family: 'Merriweather', sans-serif;
	resize: none;
}

textarea {
	height: 100px;
}

::placeholder {
	color: #dfdfdf;
	font-size: 12px;
}

.submit {
	display:block;
	text-align: right;
}

#input-submit {
	border: none;
	border-radius: 6px;
	padding: 5px 2px 5px 2px;
	font-size: 10px;
	width: 50%;
	color: white;
	background: #424242;
}

.check {
	display: flex;
	margin-top: 4px;
}

.check p {
	font-size: 10px;
	line-height: 14px;
	text-align: left;
}

.check input{
	width: auto;
	text-align: left;
	display: block;
	margin: 1px 4px 0 0;
}

.check input:hover {
	cursor: pointer;
}

@media screen and (min-width:425px) {.submit {margin-bottom: 20px;}}
@media screen and (min-width:485px) {.submit {margin-bottom: 40px;}}
@media screen and (min-width:545px) {.submit {margin-bottom: 60px;}}
@media screen and (min-width:625px) {.submit {margin-bottom: 80px;}}
@media screen and (min-width:695px) {.submit {margin-bottom: 100px;}}
@media screen and (min-width:767px) {.submit {margin-bottom: 120px;}}


/* Footer-Bild */

.thuja {
    position: relative;
    width: 50%;
    z-index: 2;
}

.thuja img {
    width: 100%;
    height: auto;
}

/* Footer */
.full-footer {
	background: #FFF;
	margin-top: -130px
}

footer {
    width: 80%;
    background: #882a3a;
    color: white;
    padding: 30px 10%;
    z-index: 3;
    position: relative;
    margin-top: -5px;
}

.footer {
    max-width: 1150px;
    margin: -5px auto 0;
}

footer p {
	margin: 0 0 14px 0;
	padding: 0px;
}

footer a {
	text-decoration: none;
}

.fa, .fas {
    font-weight: 900;
    margin-right: 10px;
}

footer a,
footer a:visited,
footer a:active,
footer a:focus {
	color: #FFF;
}

#input-submit:hover {
	cursor: pointer;
	box-shadow: 0 1px 1px 0.5px #424242;
}

.success, .error {
    position: fixed;
    text-align: center;
    width: 80%;
    margin: 480px 0 0 7%;
    padding: 10px;
    z-index: 9;
}

@media screen and (min-width:560px) {.success, .error {margin: 10px 0 0 7%;}}
@media screen and (min-width:1260px) {.success, .error {width: 20%;margin: 10px 0 0 39.5%;}}

.success {
    color: #8bc34a;
    background: #f2fde9;
    border: 2px solid #8bc34a;
}

.error {
    color: #f44336;
    background: #fde9e9;
    border: 2px solid #f44336;
}

@media screen and (min-width:370px) {.full-footer {margin-top: -140px}}
@media screen and (min-width:420px) {.full-footer {margin-top: -150px}}
@media screen and (min-width:460px) {
	header img {width: 60%;}
	.full-footer {margin-top: -160px}
}
@media screen and (min-width:500px) {.full-footer {margin-top: -170px}}
@media screen and (min-width:580px) {.full-footer {margin-top: -180px}}
@media screen and (min-width:610px) {.full-footer {margin-top: -190px}}
@media screen and (min-width:640px) {.full-footer {margin-top: -200px}}
@media screen and (min-width:670px) {.full-footer {margin-top: -210px}}
@media screen and (min-width:710px) {.full-footer {margin-top: -220px}}
@media screen and (min-width:750px) {.full-footer {margin-top: -230px}}


@media screen and (min-width:768px) {
	header img {width: 40%;}
	.images {
		float: left;
		width: 55%;
		margin-right: 5%;
	}

	.contact {
		float: left;
		width: 30%;
	}
	
	.full-footer {margin-top: -230px}
	
	.submit {
		margin-bottom: 0;
	}
}

@media screen and (min-width:780px) {.full-footer {margin-top: -240px}}
@media screen and (min-width:780px) {.full-footer {margin-top: -250px}}
@media screen and (min-width:860px) {.full-footer {margin-top: -260px}}
@media screen and (min-width:900px) {.full-footer {margin-top: -270px}}
@media screen and (min-width:940px) {.full-footer {margin-top: -280px}}
@media screen and (min-width:980px) {.full-footer {margin-top: -290px}}
@media screen and (min-width:1020px) {.full-footer {margin-top: -300px}}
@media screen and (min-width:1060px) {.full-footer {margin-top: -310px}}
@media screen and (min-width:1100px) {.full-footer {margin-top: -320px}}
@media screen and (min-width:1140px) {.full-footer {margin-top: -330px}}
@media screen and (min-width:1180px) {.full-footer {margin-top: -340px}}
@media screen and (min-width:1220px) {.full-footer {margin-top: -350px}}
@media screen and (min-width:1260px) {.full-footer {margin-top: -360px}}
@media screen and (min-width:1300px) {.full-footer {margin-top: -370px}}

@media screen and (min-width:1300px) {
	header img {width: 510px;}

	
	.left {
		float: left;
		width: 60%;
	}
	
	.right {
		float: left;
		width: 40%;
	}
	
	.full-footer {
		margin: 0;
	    position: relative;
	    top: -400px;
	}
	
	.thuja img {
	    width: 700px;
	}
}