body
{
	margin: 0px !important;
}

#mobile-menu
{
	display:block;
	height: 100vh;
	position: fixed;
	z-index: 900;
	overflow: hidden;
	width: 100vw;
	background-color: #182333;
	padding: 0;
	box-sizing: border-box;
	top:-100vh;
	transition: transform 0.5s ease-in-out;
	z-index:900;
}

.starthref
{
	color: #d51029;
	font-size:18px;
	font-weight:300;
}

.starthref:hover
{
	color: #d51029;
	font-size:18px;
	text-decoration: none;
}

#Abstand
{
	height:15px;
}

#nav2
{
	position: absolute;
	width:100vw;
	height:calc(100vh - 100px);
	top:100px;
	z-index:901;
	display:none;
	padding-top:0px;
	margin-top: 0px !important;
}

.gonextdepth
{
	right:35px;
	height: 35px;
	width: 35px;
	margin-top: 10px;
	position: absolute;
	cursor: pointer;
}

.sub-menu2 > .menu-item > .gonextdepth
{
	right:55px;
}

.gonextdepth:hover
{
	fill: #e2b64f !important;
	filter: invert(0.5) sepia(1);
}


.backbutton
{
	height: 35px;
	width: 35px;
	display: block;
	transform: rotate(180deg);
	margin-left: -10px;
	margin-top: 32px;
	margin-bottom: 10px;
	cursor: pointer;
}

.backbutton:hover
{
	filter: invert(0.5) sepia(1);
}

ul
{
	list-style-type: none;
}

.sub-menu2
{
	position: fixed;
	padding-inline-start: 0px;
	width:100vw;
	top: 100px;
	margin-top: 0px !important;
}

.sub-menu2 > li
{
	display:none;
}

#nav2 .menu-item > a
{
	color: #d51029 !important;
    text-decoration: none;
    border-bottom: none;
    font-weight: 300;
	list-style: none;
    font-size: 35px;
    line-height: 1.6;
	padding-left:0px;
	list-style-type: none;
	text-transform: uppercase;
}

#nav2 .menu-item > a:hover
{
	color: #d51029 !important;
    text-decoration: none;
    border-bottom: none;
    font-weight: 300;
	list-style: none;
    font-size: 35px;
    line-height: 1.6;
	padding-left:0px;
	list-style-type: none;
	text-transform: uppercase;
}

#nav2 .menu-breadcrumb
{
	margin-bottom:10px;
	color: white;
}

#nav2 .menu-breadcrumb > a
{
	margin-bottom:10px;
	color: white;
}

#nav2 .menu-breadcrumb > a:hover
{
	text-decoration:none;
	color: #e2b64f !important;
	cursor: pointer;
}

.backbutton
{
	display:none;
	margin-left: -5px;
}

/* BURGER NAVI ++*/
.containerButton {
  display: inline-block;
  cursor: pointer;
  position: fixed;
  z-index:9999;
  right: 21px;
  top: 30px;
  display:none;
  position: absolute;
}


.bar1, .bar2, .bar3 {
  width: 36px;
  height: 4px;
  background-color: white !important;
  transition: 0.4s;
  margin: 6px 0;
  border-radius: 10px;
  z-index:9999;
}

.bar2
{
  transition: 0.1s;
}

.change .bar1
{
	transform:translateY(13px);
	transition-delay: 0.15s;
}

.change .bar2
{
    top: 0;
    opacity: 0;
    transition: top 0.15s ease, opacity 0.15s 0.12s ease; 
}

.change .bar3
{
	transform:translateY(-13px);
	transition-delay: 0.15s;
	
}

.change2 .bar1
{
	transform: translateY(10px) rotate(45deg);
	transition-delay: 0.2s;
}

.change2 .bar3
{
	transform: translateY(-10px) rotate(-45deg);
	transition-delay: 0.2s;
}

/* BURGER NAVI --*/

.From1To2
{
  	animation: From1To2 0.6s ease-in-out;
	left:-100vw;
}

@keyframes From1To2 
{
  	0% 
  	{ 	
    	left:0vw;
  	}
  	100%
  	{ 
    	left:-100vw;
  	}
}

.From2To3
{
  	animation: From2To3 0.6s ease-in-out;
	left:-200vw;
}

@keyframes From2To3 
{
  	0% 
  	{ 	
    	left:-100vw;
  	}
  	100%
  	{ 
    	left:-200vw;
  	}
}

.From3To4
{
  	animation: From3To4 0.6s ease-in-out;
	left:-300vw;
}

@keyframes From3To4 
{
  	0% 
  	{ 	
    	left:-200vw;
  	}
  	100%
  	{ 
    	left:-300vw;
  	}
}

.From2To1
{
  	animation: From2To1 0.6s ease-in-out;
	left:0vw;
}

@keyframes From2To1 
{
  	0% 
  	{ 	
    	left:-100vw;
  	}
  	100%
  	{ 
    	left:0vw;
  	}
}

@-webkit-keyframes From2To1 
{
  	0% 
  	{ 	
    	margin-left:-100vw;
  	}
  	100%
  	{ 
    	margin-left:0vw;
  	}
}

.From3To1
{
  	animation: From3To1 0.6s ease-in-out;
	left:0vw;
}

@keyframes From3To1 
{
  	0% 
  	{ 	
    	left:-200vw;
  	}
  	100%
  	{ 
    	left:0vw;
  	}
}

.From4To1
{
  	animation: From4To1 0.6s ease-in-out;
	left:0vw;
}

@keyframes From4To1 
{
  	0% 
  	{ 	
    	left:-300vw;
  	}
  	100%
  	{ 
    	left:0vw;
  	}
}

.From4To2
{
  	animation: From4To2 0.6s ease-in-out;
	left:-100vw;
}

@keyframes From4To2 
{
  	0% 
  	{ 	
    	left:-300vw;
  	}
  	100%
  	{ 
    	left:-100vw;
  	}
}

.From3To2
{
  	animation: From3To2 0.6s ease-in-out;
	left:-100vw;
}

@keyframes From3To2 
{
  	0% 
  	{ 	
    	left:-200vw;
  	}
  	100%
  	{ 
    	left:-100vw;
  	}
}

.From4To3
{
  	animation: From4To3 0.6s ease-in-out;
	left:-200vw;
}

@keyframes From4To3 
{
  	0% 
  	{ 	
    	left:-300vw;
  	}
  	100%
  	{ 
    	left:-200vw;
  	}
}

.ToDown
{
	transform: translateY(100vh);
	-webkit-transform: translateY(100vh);
	-moz-transform: translateY(100vh);
	-ms-transform: translateY(100vh);
	-o-transform: translateY(100vh);
	transform: translateY(100vh);
  	animation: fromTopToCenter 0.75s ease-in-out;
}

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

.ToTop
{
	animation: ToTop 0.75s ease-in-out;
}

@keyframes ToTop 
{
  	0% 
  	{ 	
    	top:0vh;
  	}
  	100%
  	{ 
    	top:-100vh;
  	}
}

.ToTopSub
{
	animation: ToTopSub 0.75s ease-in-out;
}

@keyframes ToTopSub 
{
  	0% 
  	{ 	
    	top:85px;
  	}
  	100%
  	{ 
    	top:-100vh;
  	}
}

.visible
{
  	animation: visible 0.7s ease-in-out;
}

@keyframes visible 
{
  	0% 
  	{ 	
    	opacity:0;
		display: none;
  	}
  	60%
  	{
      	opacity:0;
      	margin-left:20px;
  	}
  	100%
  	{ 
    	opacity:1 !important;
      	margin-left:0px;
		display: block;
  	}
}

.unvisible
{
  	animation: unvisible 0.3s linear;
}

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

.Left100
{
	left: -100vw;
}

.Left200
{
	left: -200vw;
}

.Left300
{
	left: -300vw;
}

@media all and (max-width: 1199px)
{
	.containerButton
	{
		display: inline-block !important;
	}
	
	#nav2 .menu-item > a
	{
		font-size: 35px !important;
		line-height: 1.6 !important;
	}
	
	#nav2 .menu-item
	{
		width:85vw !important;
		break-word: break-word !important;
	}
	
	#nav2 .menu-breadcrumb
	{
		margin-bottom: 25px !important;
		line-height:1.8 !important;
		width:85vw !important;
		font-family: "Bree Serif",Arial,Helvetica,sans-serif;
	}
	
	.gonextdepth
	{
		right:15px !important;
		height: 35px !important;
		width: 35px !important;
		margin-top:9px !important;
	}
	
	.sub-menu2 > .menu-item > .gonextdepth
	{
		right:45px !important;
	}
	
	.backbutton
	{
		height: 35px !important;
		width: 35px !important;
		margin-top: 32px;
	}
}


@media all and (max-device-width: 900px)
{
	#nav2
	{	
		margin-top: -5px !important;
	}
	
	.sub-menu2
	{
		margin-top: -6px !important;
	}
	
	.menu-item
	{
		word-break: break-word !important;
	}
	
	#logomenu
	{
		display:none;
	}
	
	#nav2 .menu-item > a
	{
		font-size: 20px !important;
		line-height: 1.6 !important;
	}
	
	#nav2 .menu-item
	{
		width:85vw !important;
		break-word: break-word !important;
	}
	
	#nav2 .menu-breadcrumb
	{
		margin-bottom: 25px !important;
		line-height:1.8 !important;
		word-break: break-word !important;
		width:85vw !important;
	}
	
	.gonextdepth
	{
		right:15px !important;
		height: 20px !important;
		width: 20px !important;
		margin-top:6px !important;
	}
	
	.sub-menu2 > .menu-item > .gonextdepth
	{
		right:45px !important;
	}
	
	.backbutton
	{
		height: 20px !important;
		width: 20px !important;
		margin-top: 32px;
	}
}