/* The Modal (background) */
.modal,
.modal-element {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 9500; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

.fc-modal,
.fc-modal-element {
  display: none; /* Hidden by default */
  position: fixed; /* Stay in place */
  z-index: 9600; /* Sit on top */
  padding-top: 100px; /* Location of the box */
  left: 0;
  top: 0;
  width: 100%; /* Full width */
  height: 100%; /* Full height */
  overflow: auto; /* Enable scroll if needed */
  background-color: rgb(0,0,0); /* Fallback color */
  background-color: rgba(0,0,0,0.4); /* Black w/ opacity */
}

/* Modal Content */
.modal-content,
.modal-element-content,
.fc-modal-content,
.fc-modal-element-content {
  background-color: #fefefe;
  margin: auto;
  padding: 20px;
  border: 1px solid #888;
  width: 80%;
}

/* The Close Button */
.close,
.close-element,
.fc-close-element,
.close-logo-modal {
  color: #aaaaaa;
  float: right;
  font-size: 28px;
  font-weight: bold;
}

.close:hover,
.close:focus,
.close-element:hover,
.close-element:focus,
.fc-close-element:hover,
.fc-close-element:focus {
  color: #000;
  text-decoration: none;
  cursor: pointer;
}

.li_update_btn,
.li_del_btn,
.li_toggle_btn {
	position: relative;
	top: -10px;
	margin-left: 5px;
}

/* MOBILE */
@media only screen and (min-width: 280px) {
	#headerWrapper {
		width: 100%;
		padding: 30px 0px 0px 0px;
		margin-bottom: 50px;
		background-color: var(--farbe02);
	}
	
	.btn-save-navigation {
		float: left;
		background-color: #e30613;
		color: #ffffff;
		max-width: 200px;
		padding: 10px;
		margin-right: 20px;
		cursor: pointer;
		border: none;
		outline: none;
	}

	.btn-save-navigation:hover {
		background-color: #0069b4;
	}
	
	
	#siteHeader {
		padding: 20px;
	}
	
	.languageDropdown {
		display: block;
		padding: 10px;
		text-align: center;
	}
	.Homesite_Container {
		background-image: url(/media/homepage_main_background.png);
		background-position: center bottom;
		background-size: cover;
		background-repeat: no-repeat;
		background-attachment: fixed;
	}
	#header-menu-wrapper {
		text-align: right;
	}	
	#menu-members-area {
		list-style: none;
		padding: 0px;
		display: flex;
		justify-content: center;
	}
	#menu-members-area li {
		display: inline-block;
		margin: 0px 10px;
	}
	#menu-members-area li a {
		text-decoration: none;
		color: #000;
		font-weight: bold;
	}
	#logoMenuWrapper {
		padding: 10px;
		box-sizing: border-box;

	}
	#mainNavigation ul {
		list-style: none;
	}
	#mainNavigation ul li {
		display: inline-block;
		margin: 0px 10px;
	}
	.nav-link {
		text-decoration: none;
		color: #000;
		font-weight: bold;
		font-size: 1.25rem;
	}
	.nav-link:hover,
	.nav-link:active,
	.nav-link:focus {
		text-decoration: underline;
	}
	
	.mobileNav {
		display: block;
	}
	
	
	#mobileMenuBody {
		padding: 0px 15px;
		box-sizing: border-box;
		display: none;
		position: relative;
		clear:both;
	}
	
	.menu-point {
		margin-bottom: 10px;
	}
	
	.menu-point:hover,
	.menu-point:active,
	.menu-point:focus {
		color: #e30613;
	}
	
	.menu-top {
		color: var(--farbe01);
		font-family: var(--font01);
		font-weight: bold;
		font-size: 1.1rem;
		cursor: pointer;
		text-transform: uppercase;
	}
	
	.menu-top:hover {
    text-decoration: underline;
	}
	
	.topNavLinks:hover {
		color: #e30613 !important;
    text-decoration: underline !important;		
	}
	
	.menu-top i {
		position: relative;
		top: -3px;
		left: 5px;
	}
	
	.submenue-link {
		color: #575756;
		font-size: 1rem;
		cursor: pointer;
		margin-bottom: 15px;
	}
	
	.submenue-link a {
		text-decoration: none;
		color: #575756;
		font-size: 1rem;
	}
	
	.submenue-link:last-child {
		margin-bottom: 0px;
	}
	
	.submenue {
		display: none;
		background-color: #ffffff;
		border: 1px solid rgba(0, 0, 0, .15);
		padding: 10px;
		box-sizing: border-box;
		margin-top: 5px;
	}
	
	.active {
		display: block;
	}
	
	.active-top {
		text-decoration:underline;
	}
	
	
	#logoMenuWrapper {
		display: flex;
		justify-content: space-between;
	}
	
	.mobileNavButton {
		font-size:44px;
		color:#000000;
	}
	
	.submenue-link a:hover {
		text-decoration: underline;
	}
	
	.top-lvl-link {
		text-decoration: none;
		color: inherit;
	}
	
	#title_container {
		color: var(--farbe01);
		font-family: var(--font01);
		text-align: center;
		font-size: 30px;
		float: left;
		margin: 0px 15px 15px 15px;
	}
	
	.styleLine {
		width: 100%;
		margin: 0 auto;
		height: 4px;
		background-color: var(--farbe01);
		box-shadow: none !important;
		border: none !important;
		border-style: none !important;
	}
	
	.menu_editable {
		border: 4px solid yellow;
	}
	
	.menu_editable > #logoMenuWrapper .circle-abs-menu {
		display: block;
		position: absolute;
		right: 10px;
		top: 15px;
		z-index: 7000;
	}
	
	.menu_editable > #mobileMenuBody .circle-abs-menu {
		display: block;
		position: absolute;
		right: -25px;
		top: -35px;
		z-index: 7000;
	}

	.nav_selected {
		text-decoration: underline;
		font-weight: bold;
	}	
	
	
}

/* TABLET */
@media only screen and (min-width: 768px) {
	
	.languageDropdown {
		text-align: right;
	}
	
}

/* DESKTOP */
@media only screen and (min-width: 1024px) {
	#siteHeader {
		padding: 0px;
	}
	#headerWrapper {
		width: 100%;
		padding: 30px 0px 0px 0px;
		margin-bottom: 50px;
	}
	
	#logoMenuWrapper {
		display: none;
	}
	
	.main-logo {
		margin-right: 50px;
	}
	
	#menu-members-area {
		justify-content: flex-end;
	}
	
	.logoMenuContainer {
		padding: 10px 0px;
		display: flex;
		justify-content: center;
		width: fit-content;
		margin: 0 auto;
	}
	
	#mobileMenuBody {
		padding: 0 10px;
		padding: 0px;
		display: flex;
		align-items: center;
		justify-content: space-between;
		width: 100%;
	}
	
	.menu-point {
		margin-right: 20px;
		position: relative;
	}
	
	.submenue {
		position: absolute;
		top: 25px;
		left: 0px;
		width: max-content;
	}
	
	.mobileNav	{
		display: none;
	}
	#title_container {
		float: none;
		margin: 10px 0px 15px 0px;
	}
	.styleLine {
		width: 60%;
		margin: 0 auto;
		height: 4px;
		background-color: var(--farbe01);
		box-shadow: none !important;
		border: none !important;
		border-style: none !important;
	}
		
}