/* nav toggle */
.nav-toggle {
  cursor: pointer;
  height: 2rem;
  right: 2rem;
  position: fixed;
  top: 1rem;
  width: 3rem;
  z-index: 2;
}
.nav-toggle:hover {
  opacity: 0.8;
}
.nav-toggle .nav-toggle-bar,
.nav-toggle .nav-toggle-bar::after,
.nav-toggle .nav-toggle-bar::before {
  position: absolute;
  top: 50%;
  -webkit-transform: translateY(-50%);
  -ms-transform: translateY(-50%);
  transform: translateY(-50%);
  background: #ffffff;
  content: "";
  height: 0.4rem;
  transition: all 0.5s;
  width: 100%;
}
.nav-toggle .nav-toggle-bar {
  margin-top: 0;
}
.nav-toggle .nav-toggle-bar::after {
  margin-top: 0.8rem;
}
.nav-toggle .nav-toggle-bar::before {
  margin-top: -0.8rem;
}
.nav-toggle.expanded .nav-toggle-bar {
  background: transparent;
}
.nav-toggle.expanded .nav-toggle-bar::after, .nav-toggle.expanded .nav-toggle-bar::before {
  background: #ffffff;
  margin-top: 0;
}
.nav-toggle.expanded .nav-toggle-bar::after {
  -ms-transform: rotate(45deg);
  -webkit-transform: rotate(45deg);
  transform: rotate(45deg);
}
.nav-toggle.expanded .nav-toggle-bar::before {
  -ms-transform: rotate(-45deg);
  -webkit-transform: rotate(-45deg);
  transform: rotate(-45deg);
}

/* nav*/ 
.nav {
  background: rgba(0, 0, 0, 0.6);
  height: 100vh;
  right: -30rem;
  padding: 2px;
  position: fixed;
  top: 0;
  transition: all 0.5s linear;
  width: 25vw;
  z-index: 1;
}
.nav.expanded {
  right: 0;
}
.nav ul {
  margin-top: 100px;
}
.nav ul li{
  margin: 0 5vw 0 0;
  padding: 10px;
  border: none;
  /*width: 18vw;*/
}

.nav ul a li {
   color: #fff;
   text-decoration: none;
   cursor: pointer;
}

.nav ul a:hover li {
   
   text-decoration: none;
   background: rgba(0,0,0,.1);
}

.nav ul ul li{
  list-style: none;
  margin: 0 20px ;
  padding: 0;
}
/*----HORIZONTAL-*/
.horizontal {
	float: right;
	padding-right: 5%;
}

.horizontal a {
  padding: 20px 0;
  font-size:1.2vmax;
  color: #fff;
}
.horizontal ul{
	/*background:#038;*/
}

.horizontal li {
  position:relative;
  padding:0 1.9rem;
  display: inline-block;
  /*background:#038;*/
}
.horizontal li:hover {
  background-color: #0074d9;
}

.horizontal li:hover > a {
  color: #fff;
}




.horizontal  ul {
  border:1px solid #b0a66b;
  visibility:hidden;
  opacity:0; 
  position:absolute;
  left:0;
  transition:all 0.5s ease-out;
  box-shadow:5px 5px 10px #666;
  background-color: #193f86;
}


.horizontal  ul li {
   width: 100%;
   padding: 0;
}


.horizontal ul a {
  padding:5px 10px;
  font-size:1vmax;
  display: block;
}

.horizontal ul ul {
  top:90%;
  left:10%;
  z-index:1100
}

.horizontal li:hover > ul {
  visibility:visible;
  opacity:1;
  width:14vw;
}
/*------.awn_h----------*/
.awn_h {z-index:9; position: relative; display:block;text-align:center;}

.awn_h ul{display: inline-block;}
.awn_h li {text-align:center; position: relative;display:inline-block;cursor:pointer;border-top: 1px solid #fff;}

.awn_h li a{background:rgb(125,125,125);color:#fff;display:inline-block;text-decoration: none;width: 130px;padding: 15px 10px;transition:all .5s;}
.awn_h li a:hover { background:rgb(185,185,185);color:#fff;transition:all .5s}
.awn_h li a.menu-expand:after{
	content: "";
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
	height: 10px;
	width: 10px;
	float:right;
	transform: rotate(45deg);
	}

.awn_h li ul {
    display: none; /* Verstecke die Untermenüs standardmäßig */
    position: absolute;
    /*top: 20px;  Positioniere das Untermenü direkt unter dem Hauptmenü 
    left: 0;*/
    padding: 0;
    margin: 0;

}

.awn_h li ul li a {
	/*position: relative;*/
    text-decoration: none;
    display: block;
	z-index:11;

}
.awn_h li ul li ul li{display: none;position:relative; z-index:12;top:-49px;left:150px;}

.awn_h li ul li ul li a {
	position: relative;
    text-decoration: none;
    display: block;
	z-index:11;;
}

.awn_h li:hover ul {
    display: block; /* Zeige Ebene1 bei Hover an */
}
.awn_h li ul li:hover ul li{
    display: block; /* Zeige Ebene2 bei Hover an */
}
.awn_h li ul li ul li:hover ul li{
    display: block; /* Zeige das Untermenü bei Hover an */
}
.awn_h ul li ul {position:absolute;margin:0}

/*------.awn_v----------*/
.awn_v {z-index:9; position: relative; display:block;}
.awn_v li {text-align:center; position: relative;display:inline-block;}

.awn_v li a{background:rgb(125,125,125);color:#fff;display:inline-block;text-decoration: none;width: 130px;padding: 15px 10px;transition:all .5s;border: 1px solid #fff;}
.awn_v li a:hover {background:rgb(185,185,185);color:#fff;transition:all .5s}
/*.awn_v li a.menu-expand:after{content: " \203A";}*/
.awn_v li a.menu-expand:after{
	content: " ";
	display: block;
	border-bottom: 2px solid #fff;
	border-right: 2px solid #fff;
	height: 10px;
	width: 10px;
	float:right;
	margin-top: 2px;
	transform: rotate(-45deg);
	}
.awn_v li ul {
    display: none; /* Verstecke die Untermenüs standardmäßig */
    position: absolute;
    top: 0; /* Positioniere das Untermenü direkt unter dem Hauptmenü */
    left: 150px;
    padding: 0;
    margin: 0;
}

.awn_v li ul li a {
	position: relative;
    text-decoration: none;
    display: block;
	z-index:11;
}
.awn_v li ul li ul li{display: none;position:relative; z-index:12;}


.awn_v li:hover ul {
    display: block; /* Zeige das Untermenü bei Hover an */
}
.awn_v li ul li:hover ul li{
    display: block; /* Zeige das Untermenü bei Hover an */
	left:0;
	top:0;
}
.awn_v ul li ul {position:absolute;margin:0}

.sliding-link{text-decoration: none;}

 #togglenav {display: none;   }

@media (max-width: 900px) {
    #togglenav {display: block;}

.nav {  width: 40vw;}
.awn_h {display: block;max-width: 250px;margin: 0 auto;}
}

@media (max-width: 600px) {

.awn_h {margin: 0 5%;}
}