@media only screen and (max-width: 1024px){
.wrapper{width:96%;}
}
@media only screen and (max-width:800px){
ul.gallery li{width:33.3333%;}
}
@media only screen and (max-width: 668px){
.nav span{display:inline-block; float:right;}
.menu-bar{display:block; cursor:pointer; padding-top:10px;}
.nav .menu{display: none; background:rgba(0,0,0,.95); box-shadow:0 -8px 6px 0 #000 inset;}
.fa-bars, .fa-close{display:block; float:left; margin:0px 0 0; padding: 0px; border-radius:3px; color:#fff; font-size:26px; font-weight:bold;}
.fa-close{color:#fff; font-size:20px; padding:10px 10px 10px 10px; font-weight:normal; cursor:pointer; margin-right:10px; float:right;} 
.menu .fa-bars{margin:10px;}
.nav ul{clear:both;}
.nav ul li{border:0 none; color:#fff; float: none; display:block; text-align:left; padding:0px 0px; border-radius:0px; border-bottom: 1px solid #222;}
.nav ul li a, .nav ul li ul li a, .nav ul li a.active, .nav ul li a:hover{padding:10px 20px; font-size:13px; color:#fff; border-bottom:0px; border:0px; border-radius:0px;}
.nav .menu{position:fixed; top:0px; left:0px; display:none; width:260px; z-index:999999!important; height:100%; overflow:scroll; padding-bottom:20%;}
.nav .menu ul{overflow:auto;height:120%;}
.nav ul li a:hover{color:#fff; border:0px; background:#007663;}
.nav .menu ul li ul{position:inherit; top:0px; min-width:100%; box-shadow:none;}
.nav .drop-menu span{display:block; float:right; margin-top:-38px; margin-right:15px; background:#000; padding:6px 9px; border-radius:5px; font-size:12px; cursor:pointer;}
.nav .drop-menu i{display:none;}
.nav .drop-menu a{width:75%;}
.nav ul li ul{background:#222;} .nav ul li ul li{border-bottom:1px solid #000;}
.nav ul li:hover ul{display:none;}
.nav .drop-menu ul li a{width:100%;}
.nav ul li:hover, .nav ul li:hover a{background:none;}
.nav .drop-menu ul li a:hover, .nav ul li a:hover, .nav ul li:hover{background:#111;}	
.social a{padding:15px 6px;}
#popup { width: 320px; height: 200px; }
#popup_iframe { width: 320px; height: 180px; }
#popup { margin-top: 25%; }
}
@media only screen and (max-width: 568px){
ul.gallery li{width:50%;}
}
@media only screen and (max-width:375px){
.banner h1, .banner h2{font-size:38px;}
.banner{padding:100px 0 50px;}
.blackBox, .whiteBox{padding:20px;}
ul.gallery li{width:100%; float:none;}
}