@charset "UTF-8";

/*
 @author       Julian Rademacher <julian@fiveandfriends.com>, 2020 – 2023
 @copyright    fiveandfriends GmbH, 2020 – 2023
 @version      2023-07-31
*/

#main-nav-wrap {
	background: rgba(8, 18, 1, 0.9);
	display: flex;
	flex-direction: row;
	flex-wrap: nowrap;
	align-items: center;
	justify-content: space-around;
	text-align: center;
	margin: 0;
	padding: 0;
	height: 60px;
	position: fixed;
	z-index: 100;
	width: 100%;
}

nav#logo {
	display: inline-block;
	font-size: 0;
	line-height: 0;
	position: absolute;
	left: calc(50% - 480px);
	width: 75px;
	height: 60px;
}

nav#logo a {
	display: block;
	height: 60px;
}

nav#logo img {
	height: 37px;
	height: 60px;
	width: 75px;
}

nav#main {
	display: flex;
	align-items: center;
	line-height: 0;
	height: 60px;
}

nav#main span.open {
	display: none;
}

nav#main ul {
	display: inline-block;
	font-size: 0;
	list-style: none;
	margin: 0;
	padding: 0;
}

nav#main ul li {
	display: inline-block;
}

nav#main > div > ul > li > a {
	display: none;
}

nav#main ul ul {
	font-size: 12px;
}

nav#main ul ul li {
	margin: 0 10px;
}

nav#main ul ul li a {
	color: #fff;
	font-family: 'Helvetica Now Display W01 Bold';
	font-size: 12px;
	font-stretch: normal;
	font-style: normal;
	font-weight: normal;
	letter-spacing: 0.67px;
	line-height: 2;
	text-align: center;
	text-decoration: none;
	text-transform: uppercase;
	padding: 5px;
}

nav#main ul ul li a.active,
nav#main ul ul li a:focus,
nav#main ul ul li a:hover,
#site-footer a:focus,
#site-footer a:hover {
	color: #e45d50;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-100 p a {
	background: url(../../img/logo/logo-footer.svg) no-repeat 50%;
	border-radius: 45%;
	display: block;
	font-size: 0;
	width: 100%;
	height: 150px;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-120 ul {
	list-style: none;
	margin: 0;
	padding: 0 15px 15px 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-120 ul li {
	margin: 0 0 15px;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-130 p a {
	display: inline-block;
	font-family: Sparose;
	font-size: 20px;
	line-height: 35px;
	margin: 12px 0 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-130 p a:first-of-type {
	margin: 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul {
	display: grid;
	font-size: 0;
	grid-template-columns: repeat(4, 60px);
	grid-template-rows: repeat(1, auto);
	justify-items: stretch;
	list-style: none;
	margin: 0;
	padding: 3px 15px 15px 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li a {
	border-radius: 45%;
	display: block;
	margin: 0;
	padding: 0;
	width: 50px;
	height: 50px;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(1) a {
	background: url(../../img/icons/instagram.svg) no-repeat 50% 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(1) a:focus,
#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(1) a:hover {
	background: url(../../img/icons/instagram_active.svg) no-repeat 50% 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(2) a {
	background: url(../../img/icons/facebook.svg) no-repeat 50% 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(2) a:focus,
#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(2) a:hover {
	background: url(../../img/icons/facebook_active.svg) no-repeat 50% 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(3) a {
	background: url(../../img/icons/linkedin.svg) no-repeat 50% 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(3) a:focus,
#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li:nth-child(3) a:hover {
	background: url(../../img/icons/linkedin_active.svg) no-repeat 50% 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row > .grid-column > #c296 > .ce-image.ce-center.ce-above {
	padding-right: 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row > .grid-column > #c296 figure {
	margin: 45px 0 0;
}

#site-footer .grid-container.grid-container-5-column > .grid-row > .grid-column > #c296 > .ce-right figure {
	text-align: right;
}

#site-footer .grid-container.grid-container-5-column > .grid-row > .grid-column > #c296 figure a {
	display: inline-block;
}

#site-footer .grid-container.grid-container-5-column > .grid-row > .grid-column > #c296 figure img {
	max-width: 180px;
	height: auto;
}

@media only screen and (max-width: 1024px) {
	nav#logo {
		display: inline-block;
		position: absolute;
		left: 33px;
		width: 75px;
	}

	#site-footer .grid-container.grid-container-5-column > .grid-row .grid-column.grid-column-140 ul li a {
		margin: 0 auto;
	}
}

@media only screen and (max-width: 835px) {
	body.menu-open {
		overflow: hidden;
	}

	nav#logo {
		display: inline-block;
		position: absolute;
		left: 18px;
		width: 75px;
	}

	nav#main span.open {
		cursor: pointer;
		display: block;
		padding: 10px;
		position: absolute;
		right: 18px;
		width: 32px;
		height: 24px;
	}

	nav#main #c2 {
		background: #081201;
		display: none;
		position: absolute;
		top: 60px;
		left: 0;
		width: 100%;
		height: calc(100vh - 60px);
		overflow-x: scroll;
	}

	body.menu-open nav#main #c2 {
		display: block;
	}

	nav#main #c2 ul {
		display: flex;
		flex-direction: column;
	}

	nav#main > div > ul > li > ul > li {
		display: block;
		margin: 0;
	}

	nav#main > div > ul > li > ul > li > a {
		display: block;
		padding: 30px;
	}

	nav#main > div > ul > li > ul > li > a > span {
		pointer-events: none;
	}
}
