/*-- Media Queries --*/

.menu-wrapper,
#mobile-navigation,
.mobile {
	display:none;
}

@media (max-width: 1780px) {
	.container {
		width:100%;
		margin:0;
		padding:100px 40px;
	}

	header .container {
		padding-left:40px;
		padding-right:40px;
	}

	.home header h1 {
		left:40px;
	}

	.logo {
		left:40px;
	}

	.two-columns-full-width .content {
		width:100%;
		padding:100px 70px;
	}

	.two-columns-full-width .col:nth-child(1) .content {
		float:none;
		padding-left:40px
	}

	.two-columns-full-width .col:nth-child(2) .content {
		float:none;
		padding-right:40px
	}
}


@media (max-width:1650px) {
	h1 {
		font:900 110px/110px industry, sans-serif;
	}

	.two-columns {
		column-gap:90px;
	}
}


@media (max-width:1450px) {
	.container-small {
		width:100%;
		margin:0;
		padding:100px 40px;
	}

	#posts .two-columns .col:nth-child(1) {
		padding-right:80px;
	}

	.page-template-services .four-columns {
		grid-template-columns: repeat(3, 1fr);
	}
}


@media (max-width:1360px) {
	h1 {
		font:900 90px/90px industry, sans-serif;
	}

	.home header {
		height:600px;
	}


}


@media (max-width:1250px) {
	.three-columns {
		grid-template-columns: repeat(2, 1fr);
		column-gap:40px;
	}
}


@media (max-width:1200px) {
	.two-columns {
		grid-template-columns: repeat(1, 1fr);
		row-gap:40px;
	}

	.two-columns-full-width {
		grid-template-columns: repeat(1, 1fr);
		row-gap:0;
	}

	.two-columns-full-width .content {
		padding:90px 40px;
	}

	#featured-projects .two-columns {
		column-gap:40px;
	}

	#featured-projects a {
		height:300px;
	}

	.page-template-services .four-columns {
		grid-template-columns: repeat(2, 1fr);
	}

	#cta img {
		left:50%;
		transform:translateX(-50%);
	}

	#cta .two-columns .col:nth-child(2) {
		height:380px;
	}

	#posts .two-columns {
		grid-template-columns:100%;
	}

	#posts .two-columns .col:nth-child(1) {
		padding:0;
		margin:0 0 40px 0;
	}
}


@media (max-width:950px) {
	nav ul {
		display:none;
	}	

	.menu-wrapper {
		width:32px;
		height:65px;
		display:flex;
		align-items:center;
		justify-content:center;
		cursor:pointer;
		position:absolute;
		top:50%;
		transform:translateY(-50%);
		right:40px;
		z-index:1;
	}

	#nav-button {
		position:relative;
		transform:translateY(0);
		transition:all 0ms 200ms;
	}

	#nav-button span {
		width:32px;
		height:2px;
		display:block;
		background:rgba(250, 251, 240, 1);
	}

	#nav-button.active .line2 {
		background:rgba(250, 251, 240, 0); 
	}

	#nav-button .line1 {
		position:absolute;
		left:0;
		bottom:8px;
		transition:bottom 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
	}

	#nav-button .line3 {
		position:absolute;
		left:0;
		top:8px;
		transition:top 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms cubic-bezier(0.23, 1, 0.32, 1);
	}

	#nav-button.active .line3 {
		top:0;
		transform:rotate(45deg);
		transition:top 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
	}

	#nav-button.active .line1 {
		bottom:0;
		transform:rotate(-45deg);
		transition:bottom 200ms cubic-bezier(0.23, 1, 0.32, 1), transform 200ms 200ms cubic-bezier(0.23, 1, 0.32, 1);
	}

	#mobile-navigation {
		width:500px;
		position:absolute;
		right:-500px;
		z-index:4;
		padding:00px 50px 0 50px;
		display:none;
	}

	#navigation-overlay {
		width:500px;
		height:100%;
		background:#673604;
		position:absolute;
		right:-600px;
		z-index:3;
		display:none;
	}

	#mobile-navigation ul {
		list-style:none;
	}

	#mobile-navigation li {
		margin:0;
	}

	#mobile-navigation li a {
		font:500 22px/24px trade-gothic-next, sans-serif;
		letter-spacing:0.05em;
		text-transform:uppercase;
		color:#f0e5d7;
		display:block;
		padding:20px 0;
		transition:all 0.3s ease;
	}

	#mobile-navigation li.social {
		display:inline-block;
		margin-top:50px;
		margin-right:15px;
	}

	#mobile-navigation li.social a {
		display:inline-block;
		border:1px solid #9cb2ab;
		border-radius:50%;
		padding:15px;
	}

	#mobile-navigation li.social a:hover {
		background:#9cb2ab;
	}

	#mobile-navigation li.social a img {
		width:15px;
		display:block;
	}

	#featured-projects .two-columns {
    	grid-template-columns:repeat(1, 1fr);
	}

	#cta img {
		bottom:-90px;
	}
}


@media (max-width:950px) {
	.container,
	.container-small,
	.two-columns-full-width .content {
		padding:90px 25px;
	}

	.two-columns-full-width .col:nth-child(1) .content {
		padding-left:25px;
	}

	.two-columns-full-width .col:nth-child(2) .content {
		padding-right:25px;
	}

	header .container {
		padding-left:25px;
		padding-right:25px;
	}

	.logo {
		left:25px;
	}

	.menu-wrapper {
		right:25px;
	}

	.home header h1 {
		left:25px;
	}

	#intro .two-columns .col:nth-child(1) .testimonial {
		width:100%;
	}
}


@media (max-width:850px) {
	h1,
	#posts h1 {
		font:900 70px/70px industry, sans-serif;
	}

	header {
		height:auto;
	}

	header .container {
		padding-top:60px;
		padding-bottom:60px;
	}

	#projects h1 {
		font-size:70px;
		line-height:70px;
	}

	.four-columns {
		grid-template-columns:repeat(2, 1fr);
		column-gap:30px;
		row-gap:30px;
	}
}


@media (max-width:750px) {
	h1 br {
		display:none;
	}

	h2 {
		font:600 60px/65px industry, sans-serif;
	}

	h6 {
		font-size:24px;
		line-height:30px;
	}

	.home header {
		height:550px;
	}

	.home header h1 {
		bottom:60px;
	}

	#cta h2 {
		margin:0 0 10px 0;
	}

	.three-columns {
		grid-template-columns: repeat(1, 1fr);
		column-gap:0;
		row-gap:60px;
	}

	.testimonial {
		padding:40px 25px;
	}

	.page-template-services .three-columns p {
		margin:0;
	}

	.posts-photo {
		height:350px;
	}

	.page-template-services .four-columns {
		grid-template-columns: repeat(1, 1fr);
		row-gap:40px;
	}
}


@media (max-width:550px) {
	h1,
	#posts h1 {
		font:900 60px/60px industry, sans-serif
	}

	#projects h1 {
		font-size:60px;
		line-height:60px;
	}

	h2 {
		font:600 50px/55px industry, sans-serif;
		margin:0 0 30px 0;
	}

	h6 {
		font-size:22px;
		line-height:28px;
	}

	.container,
	.container-small,
	.two-columns-full-width .content {
		padding:80px 20px;
	}

	.two-columns-full-width .col:nth-child(1) .content {
		padding-left:20px;
	}

	.two-columns-full-width .col:nth-child(2) .content {
		padding-right:20px;
	}

	header .container {
		padding-left:20px;
		padding-right:20px;
	}

	.home header {
		height:450px;
	}

	.logo {
		left:20px;
	}

	.menu-wrapper {
		right:20px;
	}

	#navigation-overlay {
		width:100%;
	}

	#mobile-navigation {
		width:100%;
		padding:0 40px;
	}

	.home header h1 {
		left:20px;
	}

	.testimonial {
		padding:40px 20px;
	}

	.testimonial img {
		width:75px;
	}

	.testimonial h3 {
		font-size:27px;
		line-height:32px;
	}

	.market-areas-map {
		margin-top:-20px;
	}

	#cta img {
		width:400px;
		bottom:-80px;
	}

	#cta .two-columns .col:nth-child(2) {
		height:330px;
	}

	.four-columns {
		grid-template-columns:repeat(1, 1fr);
		column-gap:0;
		row-gap:25px;
	}

	.posts-photo {
		height:250px;
	}
}


@media (max-width:400px) {
	h1,
	#posts h1 {
		font:900 50px/50px industry, sans-serif
	}

	#projects h1 {
		font-size:50px;
		line-height:50px;
	}

	h2 {
		font:600 42px/48px industry, sans-serif;
		margin:0 0 30px 0;
	}

	p {
		font:400 17px/25px trade-gothic-next, sans-serif;
	}

	nav {
		height:80px;
	}

	.logo {
		width:200px;
	}

	footer p {
		font-size:20px;
		line-height:30px;
	}
}