/*
Todd Motto Labs
URL: www.toddmotto.com
*/

*:after,
*:before {
margin:0;
padding:0;
box-sizing:border-box;
-webkit-box-sizing:border-box;
-moz-box-sizing:border-box;
-webkit-font-smoothing:antialiased;
}

.nav-list, .nav-item, .nav, .nav ul, .nav li, .nav ol {
 list-style:none;
 margin:0;
 padding:0;
 }

/*------------------------------------*\
Flaunt JS Navigation
\*------------------------------------*/
.navi {
 max-width:1200px;
 margin:0px auto;;
 background:#000;
 padding:0;
 z-index:999;
 text-align:center;
 border-top:1px solid #666;
 border-bottom:1px solid #666;
 }
.navigation{
 position:absolute;
 top:0px;
 width:100%;
 line-height:40px;
 text-align:center;
 color:#FFF;
 font-weight:normal;
 font-size:14pt;
 display:none;
 background:#333;
 }

.nav {  color:#FFF;;
        position:relative;
        display:inline-block;
        height: 40px;  /*  wenn das Menü den Inhalt überlappen soll */
        padding:0;
        z-index:999; /*  wenn das Menü den Inhalt nicht überlappen soll */
}
.nav-list {
        text-align:center;
        list-style:none;
        padding: 0;
        font-size: 10pt;
        width: auto;
        position: relative; /* Fix the Stupid IE6 Bug */

}

.pfeil{
 background-image:url(images/pfeil2.png) !important;
 background-repeat: no-repeat !important;;
 background-position: center right !important;;
 background-size:35px !important;
 padding-right:30px !important;;
 }
.nav-item {
 float:left;
 position:relative;
 text-align:center;
 border-right: 0px solid #999;
 }

.nav-item a {
 line-height:38px;
 display:block;
 font-size:12pt;
 font-family:verdana;
 color:#FFF;
 padding:0 10px 0 10px;
 background:#000;
 margin: 0 ;
 border-right:1px solid #666;
 text-decoration:none;
 }

.nav-item > a:hover, .nav li.menu-current a {
 color: #fff;background: #444;
 text-decoration:none;
 }

.nav-item:hover .nav-submenu {
 display:block;
 }
.last {border-right:none !important; border-left:none}
/* Navigation submenu */
.nav-submenu { z-index:9;
 display:none;
 position:absolute;
 left:0;
 list-style:none;
 }
.nav-item li{border-top:1px solid #fff !important; ;}

.nav-submenu li a {
 background:#000;
 border-top:0px solid #000;
 display:block;
 padding:0 0 0 10px;
 line-height:30px;
 text-align:left;
 margin-top:0px;
 width:150px !important;
 }
.nav-submenu li a:hover {
 background:#444;
 color:#FFF;
 }

.second{margin-top:0px;}

/* Mobile navigation */
.nav-mobile {
 display:none; /* Hide from browsers that don't support media queries */
 cursor:pointer;
 position:absolute;
 top:0;
 right:0;
 background:transparent url(images/hamburger2.gif) no-repeat center center;
 background-size:24px;
 height:30px;
 width:30px;
 margin-right:5px;margin-top:5px;
 border:1px solid #fff;
 border-radius:5px;
}
.nav-mobile:hover{background:#444 url(images/hamburger2.gif) no-repeat center center;background-size:24px;}

/* Mobile navigation, clickable area for revealing <ul> */
.nav-click {
 position:absolute;
 top:0px;
 right:0;
 display:none;
 border-left:1px solid #fff;
 height:30px;
 width:40px;
 cursor:pointer;

 }
.nav-click i {
 display:block;
 height:29px;
 width:40px;
 background:url(images/pfeil2.png) no-repeat center center;
 background-size:100%;
 background-color:#000;
 }

.nav-click i:hover {
 background-color:#444;
 }
.nav-rotate {
 -webkit-transform:rotate(180deg);
 -moz-transform:rotate(180deg);
 -ms-transform:rotate(180deg);
 -o-transform:rotate(180deg);
 transform:rotate(180deg);
 }
.navigation{display:none;}
.wrap{white-space:nowrap}
/*---------------------------------------------------------------------------------*\
Media Queries
\*----------------------------------------------------------------------------------*/
@media only screen and  (max-width: 900px) {

.nav-mobile {
 display:block;
 }
body{}

.navigation{
 display:inline;
 text-align:center
 }
.navi{
 position:relative ;
 top:0px;
 background:#000;
 text-align:left;
 border-top:none;
 opacity:1.0;
 }
.nav {
 width:100%;
 margin:auto !important;
 background:#000;
 height:40px;                        /* 40px   wenn das Menü den Inhalt  überlappen soll */
 padding:0px;
 }
.nav-list {
 margin-top:40px !important;          /* entfernen  wenn das Menü den Inhalt nicht überlappen soll */
 display:none;
 }
.nav-item {
 width:100% !important;
 float:none !important;
 text-align:left !important;
 border-top:1px solid #fff !important;
 border-right:0px solid black !important;
 }
.nav-item > a {
 padding:0px !important;
 margin:0 !important;
 margin-top:0 !important;;
 line-height:30px !important;;
 font-size:15px !important;
 text-indent:20px;
 background:#000;
 border-right:none !important;
 color:#FFF;
 }
 .last{border-right:none !important;border-bottom:1px solid #fff !important;}

.nav-item > a:hover, .nav li.nav-item  ul li {
 background:#444  !important;
 color:#FFF;
 border-bottom:0;
 }
.nav-click {
 display:block;
 }
.nav-mobile-open {
 border-radius:5px 5px 0 0;
 -webkit-border-radius:5px 5px 0 0;
 -moz-border-radius:5px 5px 0 0;
 }
.nav-item:hover .nav-submenu {
 display:none;
 }
.nav-submenu {
 position:static;
 width:100% !important;
 text-indent:40px;
 border:0px solid #000;
 }
.nav-submenu li a{
 width:100% !important;
 background:#000  !important;
 color:#FFF;
 line-height:30px !important;
 font-size:15px !important;
 margin-top:0px;
 text-indent:40px;

 }
.nav-submenu li a:hover {
 background:#444 !important;
 color:#FFF !important;
 }
/*.nav li.menu-current a {
 background:#000;
 color:#FFF;
 }*/

 }