/*-- Media Queries --*/

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




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

	.logo {
		left:20px;
		z-index:999;
	}

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

	header .two-columns .col:nth-child(1) {
		padding:120px 80px 80px 0;
	}

	header h1 {
		font:400 110px/100px "Druk Heavy", sans-serif;
	}

	.home header {
		padding-left:0;
		padding-right:0;
	}

	#intro .two-columns .col:nth-child(1) {
		padding:0 50px 0 0;
	}

	#intro h2 br {
		display:none;
	}

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

	#intro .two-columns .col:nth-child(2) {
		padding-left:0;
	}

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

	#who-we-work-with .container {
		padding-left:40px;
		padding-right:0;
	}

	#careers-form .container .content .form {
		padding:30px 40px 60px 40px;
	}

	#contact-info .two-columns .col:nth-child(1) {
		padding:0 70px 0 0;
	}

	#contact-info .two-columns .col:nth-child(2) {
		padding-left:20px;
	}

	#contact-info .inner-three-columns {
		flex-wrap:wrap;
	}

	#contact-info .inner-three-columns .inner-col {
		width:50%;
		margin-bottom:40px;
	}

	#latest-projects .three-columns {
		grid-template-columns:50% 50%;
		column-gap:0
	}

	#latest-projects .three-columns .col {
		padding:0 20px;
	}

	#latest-projects .three-columns .col:nth-child(odd) {
		padding-left:0;
	}

	#latest-projects .three-columns .col:nth-child(even) {
		padding-right:0;
	}
}


@media (max-width: 1640px) {
	#intro .two-columns .col:nth-child(1) {
		width:65%;
	}

	#intro .two-columns .col:nth-child(2) {
		width:35%;
	}
}


@media (max-width: 1450px) {
	header h1 {
		font:400 100px/90px "Druk Heavy", sans-serif;
	}

	header h1 .line {
		height:90px;
	}

	header .two-columns .col:nth-child(1) {
		padding:120px 60px 60px 0;
	}

	.accordion-content .content {
		padding:0 40px 40px 130px;
	}

	.accordion-header {
		padding:30px 60px 30px 130px;
	}

	.accordion-header span {
		left:25px;
	}

	#home-services .col {
		padding:20px;
	}

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

	#intro .two-columns .col:nth-child(2) {
		width:35%;
	}

	.page-template-about-us #quote .container,
	.page-template-our-services #quote .container,
	.page-template-careers #quote .container {
		padding:120px 40px 60px 0;
	}

	.page-template-about-us #quote .two-columns .col:nth-child(2),
	.page-template-our-services #quote .two-columns .col:nth-child(2),
	.page-template-careers #quote .two-columns .col:nth-child(2) {
		padding-left:60px;
	}
}


@media (max-width: 1350px) {
	#intro .two-columns .col:nth-child(2) img {
    	top:-20px;
	}
}


@media (max-width: 1300px) {
	nav ul {
    	justify-content:left;
    	padding-left:250px;
	}

	nav ul li {
		margin:0;
	}

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

	.home header .title {
		left:0;
		padding-left:40px;
		padding-right:40px;
	}

	h1 .line {
		display:none;
	}

	h1 .mobile {
		display:block;
	}

	h1 .yellow,
	h2 .yellow {
		display:inline;
	}

	.contact a {
		margin-left:10px;
	}
}


@media (max-width: 1250px) {
	#intro .two-columns .col:nth-child(1) {
		width:100%;
		padding-right:0;
	}

	#intro .two-columns .col:nth-child(2) {
		display:none;
	}

	#intro h2 span {
		display:inline;
	}

	.page-template-our-services #home-services .col {
		width:100%;
	}

	.page-template-our-services #home-services .col:nth-child(1) {
		border-right:0;
		border-bottom:2px solid #04295a;
	}

	.page-template-our-services #home-services .col:nth-child(2) {
		border-right:0;
		border-bottom:2px solid #04295a;
	}

	.page-template-our-services #home-services .col {
		padding-bottom:40px;
	}

	.page-template-our-services #home-services h3 {
		font-size:60px;
		line-height:60px;
	}

	.page-template-our-services #quote .two-columns .col:nth-child(1) img {
		top:10px;
	}

	footer .container {
		padding:80px 40px;
	}
}


@media (max-width: 1150px) {
	h1 span {
		display:inline;
	}

	h3 {
		font:400 45px/50px "Druk Bold", sans-serif;
	}

	.container {
		padding:80px 25px;
	}

	header .container {
		padding-left:0;
		padding-right:0;
		padding-bottom:0;
	}

	.home header h1 {
		width:100%;
	}

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

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

	.mobile-header {
		width:100%;
		height:500px;
		display:block;
		position:relative;
		overflow:hidden;
		padding:0;
	}

	.mobile-header img {
		position:absolute;
		top:50%;
		left:50%;
		transform:translate(-50%, -50%);
		object-fit:cover;
		object-position:center center;
		width:101%;
		height:101%;
	}

	header .two-columns .col:nth-child(2) {
		display:none;
	}

	header .two-columns .col:nth-child(1) {
		width:100%;
		padding:80px 25px;
	}

	#who-we-work-with .container {
		padding-left:25px;
	}

	#home-services .container {
		padding:15px;
	}

	#home-services .intro {
		padding:60px 25px 40px 25px;
	}

	#home-services .photo {
		margin:0 0 20px 0;
	}

	#home-services h3 {
		margin:0 0 10px 0;
	}

	#home-services .three-columns {
		margin:0 0 25px 0;
	}

	#home-services .container .content {
		padding-bottom:25px;
	}

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

	#featured-projects .two-columns .col {
		padding:0 20px;
	}

	#featured-projects .photo {
		margin-bottom:25px;
	}

	#our-customers .intro {
		padding:60px 25px 40px 25px;
	}

	#our-customers .container {
		padding:15px;
	}

	#about-accordion .container {
		padding:15px;
	}

	.page-template-our-services #quote .two-columns .col:nth-child(1) img {
		top:-30px;
	}

	#categories .container {
		padding-top:0;
	}

	#careers-form .container {
		padding:15px;
	}

	#careers-form .container .content .intro {
		padding:60px 25px 40px 25px;
	}

	#careers-form .container .content .form {
		padding:30px 25px 50px 25px;
	}

	.page-template-contact-us .mobile-header img {
		object-position:top center;
	}

	#contact-info .two-columns .col:nth-child(1) {
		width:100%;
		padding:0;
		margin:0 0 30px 0;
	}

	#contact-info .two-columns .col:nth-child(2) {
		width:100%;
		padding:0;
	}

	#contact-info .inner-three-columns .inner-col {
		width:33.3%;
	}

	#contact-info .inner-three-columns {
		margin:0;
	}

	#contact-info .container {
		padding-top:0;
	}

	#contact-info .two-columns .col:nth-child(1) {
		margin-bottom:50px;
	}

	#home-services .intro p br {
		display:none;
	}

	footer .container {
		padding:80px 25px;
	}

	footer .col:nth-child(4) img {
		width:200px;
	}

}


@media (max-width: 1100px) {
	.home header {
		height:650px;
	}

	.home header h1 {
		font:400 120px/110px "Druk Heavy", sans-serif;
	}

	#intro h2 {
		font:400 90px/80px "Druk Heavy", sans-serif;	
	}

	#who-we-work-with .container {
		padding-left:25px;
		padding-right:25px;
	}

	#who-we-work-with .two-columns .col:nth-child(1) {
		width:100%;
		padding:60px 40px;
		margin:0 0 40px 0;
	}

	#who-we-work-with .two-columns .col:nth-child(2) {
		width:100%;
		padding:0;
	}

	#featured-projects .two-columns .col {
		padding:0 14px;
	}

	#categories {
		margin-bottom:50px;
	}

	#categories .container {
		justify-content:center;
	}

	.contact {
		width:auto;
	}
	.contact a.phone {
		display:none;
	}

	#our-customers .col {
		width:50%;
	}

	#our-customers .col:nth-child(2) {
		border-right:0;
		border-bottom:2px solid #04295a;
	}

	#our-customers .col:nth-child(1) {
		border-bottom:2px solid #04295a;
	}

	.page-template-about-us #quote .container,
	.page-template-our-services #quote .container,
	.page-template-careers #quote .container {
		padding:120px 25px 60px 0;
	}

	.page-template-about-us #quote .two-columns .col:nth-child(1) {
		width:35%;
	}

	.page-template-about-us #quote .two-columns .col:nth-child(2) {
		width:65%;
	}

	.page-template-about-us #quote .two-columns .col:nth-child(1) img {
		width:400px;
		top:-10px;
	}

	#careers-form .container .content .intro p br {
		display:none;
	}
}

@media (max-width: 1000px) {
	h2 {
		font-size:60px;
		line-height:60px;
	}

	.home header h1 br {
		display:none;
	}

	#latest-projects .three-columns .col {
		padding:0 13px;
	}

	#home-services .col {
		width:100%;
	}

	#home-services .col:nth-child(1) {
		border-right:0;
		border-bottom:2px solid #04295a;
	}

	#home-services .col:nth-child(2) {
		border-right:0;
		border-bottom:2px solid #04295a;
	}

	#home-services h3 {
		font-size:60px;
		line-height:60px;
	}

	#featured-projects .two-columns .col {
		width:100%;
		padding:0;
		margin:0 0 40px 0;
	}

	#featured-projects .container {
		padding-bottom:60px;
	}

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

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

	footer .col:nth-child(4) img {
		float:none;
	}
}


@media (max-width: 920px) {
	#nav,
	.contact {
		display:none;
	}

	/* MOBILE NAV */

	.menu-wrapper {
		width:60px;
		height:60px;
		background:#ffcb11;
		display:flex;
		align-items:center;
		justify-content:center;
		cursor:pointer;
		position:absolute;
		top:35px;
		right:0;
		padding:20px;
		z-index:6;
	}

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

	#nav-button span {
		width:34px;
		height:3px;
		display:block;
		background:rgba(21, 22, 27, 1);
	}

	#nav-button.active .line2 {
		background:rgba(21, 22, 27, 0);
	}

	#nav-button .line1 {
		position:absolute;
		left:0;
		bottom:9px;
		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:9px;
		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);
	}

	#navigation {
		width:400px;
		height:100vh;
		position:fixed;
		top:0;
		right:-400px;
		z-index:5;
		padding:180px 40px 0 50px;
		display:none;
	}

	#navigation-overlay {
		width:400px;
		height:100%;
		background:#ffcb11;
		position:fixed;
		top:0;
		right:-500px;
		z-index:5;
		display:none;
		/*padding:20px 20px 20px 20px;*/
	}

	/*
	#navigation-overlay:after {
		content:"";
		width:100%;
		height:100%;
		border:2px solid #04295a;
		display:block;
	}*/

	#navigation ul {
		list-style:none;
	}

	#navigation li {
		margin:0;
	}

	#navigation li a {
		font:400 30px/30px "Druk Bold", sans-serif;
		letter-spacing:0.05em;
		color:#15161b;
		text-decoration:none;
		text-transform:uppercase;
		display:block;
		padding:20px 0;
	}

	.mobile-contact {
		position:absolute;
		bottom:80px;
		left:50px;
	}

	.mobile-contact a {
		font:400 30px/30px "Druk Bold", sans-serif;
		letter-spacing:0.05em;
		color:#15161b;
		text-decoration:none;
		text-transform:uppercase;
		display:block;
	}

	.accordion-header span {
		width:50px;
    	height:50px;
    	margin:-25px 0 0 0;
	}

	.accordion-header span svg {
		width:15px;
		height:15px;
		margin:-7px 0 0 -7px
	}

	.accordion-header {
		padding:25px 25px 25px 100px;
	}

	.accordion-content .content {
		padding:0 40px 40px 100px;
	}

	.page-template-about-us #quote .two-columns .col:nth-child(1),
	.page-template-our-services #quote .two-columns .col:nth-child(1),
	.page-template-careers #quote .two-columns .col:nth-child(1) {
		display:none;
	}

	.page-template-about-us #quote .container,
	.page-template-our-services #quote .container,
	.page-template-careers #quote .container {
		padding:100px 25px 60px 25px;
	}

	.page-template-about-us #quote .two-columns .col:nth-child(2),
	.page-template-our-services #quote .two-columns .col:nth-child(2),
	.page-template-careers #quote .two-columns .col:nth-child(2) {
		width:100%;
		padding:0;
	}
}


@media (max-width: 850px) {
	h3 {
		font-size:40px;
		line-height:45px;
	}

	p {
		font-size:18px;
		line-height:26px;
	}

	.list li {
		font-size:18px;
		line-height:26px;
	}

	.logo {
		width:159px;
	}

	nav {
		height:107px;
	}

	.menu-wrapper {
		top:23px;
	}

	.mobile-header {
		height:404px;
	}

	.home header .title {
		bottom:50px;
	}

	header h1 {
		font:400 90px/80px "Druk Heavy", sans-serif;
	}

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

	header .two-columns .col:nth-child(1) {
		padding:60px 25px;
	}

	.page-template-about-us #quote .container,
	.page-template-our-services #quote .container,
	.page-template-careers #quote .container {
		padding:80px 25px 40px 25px;
	}

	#latest-projects .three-columns {
		grid-template-columns:100%;
	}

	#latest-projects .three-columns .col {
		padding:0;
	}

	#category-nav {
		flex-wrap:wrap;
		border:0;
		padding-left:1px;
	}

	#category-nav li {
		border:2px solid #fff;
		margin-left:-1px;
	}

	#category-nav li:last-child {
		border-right:2px solid #fff;
	}

	#careers-form .container .content .intro {
		padding:50px 20px 40px 20px;
	}

	#careers-form .container .content .form {
		padding:30px 20px 40px 20px;
	}

	#contact-info .inner-three-columns .inner-col {
		width:50%;
	}

	footer .container {
		padding-top:40px;
	}


	footer .col:nth-child(1),
	footer .col:nth-child(2),
	footer .col:nth-child(3) {
		width:100%;
		text-align:center;
		margin:0 0 40px 0;
	}

	footer .col:nth-child(1) img,
	footer .col:nth-child(4) img {
		margin:0 auto;
	}
}

@media (max-width: 750px) {
	.home header {
		height:600px;
	}

	.home header h1 {
		font:400 100px/90px "Druk Heavy", sans-serif;
	}

	#intro h2 {
		font:400 80px/70px "Druk Heavy", sans-serif;
	}

}

@media (max-width: 650px) {
	#who-we-work-with .two-columns .col:nth-child(1) {
		padding:40px 30px;
	}

	#featured-projects .two-columns .col .photo {
		height:350px;
	}

	.accordion-header {
		padding:25px 20px 25px 70px;
	}

	.accordion-header span {
		width:40px;
		height:40px;
		top:30px;
		left:15px;
		margin:0;
	}

	.accordion-header span svg {
		width:12px;
		height:12px;
		margin:-6px 0 0 -6px;
	}

	.accordion-content .content {
		padding:0 20px 40px 20px;
	}

	.accordion h3 {
		font-size:30px;
		line-heighT:35px;
	}
}


@media (max-width: 550px) {
	.home header h1 {
		font:400 90px/80px "Druk Heavy", sans-serif;
	}

	#intro h2 {
		font:400 70px/70px "Druk Heavy", sans-serif;
	}

	#our-customers .col {
		width:100%;
		border-right:0 !important;
	}

	#our-customers .col:nth-child(3) {
		border-bottom:2px solid #04295a;
	}

	#contact-info .inner-three-columns .inner-col {
		width:100%;
	}

	#latest-projects .three-columns .col .photo {
		height:300px;
	}

	#featured-projects h3 {
		font-size:40px;
		line-height:40px;
	}
}


@media (max-width: 450px) {
	.logo {
		left:12px;
	}

	.container {
		padding:70px 20px;
	}

	.home header {
		height:500px;
	}

	.mobile-header {
		height:350px;
	}

	header .two-columns .col:nth-child(1) {
		padding:60px 20px;
	}

	header h1,
	.home header h1 {
		font-size:80px;
		line-height:70px;
	}

	#intro h2 {
		font:400 60px/60px "Druk Heavy", sans-serif;
	}

	#home-services .container {
		padding:10px;
	}

	#home-services .col {
		padding:15px;
	}

	#home-services h3 {
		font-size:50px;
		line-height:50px;
		padding-left:30px;
	}

	#who-we-work-with .container {
		padding-left:20px;
		padding-right:20px;
	}

	#who-we-work-with .two-columns .col:nth-child(1) {
		padding:30px 20px;
	}

	#careers-form .container {
		padding:10px;
	}

	#home-services .intro {
		padding:60px 20px 40px 20px;
	}

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

	.page-template-about-us #quote .container,
	.page-template-our-services #quote .container,
	.page-template-careers #quote .container {
		padding:70px 20px 40px 20px;
	}
}


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

	#navigation-overlay {
		width:100%;
	}
}


@media (max-width: 400px) {
	h2 {
		font-size:40px;
		line-height:40px;
	}

	header h1,
	.home header h1 {
		font-size:65px;
		line-height:60px;
	}

	#intro h2 {
		font-size:50px;
		line-height:50px;
	}

	#home-services .photo {
		height:270px;
	}

	#featured-projects .two-columns .col .photo {
		height:300px;
	}
}

@media (max-width: 350px) {
	header h1 {
		font-size:50px;
		line-height:50px;
	}

	.home header h1 {
		font-size:55px;
		line-height:55px;
	}
}


@media (max-height: 1100px) {
	.home header #video iframe {
		width:120vw;
		height:76.25vw;
		min-height:120vh;
	}
}