#nav span {

    display: none;
}

#nav, #nav ul {

    list-style: none outside none;

    margin: 0;

    padding: 0;

}

#nav {

    background-color:Black;

    border-bottom: 5px solid rgb(237, 12, 12);

    float: left;

    margin-left: 0%;

    margin-right: 0%;

    position: relative;

    width: 100%;

}

#nav ul.subs {

    background-color: #FFFFFF;

    box-shadow: 1px 1px 5px rgba(0, 0, 0, 0.2);

    color: #333333;

    display: none;

    left: 0;

    padding: 2%;

    position: absolute;

    top: 54px;

    width: 96%;

}

#nav > li {

    border-bottom: 5px solid transparent;

    float: left;

    margin-bottom: -5px;

    text-align: left;

    -moz-transition: all 300ms ease-in-out 0s;

    -ms-transition: all 300ms ease-in-out 0s;

    -o-transition: all 300ms ease-in-out 0s;

    -webkit-transition: all 300ms ease-in-out 0s;

    transition: all 300ms ease-in-out 0s;

}

#nav li a {

    display: block;

    text-decoration: none;

    -moz-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;

    -ms-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;

    -o-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;

    -webkit-transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;

    transition: color 450ms ease-in-out 0s, background-color 450ms ease-in-out 0s;

    white-space: normal;

}

#nav > li > a {

    color: #FFFFFF;

    display: block;

    font-size: 1.3em;

    line-height: 35px;

    padding: 0 15px;

    text-transform: uppercase;

}

#nav > li:hover > a, #nav > a:hover {

    background-color: rgb(237, 12, 12);

    color: #FFFFFF;

}

#nav li.active > a {

    background-color:rgb(237, 12, 12);

    color: #FFFFFF;

}



/* submenu */

#nav li:hover ul.subs {

    display: block;

}

#nav ul.subs > li {

    display: inline-block;

    float: none;

    padding: 10px 1%;

    vertical-align: top;

    width: 33%;

}

#nav ul.subs > li a {

    color: #777777;

    line-height: 20px;

}

#nav ul li a:hover {

    color: #F55856;

}

#nav ul.subs > li > a {

    font-size: 1.3em;

    margin-bottom: 10px;

    text-transform: uppercase;

}

#nav ul.subs > li li {

    float: none;

    padding-left: 8px;

    -moz-transition: padding 150ms ease-out 0s;

    -ms-transition: padding 150ms ease-out 0s;

    -o-transition: padding 150ms ease-out 0s;

    -webkit-transition: padding 150ms ease-out 0s;

    transition: padding 150ms ease-out 0s;

}

#nav ul.subs > li li:hover {

    padding-left: 15px;

}

@media all and (max-width : 980px) {
    #nav > li {
	        float: none;
	        border-bottom: 0;
	        margin-bottom: 0;
	    }
	    #nav ul.subs {
	        position: relative;
	        top: 0;
	    }
	    #nav li:hover ul.subs {
	        display: none;
	    }
	    #nav li #s1:target + ul.subs,
	    #nav li #s2:target + ul.subs {
	        display: block;
	    }
	 
	    #nav ul.subs > li {
	        display: block;
	        width: auto;
	    }
}