#navi .menuebutton
{
	display: none;
}

@media
only screen and ( min-width: 1001px )
{

.jQuery
{
	float: none;
}

/**************************************************************************************************/


    #navi
    {
        margin: 0 auto;
        padding: 0;   
        position: absolute;
        top: 50px;
        right: 20%;
        font-size: 22px;
        font-weight: bold;
        text-transform: uppercase;
    }
    
        @media only screen and ( max-width: 1750px )
        {
            #navi
            {
                right: 8%;
            }
        }
        
        @media only screen and ( max-width: 1300px )
        {
            #navi
            {
                right: 2%;
                font-size: 20px;
            }
        }

    #navi > ul
    {
        margin: 0 auto;
        padding: 0;
        list-style-type: none;
    }

    #navi > ul > li
    {
        line-height: 1.3em;
        display: inline;
        position: relative;
        text-align: center;
        margin: 5px 10px;
        padding: 0 0 30px 0; 
        width: auto; 
    }
    
        @media only screen and ( max-width: 1300px )
        {
            #navi > ul > li
            {
                margin: 5px 5px; 
            }
        }

    #navi > ul > li > a
    {
        color: #000;
        text-decoration: none;
        width: auto; 
    }

    #navi > ul > li > a:link, #navi > ul > li > a:visited
    {
        margin: 0;
        padding: 0; 
        width: auto;   
    }

    #navi > ul > li:hover > a, #navi > ul > li > a:active, #navi > ul > li > a:focus
    {
        margin: 0;
        padding: 0;
        text-decoration: none;
        color: #1a80c7;
        width: auto; 
    }

    #navi > ul > li > span, #navi > ul > li > .aktiv
    {
        color: #1a80c7;
        margin: 0;
        padding: 0;
        text-decoration: underline;
        width: auto; 
    }
    
    /**************************************************************************************************/
    
    #navi ul > li > ul
    {
        background-color: #dedbcd;
        opacity: 0.9;
        position: absolute;
        top: 45px;
        left: 0px;
        display: none;
        text-align: left;
        list-style-type: none;
        z-index: 10;
        margin:  0;
        padding: 5px;
        text-transform: none;
        font-size: 20px;
        font-weight: normal;
        z-index: 10; 
        min-width: 250px;   
    }

    #navi ul #navi_27 > ul
    {
        left: -78px;
    }

    #navi ul > li:hover > ul
    {
        display: block;
    }

    #navi ul > li > ul > li
    {
        padding: 0;
        margin: 1px 0;
        list-style-type: none;
        float: none;
        display: block;
        background-image: none;    
        text-align: left;     
    }

    #navi ul > li > ul > li > a
    {
        color: #1a80c7;
        padding: 5px 15px; 
        margin: 0;
        text-decoration: none; 
        border: none;
        min-width: 200px; 
        display: block;
    }

    #navi ul > li > ul > li > a:link, #navi ul > li > ul > li > a:visited
    {
        padding: 5px 15px; 
        margin: 0;     
        border: none;
        min-width: 200px; 
        background-color: #1a80c7;
        color: #fff;
    }

    #navi ul > li > ul > li > a:hover, #navi ul > li > ul > li > a:active, #navi ul > li > ul > li > a:focus
    {
        background-color: #a6a28d;
        color: #fff;        
        padding: 5px 15px;
        margin: 0;
        text-decoration: none;  
    }

    #navi ul > li > ul > li > span, #navi ul > li > ul > li > .activ
    {
        background-color: #1a80c7;
        color: #fff;     
        padding: 5px 15px; 
        margin: 0;
        text-decoration: none;  
    }

}

    

/**************************************************************************************************/

@media only screen and ( max-width: 1000px )
{

	.jQuery
	{
		float: left;
	}

	#navi
	{
		background-image: url(/layout/kontakt-hg.jpg);
        background-position: top center;
        background-repeat: repeat-y;
        background-color: #1a80c7;  
		font-size: 20px;
		font-weight: 400;
		line-height: normal;
		color: #fff;
		width: 100%;
        position: fixed;
        top: 0;
        left: 0;
        margin: 0;
        text-align: left;
        z-index: 100;
	}

	#navi .menuebutton
	{
		background-image: url(/layout/menu-icon.png);
		background-position: 95% 50%;
		background-repeat: no-repeat;
		padding: 10px 10px 10px 10px;
		display: block;
		clear: both;
		border-bottom: 1px solid #fff;
	}

    #navi h2
    {
        margin: 0;
        padding: 0;
        
    }

	#navi p
	{
		padding: 10px 20px;
		margin: 0;
	}

	#navi ul
	{
		display: none;
		margin: 0;
		padding: 0;
		list-style-type: none;
        background-color: #1a80c7;
	}

	#navi li
	{
		margin: 0;
		padding: 0;
		list-style-type:none;
		border-bottom: 1px solid #fff;
	}

	#navi li:first-child
	{
		border-top: 1px solid #fff;
	}

	#navi ul li ul li:last-child
	{
		border-bottom: none;
	}

	#navi a
	{
		color: #fff !important;
		margin: 0;
		padding: 1% 2%;
		display: block;
		text-decoration: none;
	}

	#navi a:link, #navi a:visited
    {
        display: block;
    }

	#navi a:hover, #navi a:active, #navi a:focus
	{
        display: block;
        background-color: #1a80c7; 
        color: #fff;
	}

	#navi .aktiv, #navi span
	{
		display: block;
        background-color: #303030;
        color: #fff; 
        padding: 1% 2%;
	}
    
    #navi>ul>li>ul>li a
	{
        color: #303030 !important;   
	}
    #navi>ul>li>ul>li a:hover, #navi>ul>li>ul>li span
	{
        color: #fff !important;   
	}
    
    #navi>ul>li>ul
	{
		background-color: #dedbcd;
        color: #303030;   
	}
    


}