/* MAINMENU */
div#pretopmenu	{    position: absolute; right: 10px; margin: 30px 0 0 0;
	float: left;  width: auto; text-align: center;        transition: all 0.4s ease;    z-index: 100;
	color: #000000; display: flex; flex-wrap: wrap; align-content: stretch; align-items: center; justify-content: center; background-color: transparent; opacity: 0;}
div#pretopmenu .menu{ width: 100%;	height: 100%;	display: flex;	flex-wrap: wrap;	justify-content: space-between;	align-items: flex-start;	align-content: space-around;	flex-direction: column; }
div#pretopmenu.fixed {position: fixed; 	margin: 10px 0 0 0; -webkit-animation: fadeinout 1s linear forwards;	animation: fadeinout 1s linear forwards; opacity: 1;}
div#pretopmenu .open {display: block; -webkit-animation: fadeinout 1s linear forwards;	animation: fadeinout 1s linear forwards; text-align: center; }
div#pretopmenu .open img,  div#pretopmenu .closex img{ height: 40px; transition: all 0.4s ease; cursor: pointer;}
div#pretopmenu.fixed .open img,  div#pretopmenu.fixed .closex img{ height: 40px; transition: all 0.4s ease;}
div#pretopmenu.fixed .open img { content: url("/fileadmin/user_upload/Icons/menu.svg")}
div#pretopmenu a.link {color: white; font-size: 22px; font-weight: 600; font-family: "widescreen", sans-serif;}

div#pretopmenu .open img:hover,  div#pretopmenu .closex img:hover{transform: scale(1.1); cursor: pointer;}
div#pretopmenu .open.false {display: none; }
div#pretopmenu .closex {display: none; }
div#pretopmenu .closex.true {display: block; -webkit-animation: fadeinout 1s linear forwards;	animation: fadeinout 1s linear forwards;}

div.pretopmenulang {display: none; flex-direction: column; align-items: center; margin-top: 30px; line-height: 40px;}

@media only screen and (min-width: 1200px) {
	div.pretopmenulang {display: flex; }
	div#pretopmenu	{    right: 40px; margin: 60px 0 0 0;}
	div#pretopmenu .open img,  div#pretopmenu .closex img{ height: 40px; }
	div#pretopmenu.fixed .open img,  div#pretopmenu.fixed .closex img{ height: 40px; }

}
.hamburger {	display: flex;	align-self: center;	flex-direction: column;	justify-content: space-between;	width: 30px;	height: 20px;	cursor: pointer; margin-top: 4px; float: right;}
.hamburger .meat {	width: 75%;	transition: all 200ms ease-in-out;}
.hamburger .bottom-bun {	width: 50%;	transition: all 400ms ease-in-out;}
.hamburger:hover div {	width: 100%;}
.hamburger:hover .top-bun {	animation: burger-hover 1s infinite ease-in-out alternate;}
.hamburger:hover .meat {	animation: burger-hover 1s infinite ease-in-out alternate forwards 200ms;}
.hamburger:hover .bottom-bun {	animation: burger-hover 1s infinite ease-in-out alternate forwards 400ms;}
.textmenu {position: relative; float: left; cursor: pointer; font-weight: 400; color: #FFFFFF; font-size: 16px; letter-spacing: 3px; padding-right: 10px; display: none;}
.textmenuhamburger {padding: 0; }

@media screen and (min-width: 576px) {
	.textmenu {display: block;}
}

@media screen and (min-width: 768px) {
	.hamburger {	width: 60px; height: 30px; margin-top: 0; }
	.textmenu { font-size: 22px;  padding-right: 20px;}
}



.hamburgerclose.visible {	float: right; margin: 15px 7px;	}
.hamburgerclose {	width: 40px;	float: left;	margin: 7px;	cursor: pointer; display: none;}
.hamburgerclose.hamclose {display: block;}
.hamburgerclose div {	height: 2px;	background: #FFFFFF;	margin: 7px 0;	transition: all 0.5s;}
.hamburgerclose div:nth-child(1) {	transform: translateY(10px) rotate(135deg);	transition: all 0.5s;}
.hamburgerclose div:nth-child(2) {	transform: scale(0);	transition: all 0.5s;}
.hamburgerclose div:nth-child(3) {	transform: translateY(-10px) rotate(-135deg);	transition: all 0.5s;}



/* The side navigation menu */
/* MAINMENU */
#myCorrNav.sidenav {	height: 100%;	width: 100%; position: fixed; z-index: 99; 	top: 0; right: -100%;	background: rgba(0,0,0,1);	overflow-x: hidden; padding-top: 0; transition: 1s;	  -webkit-box-shadow: 0 4px 20px 3px rgba(112,112,112,0.5);	box-shadow: 0 4px 20px 3px rgba(112,112,112,0.5);}
#myCorrNav.sidenav a {	color: #707070; text-decoration: none;}
#myCorrNav.sidenav a:hover {	color: rgba(112,112,112,0.8); text-decoration: none;}
#myCorrNav.sidenav h1{font-size: 24px; padding-bottom: 20px;}
#myCorrNav.sidenav li a {font-size: 16px; font-weight: 400; line-height: 24px; text-transform: none; text-decoration: none;		transition: 0.3s;}
#myCorrNav.sidenav .screenmenu{display: none;}

#myCorrNav.sidenav .logo  { padding-top: 20px; text-align: center;}
#myCorrNav.sidenav .logo img { width: 143px; height: auto}
#myCorrNav.sidenav .accordionmenu { padding-top: 20px; }

@media screen and (min-width: 768px) {
	#myCorrNav.sidenav .logo  { padding-top: 50px; }
	#myCorrNav.sidenav .logo img { width: 233px;}
	#myCorrNav.sidenav .accordionmenu { padding-top: 50px; }
	#myCorrNav.sidenav h1{font-size: 30px; padding-bottom: 30px;}
	#myCorrNav.sidenav li a {font-size: 18px; line-height: 30px;}
}

@media screen and (min-width: 1920px) {
	#myCorrNav.sidenav h1{font-size: 50px; padding-bottom: 50px;}
	#myCorrNav.sidenav li a {font-size: 24px;  line-height: 36px; }
}



.typography  {max-width: 260px;}
.typography ul li {border-bottom: solid 1px #707070;}

#accordion.col-12 {padding: 0; display: flex;	flex-direction: column;	align-items: center;}
#accordion .btn, #accordion .btn a{	position: relative;		display: inline-block; 	box-sizing: border-box;		-moz-box-sizing: border-box;	cursor: pointer;	font-size: 22px; line-height: 40px;	letter-spacing: 2px; font-weight: bold; text-transform: uppercase; color: #707070; z-index: 1;}
#accordion .btn-link:hover {	color: rgba(112,112,112,0.8);	text-decoration: none;	}
#accordion .card {background-color: transparent; border: 0; max-height: 40px;}
#accordion .card .card-body {text-align: center;}
#accordion .card .card-body a {		font-weight: 400;  color: #FFFFFF; letter-spacing: 1px; margin: 0 5px;	-moz-transition-duration: 0.5s;
	-o-transition-duration: 0.5s;	-webkit-transition-duration: 0.5s;	transition-duration: 0.5s; }
 #accordion .btn a{  border: 0; }
#accordion .btn a:hover{  border: 0; }

@media screen and (min-width: 768px) {
	#accordion .card { max-height: 50px;}
	#accordion .btn, #accordion .btn a{		font-size: 30px; line-height: 50px;	letter-spacing: 2px;  }

}

@-webkit-keyframes slide-out-bottom {
	0% {		-webkit-transform: translateY(0);	transform: translateY(0);		opacity: 1;	}
	100% {		-webkit-transform: translateY(-100%);	transform: translateY(-100%);		opacity: 0;	}
}
@keyframes slide-out-bottom {
	0% {		-webkit-transform: translateY(0);	transform: translateY(0);		opacity: 1;	}
	100% {		-webkit-transform: translateY(-100%);	transform: translateY(-100%);		opacity: 0;	}
}

@-webkit-keyframes slide-in-bottom {
	0% {		-webkit-transform: translateY(-100%);	transform: translateY(-100%);		opacity: 0;	}
	100% {		-webkit-transform: translateY(0);	transform: translateY(0);		opacity: 1;	}

}
@keyframes slide-in-bottom {
	0% {		-webkit-transform: translateY(-100%);	transform: translateY(-100%);		opacity: 0;	}
	100% {		-webkit-transform: translateY(0);	transform: translateY(0);		opacity: 1;	}
}

@-webkit-keyframes slide-in-right {
	0% {		-webkit-transform: translateX(100);	transform: translateX(100);		opacity: 0;	}
	100% {		-webkit-transform: translateX(0%);	transform: translateX(0%);		opacity: 1;	}
}
@keyframes slide-in-right {
	0% {		-webkit-transform: translateX(100%);	transform: translateX(100);		opacity: 0;	}
	100% {		-webkit-transform: translateX(0%);	transform: translateX(0%);		opacity: 1;	}
}
@keyframes burger-hover {
	0% { width: 100%; }
	50% { width: 50%; }
	100% { width: 100%; }
}

@-webkit-keyframes fadeinout {
	0% { opacity: 0; }
	100% { opacity: 1; }
}

@keyframes fadeinout {
	0% { opacity: 0; }
	100% { opacity: 1; }
}


#footer-menu-language-nav { margin-top: 20px;  color: #7B7B7B; padding-top: 20px; }
#footer-menu-language-nav p{ text-align: center; color: #7B7B7B; font-size: 14px; line-height: 20px; letter-spacing: 1px; font-family: 'widescreen', sans-serif; font-weight: 600;}

@media screen and (min-width: 768px) {
	#footer-menu-language-nav {		padding-top: 50px;	}
	#footer-menu-language-nav p{ font-size: 16px; line-height: 24px; }

}