/* RESPONSIVE */

@media(min-width: 576px)  {
   
    .container {
        max-width: 100%;
    }

}
@media(min-width: 768px)  {
   
    .container {
        max-width: 750px;
    }

}
@media(min-width: 992px)  {
   
    .container {
        max-width: 970px;
    }
}
@media(min-width: 1200px)  {
   
    .container {
        max-width: 1170px;
    }
}
@media(min-width: 1470px) {
   
    .container {
        max-width: 1430px;
    }
}

@media (max-width: 1300px) {

	h1 {
		font-size: 44px;
	}
	h2 {
		font-size: 36px;
	}
	h3 {
		font-size: 28px;
	}
	h4 {
		font-size: 23px;
	}
	
	header .logo img {
		height: 52px;
	}
	nav.menu-desktop {
		margin-right: 30px;
	}
	nav > ul > li > a {
		font-size: 19px;
		padding: 28px 8px 23px 8px;
	}
}

@media (max-width: 1200px) {
	
	h1 {
		font-size: 42px;
	}
	h2 {
		font-size: 34px;
	}
	h3 {
		font-size: 27px;
	}
	h4 {
		font-size: 22px;
	}
	
	body {
		font-size: 18px;
	}
	
	.page-header {
		margin-bottom: 20px;
	}
	
	.header-desktop .phone-big {
		display: none;
	}
	
    nav.menu-desktop {
        margin-right: 20px;
    }
	
	nav > ul > li > a {
		font-size: 18px;
	}
	
	.phone-big {
		width: 165px !important;
		height: 58px !important;
	}
	.phone-big-title {
		font-size: 17px !important;
	}
	.phone-big a {
		font-size: 20px !important;
	}
	
	.sub-menu {
		top: 72px;
	}

    .header-wrap {
        padding: 0 20px;
    }
	
	.title {		
		margin-bottom: 15px;
	}
	.title-1 {
		margin-bottom: 30px;
	}
	
	.banner .banner-content h1 {
		font-size: 60px;
	}
	
	.about-us-summary .info {
		padding-top: 10px;
	}
	
	.about-us .info .image {	
		max-width: 55%;
		padding: 0 20px 0 0;
	}

	.pages-section .item {
		padding: 0 30px;
	}
	
	.our-team .box {
		padding: 30px 20px 20px 20px !important;
	}
	
	.testi .testi-title > img {
		height: 85px;
	}
}

@media (max-width: 1200px) and (min-width: 992px) {
	
	header .container {
		max-width: 100%;
    }
	
	.au-btn {
		padding: 6px 35px;
		font-size: 19px;
	}
	
	.about-us-summary .image {
		padding-right: 0;
	}
	
	footer .company_details .text a, footer .company_details .text a:hover { 
		font-size: 15px;
	}
	footer .widget_links h4 { 
		font-size: 21px; 
	}
}

@media (max-width: 992px) {
	
	body {
		font-size: 18px;
	}
	
	h1 {
		font-size: 35px;
	}
	h2 {
		font-size: 32px;
	}
	h3 {
		font-size: 28px;
	}
	h4 {
		font-size: 21px;
	}
	h5 {
		font-size: 19px;
	}
	
	section {
		padding-top: 20px;
		padding-bottom: 40px;
	}
	
	.page-header {
		margin-bottom: 15px;
	}
	
	.mobile-hide {
		display: none;
	}
	.mobile-show {
		display: block;
	}
	
	.back-btn {
		display: inherit;
	}
	.header-desktop .phone-big {
		display: none;
	}
	.email-bar {
		display: none;
	}	
	.breadcrumb {
		display: none;
	}
	
	.au-btn {
		padding: 5px 30px;
		font-size: 17px;
	}
	
	.header-mobile .logo {
		margin-top: 0;
		padding: 5px 0 5px 0;
		float: left !important;
	}

	.banner {
		height: 550px !important;
		background-size: cover !important;
		background-position: 40% !important;
	}
	.banner .banner-content h1 {
        font-size: 50px;
    }
	.banner .down {
		display: none;
	}
	.diagonal, .diagonal-gray, .diagonal-white{
        height: 60px;
    }
	
	.about-us-summary .image {
		display: none;
	}
	
	.page-header .container-header .title {
		margin-top: 0;
	}
	.page-header .inner img {
		width: 100vw;
		height: 30vw;
		min-height: auto;
		overflow: hidden;
	}
	
	.project-info .title-2 {
		float: right;
	}
	
	.stars.projects {
		padding-bottom: 30px;
	}
	
	.our-clients {
		padding: 15px 0;
	}
	
	.testi .testi-title > img {
		height: 75px;
	}
	
	.contact-us .submit-form, .contact-us .submit-form .map {
		margin-top: 20px;
	}
	
	.contact-us .submit-form .container {
		max-width: 100%;
	}

	.about-us-summary p {
		padding: 0;
	}
	
	.about-us .info .image {
		max-width: 100%;
		padding: 10px 0 10px 0;
	}

    .header-desktop {
        display: none;
    }
	
	.slider {
		margin-bottom: 10px;
	}
	
    header.header-mobile {
        display: block;
    }
	
	header.header-mobile .responsive {
		float: right;
		display: block;
		padding: 0;
		margin: 10px 0 8px 15px;
		border-radius: 4px;
		background-color: #f06f2b;
	}
	
	header.header-mobile .nav-toggle {
		display: block;
		margin: 0;
		position: relative;
		padding: 20px 10px 14px 30px;
		cursor: pointer;
	}
	header.header-mobile .nav-toggle i {
		top: 16px;
	}
	header.header-mobile .nav-toggle i, header.header-mobile .nav-toggle i:before, header.header-mobile .nav-toggle i:after {
		border-radius: 0px;
		height: 2.2px;
		width: 20px;
		background-color: #fff;
		position: absolute;
		display: block;
		content: '';
		transition: all 250ms ease-in-out;
	}
	header.header-mobile .nav-toggle i:before {
		top: -6px;
	}
	header.header-mobile .nav-toggle i:after {
		top: 6px;
	}
	header.header-mobile .nav-toggle.active {
		background: transparent;
	}
	header.header-mobile .nav-toggle.active i {
		background-color: transparent;
	}
	header.header-mobile .nav-toggle.active i:before, header.header-mobile .nav-toggle.active i:after {
		top: 0;
		background-color: #fff;
	}
	header.header-mobile .nav-toggle.active i:before {
		-webkit-transform: rotate(45deg);
          transform: rotate(45deg);
	}
	header.header-mobile .nav-toggle.active i:after {
		-webkit-transform: rotate(-45deg);
          transform: rotate(-45deg);
	}
	
	header.header-mobile .responsive.bar {
		padding: 0;
		margin: 10px 0 8px 6px;
		border-radius: 50%;
	}
	
	header.header-mobile .buttons {
		display: block;
		padding: 6px 10px 1px 10px;
		line-height: 15px;
	}
	header.header-mobile .buttons i {
		color: #fff;
		font-size: 22px;
		vertical-align: super;
	}	
	
	header.header-mobile .logo a {
		padding: 5px 0 5px 0;
	}
	header.header-mobile .logo img {
		height: 45px !important;
	}
	
	header.header-mobile.sticky-nav {
		position: fixed;
		top: 0;
		z-index: 199;
		width: 100%;
		background-color: #FFF;
		border-bottom: 1px solid #f06f2b;
	}
	
    .dot-wrap .slick-dots {
        -webkit-box-orient: horizontal;
        -webkit-box-direction: normal;
        -webkit-flex-direction: row;
        -moz-box-orient: horizontal;
        -moz-box-direction: normal;
        -ms-flex-direction: row;
        flex-direction: row;
        bottom: 0;
        left: 0;
        top: auto;
        right: auto;
        width: 100%;
        height: 18%;
    }

    .dot-wrap .slick-dots li {
        height: 100%;
    }

	footer .container { 
		max-width: 90%;
	}
	footer .widget_links {
		padding-top: 30px;
	}
}

@media (max-width: 768px) {
	
	h1 {
		font-size: 30px;
	}
	h2 {
		font-size: 28px;
	}
	h3 {
		font-size: 26px;
	}
	
	.banner .banner-content h1 {	
        font-size: 40px;
    }
	
	.page-header .inner img {
		height: 40vw;
	}
	
	.pages-section .item {
		padding: 20px 60px;
	}
	.pages-section .item .image > img {
		width: 100%;
	}
	
	.stars.projects {
		padding-bottom: 20px;
	}
	.stars.projects .item {
		padding: 0 10px 20px 10px;
	}
	.stars.projects .item:last-child {
		padding-bottom: 0;
	}
	
	.our-team .box {
		width: 49.9%;
	}
	
	.testi .testi-title > img {
		height: 65px;
	}
	
	.form-contact-wrap {
		margin-top: 0 !important;
	}
	
    .dot-wrap .slick-dots {
        height: 15%;
    }
	
	.quick-contact-form .form-contact input {
		margin-bottom: 5px;
	}
	
	footer .container { 
		max-width: 70%;
	}
}

@media (max-width:767px) and (min-width:413px) {	

	.copyright {
		clear:both;
	}	
}

@media (max-width: 576px) {
	
	header.header-mobile .responsive {
		margin: 10px 0 8px 8px;		
	}
	header.header-mobile .responsive.bar {
		margin: 10px 0 8px 4px;
	}
	header.header-mobile .buttons {
		padding: 6px 8px 1px 8px;
	}
	header.header-mobile .buttons i {
		font-size: 21px;
	}
	
	.testi__item blockquote > i {
        right: -35px;
    }
	
	.au-btn {
		padding: 4px 28px;
		font-size: 16px;
	}
}

@media (max-width:476px) {

	nav.menu-mobile {
		top: 100px;
	}
	.header-mobile.sticky-nav nav.menu-mobile {
		top: 52px;
	}
	
	header.header-mobile .logo {
		float: none !important;		
	}
	header.header-mobile.sticky-nav .logo {
		display: none;
	}	
	header.header-mobile .logo img {
		height: 38px !important;
		margin: 0 auto;
		display: block;
	}
	
	header.header-mobile .responsive.bar {
		float: left;
		margin: 10px 8px 8px 0;
	}
	
	.banner .banner-content h1 {
        font-size: 35px;
		line-height: 35px;
    }
	
	.copyright {
		float:none;
		display:block;
	}

	footer .container { 
		max-width: 90%;
	}
}

@media (max-width:375px) {
	
	h1 {
		font-size: 26px;
	}
	h2 {
		font-size: 24px;
	}
	h3 {
		font-size: 19px;
	}
	
	.our-team .box .holder .job {
		font-size: 16px;
	}
	
	.testi .testi-title > img {
		height: 55px;
	}
}