@font-face {
	font-family: dual300;
	src: url('Dual-300.ttf') format('truetype');
	font-weight: 300;
}

@font-face {
	font-family: dual600;
	src: url('Dual-W00-600.ttf') format('truetype');
	font-weight: 600;
}

body {
	margin: 0 0;
	color: #252823; /* primary-text-color */ 
}

a, p a {
	color: inherit;
	text-decoration: none;
	font-family: "dual300", sans-serif;
	font-weight: bold;
}


h1 {
	text-align: center;
	font-family: "dual600", sans-serif;
	padding: 0 0;
}

h2, h3, h4, h5, h6, p, span, li {
	font-family: "dual300", sans-serif;
}

ul li {
	line-height: 2em;
}

a, p, span, li {
	font-style: normal;
	font-size: normal;
	line-height: 2em;
}

p, span {
	font-weight: 300;
}

.nice-header, nice-footer {
	background-color: rgb(221, 79, 42); /* orange-color */
}
			
.nice-header, .nice-footer {
	text-align: center;
}
	
.nice-header {
	padding-top: 2.8em; /* header-padding-top */
	padding-bottom: 2.8em; /* header-padding-bottom */
}

.nice-footer {
	padding-top: 14.5em; /* footer-padding-top */
	padding-bottom: 18.5em; /* footer-padding-bottom */
}

.nice-header svg {
	width: 15%;
	height: 15%;
	max-width: 200px;
	max-height: 200px;
}

.nice-footer svg {
	width: 20%;
	height: 20%;
	max-width: 160px;
	max-height: 160px;
}

div.short-hr {
	margin: 0 auto;

}

div.short-hr hr {
	width: 3em;
	border: 2px solid;
	border-color: #252823; /* primary-text-color */
	background-color: #252823; /* primary-text-color */
}

.intro {
	text-align: justify;
}

.outro {
	text-align: left;
	font-weight: 600;
}

.outro img {
	width: 25%;
	height: 25%;
}

.contact-companyname {
	font-weight: bold;
}

.container {
	margin: 0 auto;
}

@media (max-width: 30em) { /* Kleines Layout */ 
	.main, .contact {
		width: 94%;
	}
	.nice-header svg {
		width: 25%;
		height: 25%;
	}

	.nice-footer svg {
		width: 30%;
		height: 30%;
	}
}

@media (min-width: 30em) and (max-width: 60em) { /* Kompaktes Layout */ 
	.main, .contact {
		width: 80%;
	}
	.nice-header svg {
		width: 20%;
		height: 20%;
	}

	.nice-footer svg {
		width: 25%;
		height: 25%;
	}
}

@media (min-width: 60em) { /* Großes Layout */ 
	.main, .contact {
		width: 60%;
	}
}


.contact p, .nice-footer p, .impressum p {
	text-align: center;
}

div.contact {
	padding-bottom: 2em;
}

.nice-footer p, .impressum p {
	color: white /* white-color */
}

.impressum {
	padding-top: 1em;
}

.impressum a {
	font-family: "dual600";
}

.divider {
	background: rgb(221, 79, 42); /* orange-color */
}