nav{
display:block;
margin: 1% 0;
}

.menu{display:block;}

.menu li{
display: inline-block;
position: relative;
z-index:100;
    margin: 0 5px;
}

.menu li a {
	font-family: "Proxima Nova";
    font-size: 1.4em;
    text-decoration: none;
    padding: 11px 5px;
    display: block;
    color: #ffffff;
}

.menu li a:hover, .menu li:hover > a{
    text-decoration: underline;
    -webkit-transition: all 0.2s ease-in-out 0s;
    -moz-transition: all 0.2s ease-in-out 0s;
    -o-transition: all 0.2s ease-in-out 0s;
    -ms-transition: all 0.2s ease-in-out 0s;
    transition: all 0.2s ease-in-out 0s;
}

.menu ul {
display: none;
margin: 0;
padding: 0;
width: 180px;
position: absolute;
left: 0px;
background: #ffffff;
}

.menu ul li {display:block;
float: none;
background:none;
margin:0;
padding:0;
}
.menu ul li a {
font-size: 1.2em;
font-weight:normal;
display:block;
color:#fff;
background:rgba(0, 0, 0, 0.85);
}

.menu ul li a:hover, .menu ul li:hover > a{
background:#ffffff;
    color: #333333;
}

.menu li:hover > ul{ display: block;}
.menu ul ul {left: 149px;
	top: 0px;
}

.mobile-menu{
display:none;
width:100%;
color:#ffffff;
text-transform:uppercase;
font-weight:600;
font-size: 1.6em;
font-family: "Times New Roman";
}
.mobile-menu:hover{background:#781a7b;
color:#ffffff;
text-decoration:none;
}



@media (max-width: 768px) {

.mainWrap{width:auto;padding:50px 20px;}

.menu{display:none;}

.mobile-menu{display:block;
margin-top:10px;}

nav{margin:0;
background:none;}

.menu li{display:block;
margin:0;}

.menu li a {background:rgba(0,0,0,0.5);
color: #fff;
border-top:1px solid #e0e0e0;
}

.menu li a:hover, .menu li:hover > a{
background:#fff;
color:#333;
}

.menu ul {
display:block;
position:relative;
top:0;
left:0;
width:100%;
padding: 0px;
}

.menu ul ul {left:0;}

}

@media (max-width: 480px) {

}


@media (max-width: 320px) {
}