.seitenmenu a{font-size: 14px; color: #4F4F4F;

    font-weight: normal;

    line-height: 1.42857;}

.toggle,
[id^=drop] {
        display: none;
}
.toggle,
[id^=drop2] {
        display: none;
}


/* Giving a background-color to the nav container. */
nav {
        margin:0;
        padding: 0;
        background-color: #FFffff;
}


#logo {
        display: block;
        padding: 10 70px;   
        float: left;
        font-size:20px;
        line-height: 10px;
}

/* Since we'll have the "ul li" "float:left"
 * we need to add a clear after the container. */

nav:after {
        content:"";
        display:table;
        clear:both;
}


/* Removing padding, margin and "list-style" from the "ul",
 * and adding "position:reltive" */
nav ul {
        float: left;z-index:100;
        padding:0;
        margin:0;
        list-style: none;
        position: relative;
        }


/* Positioning the navigation items inline */
nav ul li {
        margin: 0px;
        display:inline-block;
        float: left;
        background-color: #FFFFFF;
        }


/* Styling the links */
nav a {
        display:block;
        padding:10px 10px;     margin-top: 0.65em;  
        color:#808080;
        font-size:12px;
        text-decoration:none;
}



nav ul li ul li:hover { background: #fff; color:#ffffff; }


/* Background color change on Hover */
nav a:hover {
        background-color: #428BCA;color:#ffffff;
}


/* Hide Dropdowns by Default
 * and giving it a position of absolute */
nav ul ul {
        display: none;
        position: absolute;
        /* has to be the same number as the "line-height" of "nav a" */
        top: 30px;
}


/* Display Dropdowns on Hover */
nav ul li:hover > ul {
        display:inherit;
}


/* Fisrt Tier Dropdown */
nav ul ul li {
        width:170px;
        float:none;
        display:list-item;
        position: relative;background-color: #C0C0C0;
}


/* Second, Third and more Tiers
 * We move the 2nd and 3rd etc tier dropdowns to the left
 * by the amount of the width of the first tier.
*/
nav ul ul ul li {
        position: relative;
        top:-30px;
        /* has to be the same number as the "width" of "nav ul ul li" */
        left:170px;background-color: #C0C0C0;
}



/* Change ' +' in order to change the Dropdown symbol
li > a:after { content:  ' +'; }
li > a:only-child:after { content: ''; }             */


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 768px) {

        #logo {
                display: block;
                padding: 0;
                width: 100%;
                text-align: center;
                float: none;
        }

        nav {
                margin: 0;
        }


        /* Hide the navigation menu by default */
        /* Also hide the  */
        .toggle + a,
        .menu {
                display: none;
        }


        /* Stylinf the toggle lable */
        .toggle {
                display: block;
                background-color: #254441;
                padding:14px 20px;
                color:#FFF;
                font-size:17px;
                text-decoration:none;
                border:none;
        }


        .toggle:hover {
                background-color: #000000;
        }


        /* Display Dropdown when clicked on Parent Lable */
        [id^=drop]:checked + ul {
                display: block;
        }
        /* Display Dropdown when clicked on Parent Lable */
        [id^=drop2]:checked + ul {
                display: block;
        }


        /* Change menu item's width to 100% */
        nav ul li {
                display: block;
                width: 100%;
                }


        nav ul ul .toggle,
        nav ul ul a {
                padding: 0 40px;
        }


        nav ul ul ul a {
                padding: 0 80px;
        }


        nav a:hover,
         nav ul ul ul a {
                background-color: #000000;
        }


        nav ul li ul li .toggle,
        nav ul ul a,
  nav ul ul ul a{
                padding:14px 20px;
                color:#FFF;
                font-size:17px;
        }



        nav ul li ul li .toggle,
        nav ul ul a {
                background-color: #212121;
        }


        /* Hide Dropdowns by Default */
        nav ul ul {
                float: none;
                position:static;
                color: #ffffff;
                /* has to be the same number as the "line-height" of "nav a" */
        }


        /* Hide menus on hover */
        nav ul ul li:hover > ul,
        nav ul li:hover > ul {
                display: none;
        }


        /* Fisrt Tier Dropdown */
        nav ul ul li {
                display: block;
                width: 100%;
        }


        nav ul ul ul li {
                position: static;
                /* has to be the same number as the "width" of "nav ul ul li" */

        }


}

@media all and (max-width : 330px) {

        nav ul li {
                display:block;
                width: 94%;
        }