@media only screen and (max-width: 1380px){
#clients ul.logos li{ width: 25%; }
}

@media only screen and (max-width: 1320px){
#footer .nav ul li{ width: 50%; float: none; display: inline-block; margin-right: -4px; vertical-align: top; }
}

@media only screen and (max-width: 1080px){
#header{ width: 100%; float: left; position: relative; top: inherit; left: inherit; bottom: inherit; padding: 0; background: #fff; border-right: 0; border-bottom: 1px solid #ddd; }
#header::after{ display: none; }
#header h1#logo{ padding: 20px; margin: 0; }
#header .toggle{ display: none; }
#nav_btn{ display: block; float: left; padding: 32px 24px; border-left: 1px solid #ddd; border-right: 1px solid #ddd; cursor: pointer; }
#nav_btn span, #nav_btn span:before, #nav_btn span:after{ 
width: 28px; 
height: 4px; 
float: left; 
display: block; 
background: #444; 
position: relative; 
text-indent: -9000px; 
-webkit-transition: all 100ms ease-in-out;
-moz-transition: all 100ms ease-in-out;
-ms-transition: all 100ms ease-in-out;
-o-transition: all 100ms ease-in-out;
transition: all 100ms ease-in-out;
}
#nav_btn span{ margin: 8px 0; }
#nav_btn span:before, #nav_btn span:after{ content: ''; position: absolute; }
#nav_btn span:before{ top: -8px; }
#nav_btn span:after{ bottom: -8px; }
#nav_btn.active span{ background-color: transparent; }
#nav_btn.active span:before, #nav_btn.active span:after{ top: 0; }
#nav_btn.active span:before{ transform: rotate(45deg); -webkit-transform: rotate(45deg); }
#nav_btn.active span:after{ transform: translateY(-10px) rotate(-45deg); -webkit-transform: translateY(-10px) rotate(-45deg); top: 10px; }
#header #nav ul.menu li{ border-top: 1px solid #ddd; }
#header #nav ul.menu li a{ padding: 16px 20px; }
#header #nav ul.menu li.menu-item-has-children a{ padding-right: 42px; }
#header #nav ul.menu li.menu-item-has-children > a::after{ right: 20px; }
#header #nav ul.menu li.menu-item-has-children ul.sub-menu{ padding: 0; }
#header #nav ul.menu li.menu-item-has-children ul.sub-menu li a{ padding: 14px 20px 14px 40px; }
#header ul.contact{ float: right; position: relative; bottom: inherit; left: inherit; right: inherit; text-align: right; padding: 13px 20px 0; }

#wrapper{ float: left; position: relative; top: inherit; left: inherit; right: inherit; bottom: inherit; }

#main{ padding-left: 0; }

#hero{ height: auto; }
#hero .header{
padding: 120px 60px;
position: relative; 
top: inherit; 
left: inherit; 
-webkit-transform: none;
-ms-transform: none; 
transform: none;
}

#footer{ padding-left: 0; }
}

@media only screen and (max-width: 880px){
#clients ul.logos li{ width: 33.3333%; }

.content-block .gallery .gallery_item{ width: 20%; }
}

@media only screen and (max-width: 680px){
.btn{
height: auto;
line-height: normal;
padding: 12px 26px;
}

.entry{ padding: 30px; }
.entry .header{ margin: 0 0 20px; }
.entry .header::after{ padding-top: 20px; }
.entry .header h3.parent{ font-size: 20px; line-height: 28px; padding-top: 4px; margin: 0 0 6px; }
.entry .header h1{ font-size: 46px; line-height: 54px; }
.entry .header h2.sub_title{ font-size: 32px; line-height: 40px; padding: 12px 0 0; }

#hero .header{ padding: 60px; }
#hero .header h1{ font-size: 36px; line-height: 44px; margin: 0 0 15px; }
#hero .header ul li{ font-size: 20px; line-height: 27px; padding: 0 8px 6px; }

#cta{ padding: 30px; }
#cta .header h2{ font-size: 36px; line-height: 44px; margin: 0 0 25px; }

#clients{ padding: 30px 20px 20px; }
#clients .header{ margin: 0 auto 30px; }
#clients .header h2{ font-size: 46px; line-height: 54px; }
#clients .header h3.sub_title{ font-size: 26px; line-height: 34px; padding: 8px 0 0; }

.project .footer{ padding-top: 10px; }

#footer .nav{ padding: 15px; }
#footer .nav ul li{ padding: 15px; }
#footer .meta{ text-align: left; padding: 20px 30px; }
#footer .meta span{ display: block; }
#footer .meta span span{ display: inline; }
#footer .meta span.copyright::after{ display: none; }

.content-block .gallery .gallery_item{ width: 25%; }

.content-block h1{ font-size: 42px; line-height: 50px; }
.content-block h2{ font-size: 36px; line-height: 44px; }
.content-block h3{ font-size: 30px; line-height: 34px; }
.content-block h4{ font-size: 24px; line-height: 32px; }
.content-block h5{ font-size: 18px; line-height: 26px; }
}

@media only screen and (max-width: 580px){
#header h1#logo{ width: 100%; border-bottom: 1px solid #ddd; }
#nav_btn{ padding: 27px 24px; border-left: 0; }
#header ul.contact{ clear: right; padding: 8px 20px 0; }

#footer .nav ul li{ width: 100%; }

.content-block .alignleft, .content-block .alignright{ max-width: 100%; display: block; float: none; padding-left: 0; padding-right: 0; margin: 0 auto; }
}

@media only screen and (max-width: 480px){
.entry{ padding: 25px; }

#hero .header{ padding: 40px; }

#clients ul.logos li{ width: 50%; }

#footer .nav{ padding: 10px; }
#footer .nav ul li{ padding: 10px; }
#footer .meta{ padding: 20px; }

.wpcf7-form div.form_field{ margin: 0 0 15px; }

.content-block .gallery .gallery_item{ width: 33.3333%; }
}

@media only screen and (max-width: 380px){
.content-block .gallery .gallery_item{ width: 50%; }
}