.responsive-menu{display: none;}
    #menu{
        float: right;
        padding-top: 19px;
        list-style: none;
        margin: 0;
    }
    #menu > li{
        float: left;
        text-align: right;
        margin-left: 35px;
        position: relative;
    }
    #menu > li:hover {visibility: inherit;}
    #menu > li > a{
        display: block;
        font-size: 10px;
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: 0.09em;
    }
    #menu a:before {
        content: attr(data-description);
		display: block;
		line-height: 0;
		margin-bottom:8px;
		text-transform: capitalize;
        font-weight: normal;
        font-size: 9px;
        text-align: right;
        font-style: italic;
        letter-spacing: normal !important;
        font-family: 'Georgia', serif;
    }
    #menu ul{
        text-align: left;
   	    position: absolute;
    	width: 150px;
        padding: 0 25px;
        list-style: none;
        margin: 0;
        display: none;
    }
    #menu ul li {
        position: relative;
        padding: 2px 0 12px 0;
    }
    #menu ul li.last{border-bottom: none;}
    #menu ul a{
        display: block;
        font-size: 11px;
    }
    #menu li:hover {visibility: inherit;}
    #menu li:hover ul,
    #menu li.sfHover ul {
    	left: 0;
    	top: 57px;
    	z-index: 99;
    }
    #menu li li:hover ul,
    #menu li li.sfHover ul {
    	left: 14em; 
    	top: 0;
    }

@media only screen and (min-width: 980px)  and (max-width: 1199px){
.responsive-menu{display: none;}
    #menu{
        float: right;
        padding-top: 19px;
        list-style: none;
        margin: 0;
    }
    #menu > li{
        float: left;
        text-align: right;
        margin-left: 35px;
        position: relative;
    }
    #menu > li:hover {visibility: inherit;}
    #menu > li > a{
        display: block;
        font-size: 10px;
        font-weight: 400;
        text-transform: uppercase;
        letter-spacing: 0.09em;
    }
    #menu a:before {
		content: attr(data-description);
		display: block;
		line-height: 0;
		margin-bottom:8px;
		text-transform: capitalize;
        font-weight: normal;
        font-size: 9px;
        text-align: right;
        font-style: italic;
        letter-spacing: normal !important;
        font-family: 'Georgia', serif;
    }
    #menu ul{
        text-align: left;
   	    position: absolute;
    	width: 150px;
        padding: 0 25px;
        list-style: none;
        margin: 0;
        display: none;
    }
    #menu ul li {
        position: relative;
        padding: 2px 0 12px 0;
    }
    #menu ul li.last{border-bottom: none;}
    #menu ul a{
        display: block;
        font-size: 11px;
    }
    #menu li:hover {visibility: inherit;}
    #menu li:hover ul,
    #menu li.sfHover ul {
    	left: 0;
    	top: 57px;
    	z-index: 99;
    }
    #menu li li:hover ul,
    #menu li li.sfHover ul {
    	left: 14em; 
    	top: 0;
    }

}
@media (min-width: 768px) and (max-width: 979px) {

	
	/*====================== MENU ======================*/
	#menu{display: none;}
	.responsive-menu{
		margin-top: 10px;
		display:block;
		float: right;
		width:75%;
		border: 1px solid #c4c4c4;
	}

}
@media (min-width: 568px) and (max-width: 768px) {


	/*====================== MENU ======================*/
	#menu{display: none;}
	.responsive-menu{
		display:block;
		float: right;
		width:75%;
		border: 1px solid #c4c4c4;
	}


}

@media (min-width: 168px) and (max-width: 568px) {


	/*====================== MENU ======================*/
	#menu{display: none;}
	.responsive-menu{
		display:block;
		float: right;
		width:75%;
		border: 1px solid #c4c4c4;
	}


}

