﻿

.toggle, [id^=drop] {
    display: none;
}
nav a {
    display: block;
    padding: 0 20px;
    color: #f1b100;
   
    text-decoration: none;
}

nav ul li ul li:hover {
    background: #000000;
}

nav a:hover {
    background-color: #000000;
}

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: ' +';
}

li > a:only-child:after {
    content: '';
}


/* Media Queries
--------------------------------------------- */

@media all and (max-width : 768px) {


    nav {
        margin: 0;
    }

    .toggle + a,
    .menu {
        display: none;
    }


    [id^=drop]:checked + ul {
        display: block;
    }

    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;
    }
}

@media all and (max-width : 330px) {

    nav ul li {
        display: block;
        width: 94%;
    }
}

