/* Variables */

:root {
	--primary-color: #ada27e;
	--secondary-color: white;
	--color-one: #dbd7d1;
	--color-two: #15778e;
	--color-three: #4db99e;
	--color-four: #e9e3d0;
	--basic-unit: 20px;
	--primary-font: "freight-sans-pro",sans-serif;
	--secondary-font: "freight-neo-pro",sans-serif;
	--third-font:"freight-big-pro",serif;
}

/* Basic Styles */

body {
	font-family: var(--primary-font);
	font-weight: 400;
	font-size: var(--basic-unit);
	line-height: 1.2;
	color: var(--primary-color);
}

p {
	padding-top: 0.65rem;
	padding-bottom: 0.65rem;
}

/* aussenabstand anpassen */
.outer-pad {
	padding-left: calc(var(--basic-unit) * 2);
	padding-right: calc(var(--basic-unit) * 2);
}


/* Header */

.header {
	background-color: var(--secondary-color);
	/* schatten unten */
	/*box-shadow: 1px 1px 4px 0 rgba(0,0,0,.1);*/
}

.header .logo {  
	/* change font styles */
  font-size: 1em;
  text-transform: uppercase;
	font-weight: 300;
	letter-spacing: 1px;
	color: var(--primary-color);
	
	/* change spacing */
	padding: calc(var(--basic-unit) / 2) calc(var(--basic-unit) * 2);
}

.header nav {
	font-weight: 400;
	color: var(--primary-color);
}

/* Block Styles */

.font-one {
	font-family: var(--primary-font);
}

.font-two {
	font-family: var(--secondary-font);
}

/* Headline */

.headline p strong {
	/* Auszeichnung der Headline */
	border-bottom: 1px solid var(--primary-color);
}

.bodytext em {
	font-size: 400%;
	font-weight: 300;
}

.bodytext h3 {
	font-family: var(--third-font);
	font-weight: 300;
	font-size: 6em;
	color: var(--color-three);
}



/* Footer */

footer {	
	padding: var(--basic-unit);
	background-color: var(--color-two);
}

footer nav ul {
	display: flex;
	flex-direction: row;
	justify-content: space-around;
}

footer a {
	color: var(--color-three);
	text-decoration: none;
}