﻿nav {
    margin: 0;
    padding: 0;
    background-color: #fff;
    display: none;
}

#logo {
    display: block;
    padding: 0 30px;
    float: left;
    font-size: 20px;
    line-height: 60px;
}

    /*#logo img {
        width: 200px;
    }*/

    /*#logo a {
        padding: 0;
        line-height: normal;
    }*/

    #logo a:hover {
        background-color: rgba(255,255,255,0);
    }

nav:after {
    content: "";
    display: table;
    clear: both;
}

nav ul {
    padding: 0;
    margin: 0;
    list-style: none;
    position: relative;
    transition: 0.5s ease all;
}

    nav ul li {
        margin: 0px;
        display: inline-block;
        float: left;
        background-color: #fff;
    }

nav a {
    display: block;
    padding: 0 15px;
    color: #4D4D4D;
    font-size: 20px;
    line-height: 35px;
    text-decoration: none;
    margin: 0;
}



nav ul li ul li:hover {
    background: #cc8819;
    color: #fff;
}

nav a:hover {
    background-color: #cc8819;
    color: #fff;
}

nav ul ul {
    display: none;
    position: absolute;
    top: 60px;
}

nav ul li:hover > ul {
    display: inherit;
}

nav ul ul li {
    width: 170px;
    /*float: none;*/
    display: list-item;
    /*position: relative;*/
}

nav ul ul ul li {
    position: relative;
    top: -60px;
    left: 170px;
}

li > a:after {
    content: ' +';
}

.toggle, [id^=drop] {
    display: none;
}

li > a:only-child:after {
    content: '';
}

@media all and (max-width:1200px) {
    /*.header {
        display: none;
    }*/

    #logo {
        display: block;
        padding: 0;
        width: 100%;
        text-align: center;
        float: left;
        margin: auto;
    }

    .logo-left {
        /*width: 50%;*/
        float: left;
        margin-left: 20px;
    }

    .logo-right {
        width: 50%;
        float: left;
    }

    .logo-left img {
        width: 100%;
        max-width: 90px;
    }

    .logo-right img {
        width: 100%;
        max-width: 135px;
    }

    .logo-left a {
        padding: 2%;
        width: 96%;
        display: block;
    }

    .logo-right a {
        padding: 2%;
        width: 96%;
        display: block;
    }



    .toggle + a,
    .menu {
        display: none;
    }

    .toggle {
        display: block;
        background-color: #009ADE;
        padding: 0 0px;
        color: #fff;
        font-size: 20px;
        line-height: 40px;
        text-decoration: none;
        /* border: 2px solid #b17541; */
        font-weight: 600;
        cursor: pointer;
        width: 97%;
        padding-left: 3%;
        float: left;
        /* border-top: 2px solid #b17541; */
        /* border-bottom: 2px solid #b17541; */
    }

        .toggle:hover {
            background-color: #c2fb3b;
            color: #333;
        }

    [id^=drop]:checked + ul {
        display: block;
    }



    .cross:after {
        content: '\f00d';
        font-family: FontAwesome;
        color: #333;
        position: absolute;
        right: 5px;
        top: 108px;
        font-size: 30px;
        z-index: 1;
    }

    nav ul li {
        display: block;
        width: 100%;
        border-top: 1px solid #4D4D4D;
    }

    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: #c2fb3b;
        color: #333;
    }

    nav ul li ul li .toggle,
    nav ul ul a {
        background-color: #fff;
        color: #000;
    }

        nav ul ul a:hover {
            background-color: #c2fb3b;
        }

    nav ul ul {
        float: none;
        position: static;
        color: #ffffff;
    }

        nav ul ul li:hover > ul,
        nav ul li:hover > ul {
            display: none;
        }

        nav ul ul li {
            display: block;
            width: 100%;
        }

        nav ul ul ul li {
            position: static;
        }
}

.submenu_mobile {
    border: none;
    padding: 0 15px;
    font-weight: 400;
    background: #fff;
    color: #333;
}

.cl-effect-6 {
    background-color: rgba(255,255,255,0);
}

    .cl-effect-6 a {
        padding: 0px 3px;
        display: block;
        float: left;
        margin: 0px 7%;
        margin-bottom: 20px;
        color: #f2f2f2;
        font-size: 1.2em;
        line-height: normal;
    }

        .cl-effect-6 a:hover {
            background-color: rgba(155,155,155,0);
        }

@media all and (max-width:330px) {
    nav ul li {
        display: block;
        width: 100%;
    }
}

@media only screen and (min-width:601) and (max-width:800) {
    #logo {
        display: block;
        padding: 0;
        width: 36%;
        text-align: center;
        float: left;
        margin: 5px auto;
    }

    .menuhead, .toggle {
        float: left;
        width: 64%;
        margin-top: 62px;
    }
}
