/*-- Media Queries --*/

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


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

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

	header h1 {
		padding-left:40px;
		padding-right:40px;
	}

	#our-services .container {
		padding-left:40px;
		padding-right:40px;
	}

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

	#featured-projects .container {
		padding-left:0;
		padding-right:0;
	}

	.three-columns .col {
		width:31%;
		padding-left:40px;
		padding-right:40px;
		margin-right:10px;
		margin-left:10px;
	}

	#about-us .two-columns .col {
		width:48%;
		padding-left:40px;
		padding-right:40px;
		margin-right:10px;
		margin-left:10px;
	}

	#testimonial {
		margin-bottom:40px;
	}

	#testimonial .container {
		min-height:450px;
		padding-left:40px;
	}

	#testimonial .flex-control-nav {
		text-align:center;
		text-indent:0;
		left:0;
		padding-right:400px;
		margin-left:0;
	}

	#turf-samples .col {
		width:20%;
	}

	footer .col:nth-child(1) {
		width:25%;
	}

	footer .col:nth-child(2) {
		width:35%;
	}

	footer .col:nth-child(3) {
		width:40%;
	}
}

@media (max-width: 1250px) {
	#our-founder .two-columns .col:nth-child(1) {
		padding-left:40px;
	}

	#our-founder .two-columns .col:nth-child(2) {
		min-height:600px;
	}

	#testimonial .container {
		padding-right:480px;
	}

	#testimonial img {
		width:400px;
		height:auto;
		margin-top:-245px;
	}

	#turf-installation .four-columns .col {
		width:50%;
	}

	#turf-samples .col {
		width:25%;
	}

	#turf-samples h4 {
		font-size:18px;
	}

	footer .col:nth-child(1) {
		width:30%;
	}

	footer .col:nth-child(3) {
		width:100%;
		text-align:left;
	}
}

@media (max-width: 1150px) {
	#featured-projects .container {
		padding-bottom:0;
	}

	#gallery #testimonial .container,
	#testimonial .container {
		padding:80px 40px;
		min-height:auto;
	}

	#testimonial h3 {
		text-align:center;
		padding-right:50px;
	}

	#testimonial img {
		width: 300px;
    	height: auto;
    	margin-top:0;
    	position:relative;
    	top:auto;
    	right:auto;
	}

	#testimonial .flex-control-nav {
		width:100%;
		padding:0;
		bottom:27px;
	}
}

@media (max-width: 1120px) {
	
	/* Mobile Nav */

	nav ul {
		display:none;
	}

	.menu-wrapper {
		display:block;
		position:absolute;
		top:20px;
		right:40px;
		width:50px;
		height:70px;
		display:flex;
		align-items:center;
		justify-content:right;
		cursor:pointer;
	}

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

	#nav-button span {
		width:40px;
		height:4px;
		display:block;
		background:rgba(96, 165, 17, 1);
	}

	#nav-button.active .line2 {
		background:rgba(255, 77, 14, 0); 
	}

	#nav-button .line1 {
		position:absolute;
		left:0;
		bottom:11px;
		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:11px;
		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:fixed;
		right:-600px;
		z-index:998;
		padding:80px 60px 0 60px;
	}

	#navigation-overlay {
		width:500px;
		height:100%;
		background:#60a511;
		position:fixed;
		right:-600px;
		z-index:997;
	}

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

	#mobile-navigation li {
		margin:0;
	}

	#mobile-navigation li a {
		font:700 30px/30px "montserrat", sans-serif;
		letter-spacing:0;
		color:#fff;
		text-transform:uppercase;
		text-decoration:none;
		background:none !important;
		display:block;
		padding:20px 0;
	}

	#about-us .two-columns .col {
		width:46%;
		padding-left:40px;
		padding-right:40px;
		margin-right:10px;
		margin-left:10px;
	}
}


@media (max-width: 1050px) {
	.three-columns .col {
		width:45%;
	}

	#our-founder p {
		font-size:22px;
		line-height:30px;
	}

	#row1 {
		height:600px;
	}

	#row1 .col:nth-child(1) {
		width:100%;
		height:50%;
		padding-right:0;
		padding-bottom:5px;
	}

	#row1 .col:nth-child(2) {
		width:50%;
		height:50%;
		padding-top:5px;
		padding-left:0;
	}

	#row1 .col:nth-child(3) {
		width:50%;
		height:50%;
		padding-top:5px;
	}

	#row2 {
		height:600px;
	}

	#row2 .col:nth-child(1) {
		width:50%;
		height:50%;
		padding-bottom:5px;
	}

	#row2 .col:nth-child(2) {
		width:50%;
		height:50%;
		padding-bottom:5px;
	}

	#row2 .col:nth-child(3) {
		width:100%;
		height:50%;
		padding-top:5px;
	}

	#about-us .photo2 {
		background-position:center -80px;
	}

	#turf-installation #projects #row1 .col:nth-child(1) {
		width:100%;
	}

	#turf-installation #projects #row1 .col:nth-child(2),
	#turf-installation #projects #row1 .col:nth-child(3) {
		width:50%;
	}

	#turf-samples .col {
		width:33.3%;
	}

	footer .col:nth-child(1) {
		width:100%;
		margin-bottom:40px;
	}

	footer .col:nth-child(2) {
		width:100%;
	}
}


@media (max-width: 950px) {
	#our-founder .two-columns .col:nth-child(1) {
		width:100%;
		padding:60px 40px;
	}

	#our-founder .two-columns .col:nth-child(2) {
		width:100%;
		min-height:450px;
		background-position:center -120px;
	}
}


@media (max-width: 850px) {
	#testimonial .container {
		display:block;
	}

	#testimonial h3 {
		padding-right:0;
		margin:0 0 40px 0;
	}

	#testimonial img {
		margin:0 auto;
	}

	#about-us .photo2 {
		background-position:center -40px;
	}

	#about-us .two-columns .col {
		width:100%;
		padding-left:40px;
		padding-right:40px;
		margin-right:0;
		margin-left:0px;
	}
}


@media (max-width: 750px) {
	hr {
		margin: 40px 0 0 0;
	}

	.container {
		padding:70px 20px;
	}

	.logo {
		left:20px;
	}

	.menu-wrapper {
		right:20px;
	}

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

	#our-services .container,
	#featured-projects .container {
		padding-left:20px;
		padding-right:20px;
	}

	#featured-projects .container {
		padding-left:0;
		padding-right:0;
	}

	.three-columns .col {
		width:100%;
		margin:0 0 20px 0;
	}

	#our-founder .two-columns .col:nth-child(1) {
		padding-left:20px;
		padding-right:20px;
	}

	#our-founder .two-columns .col:nth-child(2) {
    	background-position: center -80px;
	}

	#gallery #testimonial .container,
	#testimonial .container {
		padding:60px 20px 80px 20px;
	}
}


@media (max-width: 700px) {
	#banner {
		font-size:20px;
		line-height:24px;
	}

	#turf-installation .four-columns .col {
		width:100%;
	}

	#turf-samples .col {
		width:50%;
	}

	footer .col:nth-child(2),
	footer .col:nth-child(3) {
		width:100%;
	}

	footer .col:nth-child(2) {
		margin-bottom:30px;
	}
}

@media (max-width: 550px) {
	#navigation-overlay {
		width:100%;
	}

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

@media (max-width: 500px) {
	h1 {
		font-size:45px;
		line-height:45px;
	}

	h2 {
		font-size:42px;
		line-height:42px;
	}

	h3 {
		font-size:30px;
		line-height:35px;
	}

	h4 {
		font-size:20px;
		line-height:20px;	
	}

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

	#mobile-navigation li a {
		font-size:25px;
		line-height:25px;
	}

	#our-founder p {
		font-size:20px;
		line-height:28px;
	}

	header {
		height:500px;
	}

	.three-columns .col {
		padding-left:20px;
		padding-right:20px;
	}

	#our-founder .two-columns .col:nth-child(2) {
		background-position:center center;	
	}

	#testimonial h3 {
		font-size:30px;
		line-height:30px;
	}

	#testimonial h3.small {
		font-size:20px;
		line-height:24px;
	}

	#about-us #row1,
	#turf-installation #row1,
	#contact-us #row1 {
		height:300px;
		padding-bottom:0;
	}

	#about-us #row1 .col:nth-child(1),
	#turf-installation #row1 .col:nth-child(1), 
	#contact-us #row1 .col:nth-child(1) {
		height:100%;
	} 

	#about-us #row1 .col:nth-child(2),
	#about-us #row1 .col:nth-child(3),
	#turf-installation #row1 .col:nth-child(2),
	#turf-installation #row1 .col:nth-child(3),
	#contact-us #row1 .col:nth-child(2),
	#contact-us #row1 .col:nth-child(3) {
		display:none;
	}

	#turf-samples .col {
		width:100%;
	}

	#testimonial img {
		width:100%;
	}
}