#menu .nav{display: block;}    

#menu b{display: none; cursor: pointer; color: white; padding: 10px;}

#menu li{}

#menu li a{display: block; color: #fff; font-size: 16px; text-decoration: none;}
				
/* first level */

#menu ul{list-style:none;}				
#menu ul li{float: left;margin-left: 1px;position: relative;}
#menu ul li a{color: #2d3134;padding: 0 26px; line-height: 94px; height: 100px; font-weight: 300; text-transform: uppercase; font-family: "Open Sans",sans-serif; font-size: 13px; transition: all 0.5s ease 0s;}
#menu ul li.mark a:hover{color: white;background-color: #c00000;}
#menu ul li.unmark a:hover{color: white;background-color: #c00000;}
#menu ul li.mark a{color: white;background-color: #c00000;}
#menu ul li.unmark a{color: #2d3134;}

@media only screen and ( max-width: 970px ){
    
    #menu{position: relative; margin: 0; background-color: #c00000;margin-bottom: 15px;}
    #menu b{display: block;}

    /* first level */    
    #menu .nav{display: none;}       
    #menu ul{border: none;}
    #menu:target ul{display: block;}
				
    #menu ul li{margin: 0;display: block;float: none;}
    
    #menu ul li a:active{background-color: #53240a;}
    #menu ul li a{height: auto;background-image: none;display: block;text-align: center;color: white;line-height: 100%; padding: 20px;}    
    #menu ul li.mark a{height: auto;background-image: none;border: none; display: block;text-align: center;color:white;}
    #menu ul li.unmark a{height: auto;background-image: none;display: block;text-align: center;color: white;}
    #menu ul li.mark a:hover{background: rgba(0,0,0,0.2); border: none;}
    #menu ul li.unmark a:hover{background: rgba(0,0,0,0.2); border: none;}
}