/* ######################### Navigation ######################### */
.navbar-nav {
	margin: 0;
	padding: 0;
	position: relative;
}
/* ######################### Navigation ######################### */


#jawnav > ul > li.has-sub > a::after { border-bottom: 1px solid #000000;  border-right: 1px solid #000000;}
#jawnav > ul > li.has-sub:hover > a::after { background-color: #f5f5f5;}
#jawnav span.inner {  background: #fedd01; border: 1px solid #ddd;color: #444; }
#jawnav ul ul li a { font-size: 20px; color: #686868;}
#jawnav ul ul li:hover > a,
#jawnav ul ul li a:hover,
#jawnav ul ul li.current > a {}
#jawnav ul ul li.has-sub > a::after { border-bottom: 1px solid #000;  border-right: 1px solid #000;}
#jawnav.align-right ul ul li.has-sub > a::after { }
#jawnav ul ul li.has-sub:hover > a::after { }

/* STYLE CSS */

/*
	Copyright: (c) 2015 JoomlArtWork.com, http://joomlartwork.com/
*/

#jawnav { z-index:99999; }
#jawnav,
#jawnav ul,
#jawnav ul li,
#jawnav ul li a,
#jawnav #menu-button { margin: 0; padding: 0; border: 0; list-style: none; line-height: 1; display: block; position: relative; -webkit-box-sizing: border-box; -moz-box-sizing: border-box; box-sizing: border-box;}
#jawnav:after,
#jawnav > ul:after { content: "."; display: block; clear: both; visibility: hidden; line-height: 0; height: 0;}
#jawnav #menu-button { display: none;}
#jawnav { width: auto;}
#jawnav > ul > li { float: left;}
#jawnav.align-center > ul { font-size: 0; text-align: center;}
#jawnav.align-center > ul > li { display: inline-block; float: none;}
#jawnav.align-center ul ul { text-align: left;}
#jawnav.align-right > ul > li { float: right;}
#jawnav.align-right ul ul { text-align: right; }
#jawnav > ul > li > a { padding: 20px; text-decoration: none;  text-transform: uppercase; box-sizing: border-box; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease;}
#jawnav > ul > li.has-sub > a { padding-right: 25px;}
#jawnav > ul > li.has-sub > a::after { position: absolute; top: 24px; right: 10px;  width: 4px; height: 4px;   content: "";  -webkit-transform: rotate(45deg);  -moz-transform: rotate(45deg);  -ms-transform: rotate(45deg);  -o-transform: rotate(45deg);  transform: rotate(45deg);}
#jawnav ul ul {  position: absolute; left: -9999px; padding: 15px; z-index:1000; margin-left:-15px;}
#jawnav ul ul ul  { padding: 15px; z-index:1000; margin-top:-25px;}
#jawnav span.inner {  border-radius: 5px; box-sizing: border-box; display:block; padding:10px; box-shadow: 0 6px 12px rgba(0, 0, 0, 0.176);}
#jawnav li:hover > ul { left: auto;}
#jawnav.align-right li:hover > ul { right: 0;}
#jawnav ul ul ul { margin-left: 100%; top: 0;}
#jawnav.align-right ul ul ul { margin-left: 0; margin-right: 100%;}
#jawnav ul ul li {}
#jawnav ul li:hover > ul > li {}
#jawnav ul ul li a { padding: 15px 20px; width: 220px;  text-decoration: none; -webkit-transition: all 0.15s ease; -moz-transition: all 0.15s ease; -o-transition: all 0.15s ease; transition: all 0.15s ease;}
#jawnav ul ul li.has-sub > a::after {  position: absolute;  top: 19px;  right: 10px;  width: 4px;  height: 4px; content: ""; -webkit-transform: rotate(-45deg);  -moz-transform: rotate(-45deg);  -ms-transform: rotate(-45deg);  -o-transform: rotate(-45deg);  transform: rotate(-45deg);}
#jawnav.align-right ul ul li.has-sub > a::after {  right: auto;  left: 10px;  border-bottom: 0;  border-right: 0;}
#jawnav i { margin-right: 10px}
/* submenu fadein */
@-webkit-keyframes fadeIn { from { opacity: 0; } 100% { opacity: 1; }}
@keyframes fadeIn { from { opacity: 0; } 100% { opacity: 1; } }
.fadeIn { -webkit-animation-name: fadeIn; animation-name: fadeIn;}
#jawnav li:hover > ul {  -webkit-animation-duration: .5s;  animation-duration: .5s;  -webkit-animation-fill-mode: both;  animation-fill-mode: both; animation-name: fadeIn;}

@media (max-width: 1024px) {
#jawnav {width: 100%;}
#jawnav ul {width: 100%;display: none;  }
#jawnav.align-center > ul,
#jawnav.align-right ul ul { text-align: left; }
#jawnav ul li,
#jawnav ul ul li,
#jawnav ul li:hover > ul > li { width: 100%; height: auto; }
#jawnav ul li a,
#jawnav ul ul li a {width: 100%;}
#jawnav > ul > li,
#jawnav.align-center > ul > li,
#jawnav.align-right > ul > li { float: none; display: block; }
#jawnav ul > li > a { }
#jawnav ul ul li a { padding: 20px 20px 20px 20px; }
#jawnav ul ul li a { padding-left: 40px; }
#jawnav ul ul ul li a { padding-left: 60px; }
#jawnav ul ul ul ul li a { padding-left: 80px; }
#jawnav ul ul,
#jawnav ul ul ul { position: relative; left: 0;  right: auto;  width: 100%; margin: 0; }
#jawnav > ul > li.has-sub > a::after,
#jawnav ul ul li.has-sub > a::after {  display: none; }
#jawnav li:hover > ul {animation-name: none;}
#jawnav #menu-button { display: block; padding: 15px; cursor: pointer; text-transform: uppercase;}
#jawnav #menu-button::after { content: ''; position: absolute; top: 17px; right: 20px;  display: block;  width: 24px;  height: 1px;}
#jawnav #menu-button::before { content: ''; position: absolute; top: 25px;  right: 20px; display: block;  width: 24px;  height: 7px;}
#jawnav .submenu-button { position: absolute;  z-index: 10; right: 0; top: 0; display: block; height: 52px; width: 52px; cursor: pointer;}
#jawnav .submenu-button::after { content: ''; position: absolute;  top: 21px; left: 26px; display: block; width: 1px; height: 11px; z-index: 99;}
#jawnav .submenu-button::before { content: ''; position: absolute; left: 21px; top: 26px; display: block; width: 11px; height: 1px; z-index: 99;}
#jawnav .submenu-button.submenu-opened:after { display: none;}
#jawnav ul ul {  padding: 0;  margin-left:0;}
#jawnav ul ul ul  { padding:0; margin-top:0;}
#jawnav span.inner {border: none!important; border-radius: 0; box-shadow: none;  padding:0; }

}

/* ######################### Desktop-Navigation ######################### */
@media (min-width: 1025px) {

.navigation_mobile {
	display: none;
}

.navigation_desktop {
	float: right;
	margin: 53px 0 0 0;
}

.navigation_desktop ul li a {
	font-family: Teko;
	color: #686868;
	font-size: 24px;
	padding: 20px;
	text-transform: uppercase;
}

.navigation_desktop ul li {
	list-style: none;
	float: left;
}

.nav-child {
  position: absolute;
  display: none;
  z-index: 1;
  background-color: #fee236;
	margin: 20px 0 0 0;
	padding: 0 30px 0 0;
}

.nav-child li, .nav-child li a {
	margin: 0;
  padding: 15px;
	width: 100%;
}

.deeper.parent > a:after {
	position: absolute;
  content: ' ▾';
}

}



/* ######################### Desktop-Navigation ######################### */


/* ######################### Mobile-Navigation ######################### */
@media (min-width: 518px) and (max-width: 1024px) {

/* body {
	padding-top: 55px;
} */

.navigation_desktop {
	display: none;
}

.navi_ueberschrift {
	float: left;
	font-family: Teko;
	color: #686868;
	font-size: 24px;
	padding: 10px;
	text-transform: uppercase;
}

.hamburger_icon {
	float: right;
	margin: 7px;
}

.hamburger_icon > .hamburger_icon_line {
  width: 30px;
  height: 1px;
  background-color: #686868;
  margin: 9px;
}

.navigation_mobile {
	width: 100%;
	height: 55px;
	margin: 0;
	padding: 0;
	display: block;
/* 	position: fixed;
	top: 0;
	background-image: url("../images/hintergrund.png"); */
}

.navigation_mobile > ul {
	display: none;
	clear: both;
	position: relative;
}

.navigation_mobile ul li a {
	font-family: Teko;
	color: #686868;
	font-size: 20px;
	padding: 15px;
	text-transform: uppercase;
	background-color: #f4f4f4;
	display: block;
	border-top: 1px solid rgba(120, 120, 120, 0.15)
}

.navigation_mobile ul li {
	margin: -1;
	list-style: none;
	float: none;
	display: block;
}

.nav-child {
	display: none;
	padding-left: 10px;
	background-color: #686868;
}

}
/* ######################### Mobile-Navigation ######################### */


/* ######################### Mini-Navigation ######################### */
@media (min-width: 1px) and (max-width: 517px) {

/*body {
	padding-top: 55px;
}*/

.navigation_mobile {
	float: left;
	width: 100%;
	height: 55px;
	/*position: fixed;
	top: 0;
	background-image: url("../images/hintergrund.png"); */
}

.navigation_desktop {
	display: none;
}

.navigation_mobile {
	width: 100%;
	height: 55px;
	margin: 0;
	padding: 0;
	display: block;
}

.navi_ueberschrift {
	float: left;
	font-family: Teko;
	color: #686868;
	font-size: 24px;
	padding: 10px;
	text-transform: uppercase;
}

.hamburger_icon {
	float: right;
	margin: 7px;
}

.hamburger_icon > .hamburger_icon_line {
  width: 30px;
  height: 1px;
  background-color: #686868;
  margin: 9px;
}

.navigation_mobile > ul {
	display: none;
	clear: both;
	position: relative;
}

.navigation_mobile ul li a {
	font-family: Teko;
	color: #686868;
	font-size: 20px;
	padding: 15px;
	text-transform: uppercase;
	background-color: #f4f4f4;
	display: block;
	border-top: 1px solid rgba(120, 120, 120, 0.15)
}

.navigation_mobile ul li {
	margin: -1;
	list-style: none;
	float: none;
	display: block;
}

.nav-child {
	display: none;
	padding-left: 10px;
	background-color: #686868;
}

}
/* ######################### Mini-Navigation ######################### */