/*     header und TopNav  */
#header
{
    width: 100%;
    position: relative;
    z-index: 100;
    height: 64px;
}
#header.affix
{
    position: fixed;
}

#header .suchform
{
    /* unsichtbar für Handy */
    /*display: none;*/

}

.SmallLogo
{
    display: inline-block;
    height: 64px;
    width: 85px;
    background: url(../../../img/Logo.png) no-repeat center center;
    background-size: auto 90%;
}
/* Suchform default mobile */

#header > div > div.max-width > div > form > span.ErweiterteSucheToggler,
#header > div > div.max-width > div > form > div.suchform_inner > label
{
    /*display: none;*/
}

#header > div > div.max-width > div > .suchform
{
    /*
    position: absolute;
    top: 40px;
    width: 100%;
    text-align: center;
    */
}
#header > div > div.max-width > div > form > div.suchform_inner > input.NavSearchInput
{
    width: 100px;
}

/*iPad in portrait*/
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
{
    #header > div > div.max-width > div > form > div.suchform_inner > input.NavSearchInput
    {
        width: 150px;
    }
    .suchform
    {
        float: right;
    }
    .SmallLogo
    {
     display: none;
    }
}


.Logo
{
    display: inline-block;
    width: 170px;
}

.Logo > img {
    width: 100%;
    height: auto;
    padding: 2px;
}
@media screen and (max-height: 640px)  /* h1 -50px */
{
    .Logo
    {
        height: 110px;
        width: auto;
    }
    .Logo > img {
        height: 100%;
        width: auto;
    }
    #categories
    {
        margin-top: 0px;
    }
}
.shade
{
    -webkit-box-shadow: 0px 3px 17px 0px rgba(148,148,148,1);
    -moz-box-shadow: 0px 3px 17px 0px rgba(148,148,148,1);
    box-shadow: 0px 3px 17px 0px rgba(148,148,148,1);
}

.TopNav
{
    position: relative;
    height: 64px;
    padding-left: 20px;
    padding-right: 20px;
}

ul.NavIcons2
{
    display: block;
}
ul.NavIcons
{
    padding: 0 0 0 0;
    /*display: none;*/
}
ul.NavIcons>li
{
    display: inline-block;
    list-style-type: none;
    position: relative;

}
ul.NavIcons>li>a
{
    display: inline-block;
    margin-right: 5px;
}
ul.NavIcons>li>a.NavCart
{
    background: url(../../../img/cart3.png) no-repeat left center;
    background-size: auto 50%;
    padding-left: 30px;
}
ul.NavIcons>li>a.NavPin
{
    background: url(../../../img/pin.png) no-repeat left center;
    background-size: auto 50%;
    padding-left: 30px;
}
ul.NavIcons>li>a.NavKey
{
    background: url(../../../img/key.png) no-repeat left center;
    background-size: auto 50%;
    padding-left: 30px;

}
ul.NavIcons>li>a.NavInfo
{

    background: url(../../../img/info.png) no-repeat left center;
    background-size: auto 50%;
    padding-left:25px;

}
ul.NavIcons>li>a.NavNewsletter
{

    background: url(../../../img/newsletter.png) no-repeat left center;
    background-size: auto 50%;
    padding-left:25px;

}
ul.NavIcons.Screen
{


}

ul.NavIcons.Mobile
{
    text-align: center;
    display: block;
    border: solid 0px pink;

    vertical-align: top;
    line-height: 50px;
    padding: 0 0 0 0;
    border: solid 0px red;
    margin: 0 0 0 0;
    padding-top: 20px;

}
ul.NavIcons.Mobile>li
{
    border: solid 0px red ;
    height: 100%;

    }
ul.NavIcons.Mobile>li>a
{
    display: inline-block;
    line-height: 100px;
    padding: 0 0 0 0;
    height: 35px;
    width: 35px;
}

.NavIcons1
{
    display: inline-block;
    margin: 0 0 0 0;
    line-height: 64px;
    padding-top: 0px;
    text-align: center;
}




@media screen and (min-width: 420px)
{

}
@media screen and (min-width: 768px)
{

    .SmallLogo
    {
     display: none;
    }
}
@media screen and (min-width: 1024px)
{
    #header .NavIcons1
    {
        display: inline-block;
        margin: 0 0 0 0;

        padding-top: 0px;
        text-align: center;
    }
    .suchform
    {
        float: right;
    }
    .SmallLogo
    {
     display: none;
    }
}



.MenueToggler
{
    position: absolute;
    right: 10px;
    top: 0px;
}
.MenueToggler
{
    background: url(../../../img/menue.png) no-repeat top left;
    background-size: 100% auto;

    border: solid 0px #ccc;
    display: block;
    margin: 0 0 0 0;
    padding: 0 0 0 0;
    width: 64px;
    text-align: center;
    line-height: 100px;
    overflow: hidden;
    height: 60px;
    cursor: pointer;

    color: #6f4c22;

}
/* Hide Navi for small Devices */


#main_content.header_fixed
{
    padding-top: 94px;
}

/*iPad in portrait*/
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
{
    .ErweiterteSucheToggler
    {
        padding: 0 0 0 0;
        border: solid 0px #000;
        font-size: 90%;
    }
    ul.NavIcons.Mobile
    {
        display: none;
    }

    .TopNav
    {
        display: block;
    }

}


.TopNav
{
    display: none;
}

/* Wide Screen Styles  */
@media screen and (min-width: 768px)  /* h1 -50px */
{

    .TopNav
    {
        display: block;
    }


    #header > div > div.max-width > div > form > div.suchform_inner > input.NavSearchInput {
        width: 120px;
    }

    #header > div > div.max-width > div > form > span.ErweiterteSucheToggler,
    #header > div > div.max-width > div > form > div.suchform_inner > label {
        display: inline-block;
    }



    #header
    {

    }

    .TopNav
    {

    }

    #header.affix .TopNav
    {

    }





    #header.affix .NavIcons2
    {

    }

    #header.affix .NavIcons1
    {

    }

    #NavBar,
    #NavBar.opened
    {
        /*
        height: auto;
        overflow: visible;
        transition: all ease 0.5s;
        height: auto;
        overflow: visible;
        position: relative;
        width: auto;
        height: 100%;
        overflow: auto;
        background-image:linear-gradient( #f3e4d1,#fff);
        top: 0px;
        */

    }



    .MenueToggler
    {
        display: none;
    }
}

/*iPad in portrait*/
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
{

}


@media screen and (min-width: 1024px)  /* h1 -50px */
{
    .MenueToggler
    {
        display: none;
    }
    .Grid_Left,
    .Grid_Left.opened
    {

        /*

        height: auto;
        overflow: visible;
        transition: all ease 0.5s;
        height: auto;
        overflow: visible;
        position: relative;
        width: auto;
        height: 100%;
        overflow: auto;

        top: 0px;

        */
    }





    /*
    ul.NavIcons.Screen
    {
        display: inline-block;
        vertical-align: top;
        text-align: right;
        margin: 0 0 0 0;
        padding: 0 0 0 0;
        padding-top: 0px;
        padding-bottom: 10px;
    }
    ul.NavIcons.Screen>li
    {
        display: inline-block;
    }
    ul.NavIcons.Mobile
    {
        display: none;
    }
    #NavBar.affix {
        position: fixed;
        top: 0px;
        width: 200px;
        height: 100%;
    }
    #NavBar.affix>#categories
    {
        margin-top: 70px;
    }
*/
}
@media screen and (min-width: 1180px)  /* h1 -50px */
{

}
@media screen and (min-width: 1260px)  /* h1 -50px */
{

}
@media screen and (min-width: 1600px) /* h1 -50px */
{

}
@media screen and (min-width: 1480px) /* h1 -50px */
{

}