/*
Theme Name: Divi Child Theme
Theme URI: https://deineseite.de
Description: Ein Child-Theme für Divi.
Author: Dein Name
Author URI: https://deineseite.de
Template: Divi
Version: 1.0
*/


/*Allgmeine Styles*/
.nf_hidden {
    display: none!important;
}



/*FAQ-Styles*/
:root {
    --nf_faq-text-color-active: blue;
    --nf_faq-speed: 0.25s;
}


#nf_faq-module {
    display: flex;
    flex-direction: column;
}


.nf_faq-item {
    border-top: 1px solid black;
}

.nf_faq-item.last {
    border-bottom: 1px solid black;
}

.nf_question-area {
    display: flex;
    justify-content: space-between;
    align-items: center;
    padding: 20px;
    cursor: pointer;
}

.nf_question-area.nf_active .nf_question {
    color: var(--nf_faq-text-color-active);
}

.nf_answer {
    padding: 0px 20px;
    display: grid;
    grid-template-rows: 0fr;
    transition: grid-template-rows var(--nf_faq-speed) ease, padding var(--nf_faq-speed) ease;
}

.nf_answer.nf_open {
    padding: 20px;
    padding-top: 0px;;
    grid-template-rows: 1fr;
}

.nf_answer-text {
    overflow: hidden;
}

.nf_arrow-icon {
    transition: transform var(--nf_faq-speed) ease;
    width: 30px;
    height: 30px;
    flex-shrink: 0;
}

.nf_arrow-icon.nf_active {
    transform: rotate(180deg);
}

.nf_question {
    margin: 0px;
    padding: 0px;
    line-height: 25px;
}







/*Styles für Animation*/
.nf_fadeable {
    opacity: 0;
    transform: translateY(20px);
    transition: opacity 1s ease, transform 1s ease;
}
  
.nf_fadeable.visible {
    opacity: 1;
    transform: translateY(0);
}

body.et-fb .nf_fadeable {
    opacity: 1 !important;
    transform: translateY(0) !important;
}




/*Header Styles*/
.nf_header {
	width: 100%;
	position: fixed;
	top: 0px;
	left: 0px;
}

.nf_header-wrapper {
	background-color: rgba(255, 255, 255, 0.7);
	backdrop-filter: blur(5px);
}

.nf_header-content {
	margin: 0 auto;
	display: flex;
	justify-content: space-between;
	max-width: 1120px;
	width: 80%;
	align-items: center;
}

@media (max-width: 768px) {
	.nf_header-content {
		width: 90%;
	}
}

.nf_header-content img {
	width: 50px;
	height: 50px;
}

.nf_nav {
	display: flex;
	gap: 20px;
	font-size: 16px;
}

.nf_nav a {
	color: rgba(63, 63, 63, 0.84);
	transition: color 0.3s ease;
}

.nf_nav a:hover {
	color: black;
}

#nf_hamburger {
	display: none;
	width: 40px;
	height: 40px;
}

.nf_nav.mobile {
	display: none;
}


@media(max-width: 850px) {
	.nf_nav {
		display: none;
	}
	
	#nf_nav-btn {
		display: none;
	}
	
	#nf_hamburger {
		display: block;
	}
	
	.nf_nav.mobile {
		display: flex;
		flex-direction: column;
		gap: 20px;
		height: 100vh;
		padding: 60px 10%;
		transform: translateX(-100vw);
		background-color: rgba(255, 255, 255, 0.7);
		backdrop-filter: blur(5px);
		position: absolute;
		transition: transform 0.3s ease;
	}
	
	.nf_nav.mobile a {
		color: black;
		text-decoration: underline;
	}
	
	.nf_nav.mobile.active {
		transform: translateX(0vw);
	}
}