nav {
    width:100%;
    height:5%;
    min-height:50px;
    margin-top:1%;
}

nav > ul {
    position:relative;
    list-style-type:none;
    height:100%;
    background: #6d0019; /* Old browsers */
    background: -moz-linear-gradient(top,  #6d0019 0%, #8f0222 26%, #a90329 53%, #8f0222 74%, #6d0019 100%); /* FF3.6+ */
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6d0019), color-stop(26%,#8f0222), color-stop(53%,#a90329), color-stop(74%,#8f0222), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
    background: -webkit-linear-gradient(top,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
    background: -o-linear-gradient(top,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* Opera 11.10+ */
    background: -ms-linear-gradient(top,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* IE10+ */
    background: linear-gradient(to bottom,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* W3C */
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d0019', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
    -moz-box-shadow: 0 0 2px 2px darkred;
    -webkit-box-shadow: 0 0 2px 2px darkred;
    box-shadow: 0 0 2px 2px darkred;
}
    nav ul li {
        height:100%;
        float:right;
        background: #6d0019; /* Old browsers */
        background: -moz-linear-gradient(top,  #6d0019 0%, #8f0222 26%, #a90329 53%, #8f0222 74%, #6d0019 100%); /* FF3.6+ */
        background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6d0019), color-stop(26%,#8f0222), color-stop(53%,#a90329), color-stop(74%,#8f0222), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
        background: -webkit-linear-gradient(top,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
        background: -o-linear-gradient(top,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* Opera 11.10+ */
        background: -ms-linear-gradient(top,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* IE10+ */
        background: linear-gradient(to bottom,  #6d0019 0%,#8f0222 26%,#a90329 53%,#8f0222 74%,#6d0019 100%); /* W3C */
        filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d0019', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
    }
        nav ul li:first-of-type {
            margin-right:1%;
        }
@media screen and (max-width:1000px) {
   
    nav ul li:first-of-type {
        margin-right:0px;
    }
}
        nav ul li a {    
            display:block;
            position:relative;        
            text-decoration:none;
            color: #ddd;
            font-size:1.2em;
            padding-left:2em;
            padding-right:2em;
            padding-top:0.6em;
        }
        nav > ul > li:hover {
            background: #6d0019; /* Old browsers */
            background: -moz-linear-gradient(top,  #6d0019 0%, #a30320 26%, #bc032b 53%, #a30320 74%, #6d0019 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6d0019), color-stop(26%,#a30320), color-stop(53%,#bc032b), color-stop(74%,#a30320), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(top,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* IE10+ */
            background: linear-gradient(to bottom,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d0019', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
            
        }
        nav ul li.active {
            background: #6d0019; /* Old browsers */
            background: -moz-linear-gradient(top,  #6d0019 0%, #a30320 26%, #bc032b 53%, #a30320 74%, #6d0019 100%); /* FF3.6+ */
            background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#6d0019), color-stop(26%,#a30320), color-stop(53%,#bc032b), color-stop(74%,#a30320), color-stop(100%,#6d0019)); /* Chrome,Safari4+ */
            background: -webkit-linear-gradient(top,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* Chrome10+,Safari5.1+ */
            background: -o-linear-gradient(top,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* Opera 11.10+ */
            background: -ms-linear-gradient(top,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* IE10+ */
            background: linear-gradient(to bottom,  #6d0019 0%,#a30320 26%,#bc032b 53%,#a30320 74%,#6d0019 100%); /* W3C */
            filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#6d0019', endColorstr='#6d0019',GradientType=0 ); /* IE6-9 */
            
        }
        nav > ul > li:hover a, nav > ul > li.active a {
            color:white;
        }

/*nav > ul > li:hover {
    
}*/
        nav ul ul {
            list-style-type:none;
            height:100%;
            display:none;
            position:absolute;
            top:100%;       
        }
            ul li:hover ul {
                display:inline-block; 
            }
@media screen and (max-width:1000px) {
    nav ul li:hover ul {
        display:none;
    }
        header {
        height:13%;
    }
}
    
    nav ul ul li {
        float:none;
        width:100%;
        height:100%;
        position:relative;
        border-bottom:1px outset darkred;        
        /*-moz-box-shadow: 0 0 2px 2px darkred;
        -webkit-box-shadow: 0 0 2px 2px darkred;
        box-shadow: 0 0 2px 2px darkred;*/
        background-color:#87021a;  
    }
        nav ul ul li {
            height:auto;
            padding-bottom:5px;
        }
        nav ul > li > ul > li > a {
            color: #ddd !important;
        }
        nav ul ul li:hover {
            background-color: #AF0002;
            color:white;
        }
            nav ul li ul li:hover a {
                color: white !important;
            }

@media screen and (max-width:1000px) {
    nav ul li {
        display:block;
        width:100%;
    }
    nav ul li a {
        float:none;
        text-align:center;
    }
}