.btn-open {
	display:none;
}

.overlay {
	display:none;
}


@media screen and (max-width:780px) {

body{
 margin: 0;
 padding: 0;
 background: #404350;
 background: url(pattern.png) repeat;
 font-family: verdana;
}
ul{
 margin: 0;
 padding: 0;
 text-decoration: none;
 list-style: none;
}
li{
 padding: 0;
 margin: 0;
}
/*header*/
header{

}
nav{
 text-align: center;
 max-width: 1100px;
 margin: 0 auto;
 position: relative;
 height: 70px;
 overflow: hidden;
 z-index: 100;
}
nav ul{
 min-height: 55px;
 padding: 30px 0;
 text-align: center;
}
nav ul li a:hover{
 background-color: rgba(0, 0, 0, 0.4);
}
nav ul li{
 display: inline-block;
}
nav ul li a{
 color: #fff;
 display: inline-block;
 padding: 1em 3em;
 background-color: rgba(170, 170, 170, 0.06);
 border: 1px solid rgba(29, 37, 49, 0.39);
 text-decoration: none;
}


/*styling open close button*/
.btn-open{
 display: inline;
 position: absolute;
 left: 0px;
 top: 20px;
 z-index: 999;
 width: 70px;

}

.btn-close{
 display: inline;
 position: absolute;
 right: 20px;
 top: 20px;
 z-index: 999;
 width: 70px;
}

/*overlay*/
.overlay{
    display: none;
 position: fixed;
 top: 0;
 height: 100%;
 width: 100%;
 background: rgba(0, 0, 0, 0.86);
 overflow: auto;
}
.wrap{
 color: #fff;
 text-align: center;
 max-width: 1100px;
 margin: 0 auto;
}
.wrap ul.wrap-nav{
 border-bottom: 1px solid #575757;
 text-transform: capitalize;
 padding: 150px 0px 100px;
}
.wrap ul.wrap-nav > li{
 font-size: 22px;
 display: inline-block;
 vertical-align: top;
 width: 24%;
 position: relative; 
}
.wrap ul.wrap-nav > li a{
 color: #d6d6d6;
 display: block;
 padding: 8px 0;
 text-decoration: none;
}
.wrap ul.wrap-nav > li a:hover{
 color: #fff;
}
.wrap ul.wrap-nav ul{
 padding: 20px 0;
}
.wrap ul.wrap-nav ul li{
 display: block;
 font-size: 16px;
 width: 100%;
 color: #919191;
}
.wrap ul.wrap-nav ul li a{
 color: #919191;
}
.social{
 color: #c1c1c1;
 font-size: 16px;
 padding: 20px;
}

}

@media screen and (max-width: 48em) {
 .wrap ul.wrap-nav > li{
 width: 100%;
 padding: 20px 0;
 border-bottom: 1px solid #575757;
 }
 .wrap ul.wrap-nav{
 padding: 30px 0px 0px;
 }
 nav ul{
 opacity: 0;
 visibility: hidden;
 }
 .button{
 top: 0;
}
}