@media all and (max-width : 1200px) {

/*--------------------------------------------------------------
Layout
--------------------------------------------------------------*/

.wrapper {
	overflow-x: hidden;
}

.layout {
	width: 100%;
}

/*--------------------------------------------------------------
Content blue background
--------------------------------------------------------------*/

.content-blue-background {
	height: auto;
}

/*--------------------------------------------------------------
Grid
--------------------------------------------------------------*/

.quarter {
	width: calc(25% - 13px);
}

.third,
.footer-box,
.category-box {
	width: calc(25% - 11px);
}

/*--------------------------------------------------------------
Footer
--------------------------------------------------------------*/

.footer-column,
.footer-social {
	width: 100% !important;
}

a.credits {
	display: block;
	position: relative;
}

}

@media all and (max-width : 1000px) {

/*--------------------------------------------------------------
Scalable text
--------------------------------------------------------------*/

.header-text-full {
	margin-top: -0px;
}

.home .header-text-full {
	margin-top: 0px;
}

.box-content.header-text-content > .header-text > p {
	padding-left: 0%;
}

.box-content.header-text-content > .header-text > p::first-line {
	font-family:"DIN Next W01 Bold";
	line-height: calc(5.8vw - 1px) !important;
}

.box-content.header-text-content > .header-text > p {
	font-size: calc(5.8vw + 1px);
	line-height: calc(5.6vw + 4px) !important;
}


/*--------------------------------------------------------------
Menu
--------------------------------------------------------------*/

.fixed {
	position: fixed;
}

.menu-background {
	height: auto !important;
}

.menu-background-top,
.menu-background-bottom {
	display: none;
}

.menu {
	background: #ffffff;
	margin-top: 40px;
	padding-left: 0%;
	width: 100%;
}

.menu-columns {
	margin-left: -12px;
	padding-left: 0px;
}

.menu-column {
	padding-left: 0px;
	width: 100%;
}

.menu-column:nth-of-type(2),
.menu-column:nth-of-type(3) {
	margin-top: -40px;
}

.menu-main {
	height: auto !important;
}

.menu li {
	width: 100%;
}

.menu-box {
	background: #ffffff;
}

/*--------------------------------------------------------------
Menu open/close icons
--------------------------------------------------------------*/

.menu-toggle {
	float: left;
	height: 26px;
	width: 18px;
}

.menu li.menu-item-has-children {
	cursor: pointer;
}

.menu li.menu-item-has-children > a {
	clear: both;
	display: block !important;
	float: left;
	width: auto;
}

.menu-toggle li:first-child,
.menu-toggle li:nth-child(2) {
	background-color: #006eb6;
	content: " ";
	display: block;
	float: right;
	height: 1px;
	width: 13px;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.menu-toggle li:first-child {
	margin: 2px 0px 0px -18px;
}

.menu-toggle li:nth-child(2) {
	margin: 22px 0px 0px 4px;
}

.menu-toggle li:first-child {
	-webkit-transform: translateY(10px) rotate(-90deg);
	-ms-transform: translateY(10px) rotate(-90deg);
	-o-transform: translateY(10px) rotate(-90deg);
	transform: translateY(10px) rotate(-90deg);
}

.menu-toggle li:nth-child(2) {
	-webkit-transform: > translateY(-10px) rotate(0deg);
	-ms-transform: translateY(-10px) rotate(0deg);
	-o-transform: translateY(-10px) rotate(0deg);
	transform: translateY(-10px) rotate(0deg);
}

.menu-toggle.active-menu li:first-child {
	-webkit-transform: translateY(10px) rotate(45deg);
	-ms-transform: translateY(10px) rotate(45deg);
	-o-transform: translateY(10px) rotate(45deg);
	transform: translateY(10px) rotate(45deg);
}

.menu-toggle.active-menu li:nth-child(2) {
	-webkit-transform: translateY(-10px) rotate(-45deg);
	-ms-transform: translateY(-10px) rotate(-45deg);
	-o-transform: translateY(-10px) rotate(-45deg);
	transform: translateY(-10px) rotate(-45deg);
}

/*--------------------------------------------------------------
Sub Menu
--------------------------------------------------------------*/

.sub-menu {
	display: none;
}

/*--------------------------------------------------------------
Featured menu stories
--------------------------------------------------------------*/

.menu-featured li,
.related-grid-bottom li {
	margin-right: 0px;
	width: calc(100% - 4px);
}

/*--------------------------------------------------------------
Menu search
--------------------------------------------------------------*/

.menu-search,
.menu-search-form {
	background-size: 20px auto !important;
	height: 22px !important;
	right: 60px;
	top: 20px;
	width: 20px !important;
}

.menu-search {
	background: url(../imgs/search-menu-thin.png) !important;
	background-position: top 0px right 0px !important;
	background-repeat: no-repeat !important;
	background-size: 17px auto !important;
	cursor: pointer;
	height: 17px !important;
	right: 60px;
	top: 24px;
	position: fixed;
	width: 20px !important;
	z-index: 110 !important;
	-webkit-transition: all 0.3s ease-in-out;
	-o-transition: all 0.3s ease-in-out;
	transition: all 0.3s ease-in-out;
}

.menu-search-form {
	left: 6px;
	top: 60px;
	width: calc(100vw - 12px) !important;
}

/*--------------------------------------------------------------
Projects
--------------------------------------------------------------*/

.project-details {
	left: 0px;
	margin-bottom: 66px;
	position: relative !important;
	top: 21px;
}

.project-details br,
.single .additional-content h1 br {
	display: block !important;
}

h1,
.single .additional-content h1,
.archive-main h1,
.archive-main h1 a,
.content-contact-section h2,
.contact-right p {
	font-size: 34px !important;
	letter-spacing: -0.25px !important;
	line-height: 36px !important;
}

.single .additional-content h2,
.content-contact-section h2,
.archive-entry h2 {
	margin-bottom: 7px;
}

.contact-left span,
span.careers {
	margin-bottom: 0px !important;
}

.contact-phone {
	margin-top: 0px !important;
}

.single .additional-content h2 {
	font-size: 24px !important;
	letter-spacing: -0.25px !important;
	line-height: 34px !important;
}

.single .additional-content p,
.page-template-grid .additional-content p,
.archive-main p,
.contact-left span {
	font-size: 16px;
	line-height: 21px !important;
	margin-bottom: 7px;
	width: 100%;
}

.project-details,
.two-columns img,
.two-columns video,
.image-right.one-column .image-caption,
.image-left.one-column .image-caption,
.one-column img,
.one-column video,
.image-right.two-columns .image-caption,
.image-left.two-columns .image-caption,
.image-right.column-middle-right .image-caption,
.image-left.column-middle-left .image-caption {
	width: 100%;
}

.image-right.column-middle-right img,
.image-right.column-middle-right video {
	margin-right: 0px;
}

.image-left.column-middle-left img,
.image-left.column-middle-left video {
	margin-left: 0px;
}

.image-left.one-column .image-caption span,
.image-left.two-columns .image-caption span,
.image-right.one-column .image-caption span,
.image-right.two-columns .image-caption span {
	float: left;
	margin: 22px 0px 22px 0px;
}

.page-template-grid .image-left.two-columns .image-caption span,
.page-template-grid .image-right.two-columns .image-caption span,
.page-template-grid .image-right.one-column .image-caption span,
.page-template-grid .image-left.one-column .image-caption span,
.page-template-grid .image-right.column-middle-right .image-caption span,
.page-template-grid .image-left.column-middle-left .image-caption span {
	float: left;
	margin: 22px 0px 22px 0px;
}

.image-caption span {
	padding: 0px 47px 0px 47px;
	position: relative !important;
	width: calc(100% - 94px);
}

.image-caption span p {
	max-width: 100% !important;
}

.additional-work {
	padding: 0px 13px 0px 13px;
	width: calc(100% - 26px);
}

.additional-work.additional-works-secondary {
	margin-top: 0px;
}

.additional-work a,
.additional-work p,
.additional-work h4,
.additional-work .expanded {
	float: left;
	margin: 0px 0px 0px 0px !important;
	width: 100%;
}

.additional-work .expanded {
	margin-top: 15px !important;
}

.image-section-header,
.image-section-subhead,
.category-section-header {
	padding-left: 10px;
	width: calc(100% - 10px);
}

.category-section-header { 
	color: #ffffff;
	font-family: "DIN Next LT W01 Regular" !important;
	left: 0px;
	margin-top: -47px !important;
	padding: 12px 12px 12px 12px !important;
	position: absolute;
	top: 0px;
	text-transform: uppercase;
}

.category-overlay-text {
	font-family: "DIN Next LT W01 Medium" !important;
	font-size: 20px !important;
	letter-spacing: 0.5 !important;
	line-height: 20px;
}

.category-overlay-text,
.category-subhead-text {
	float: left;
	width: 100%;
}

.image-section-header {
	margin-top: 80px;
}

/*--------------------------------------------------------------
Videos play button
--------------------------------------------------------------*/

.play-button {
	left: 50%;
}

.image-right.two-columns .play-button,
.image-left.two-columns .play-button,
.image-right.column-middle-right .play-button,
.image-right.one-column .play-button,
.image-left.one-column .play-button,
.image-left.column-middle-left .play-button,
.full-image-video .play-button,
.column-middle-left.image-left.one-column .play-button {
	width: 48px !important;
}

.column-middle-right.image-right.one-column .play-button,
.full-image-video .play-button {
	left: 50% !important;
    transform: translateX(-50%);
    -webkit-transform: translateX(-50%);
    -ms-transform: translateX(-50%);
}

.column-middle-left.image-left.one-column .play-button {
	left: calc(-33% - 6px) !important;
	width: 100% !important;
}

}

@media all and (max-width : 720px) {

/*--------------------------------------------------------------
Header
--------------------------------------------------------------*/

header {
	float: left;
	margin: 0px 0px 60px 0px;
	width: 100%;
}

.header-background {
	height: 46px;
	padding-top: 24px;
}

.logo {
	margin-left: 12px;
	margin-top: 23px;
	width: 80px;
}

.logo img {
	left: 0px;
	position: relative;
}

.menu-box .logo {
	display: none !important;
	margin-left: 12px;
}

.menu-box .logo img {
	left: 0px;
	position: absolute;
	top: 23px;
	z-index: 30;
}

/*--------------------------------------------------------------
Hamburger icon
--------------------------------------------------------------*/

.menu-icon {
	margin: 18px 16px 0px 0px;
}

.menu-main .menu-icon {
	margin-top: 20px;
}

.bio-close {
	right: 18px;
	top: 41px !important;
}

.hamburger .line,
.bio-close .line,
.overlay-close span {
	height: 1px;
	width: 32px;
}

.toggle-additional-content .line {
	width: 24px;
}

.hamburger .line,
.overlay-close span {
	margin: 6px auto;
}

.bio-close .line {
	margin: 7.5px auto;
}

#hamburger.is-active .line:nth-child(1),
.overlay-close span:nth-of-type(1),
.bio-close .line:nth-child(2) {
	-webkit-transform: translateY(7px) rotate(45deg);
	-ms-transform: translateY(7px) rotate(45deg);
	-o-transform: translateY(7px) rotate(45deg);
	transform: translateY(7px) rotate(45deg);
}

#hamburger.is-active .line:nth-child(3),
.bio-close .line:nth-child(3) {
	-webkit-transform: translateY(-7px) rotate(-45deg) !important;
	-ms-transform: translateY(-7px) rotate(-45deg) !important;
	-o-transform: translateY(-7px) rotate(-45deg) !important;
	transform: translateY(-7px) rotate(-45deg) !important;
}

/*--------------------------------------------------------------
Sub Menu
--------------------------------------------------------------*/

ul.sub-menu {
	margin: 0px 0px 3px 0px;
}

/*--------------------------------------------------------------
Featured menu stories
--------------------------------------------------------------*/

.menu-featured h3,
.related-grid-bottom h3 {
	font-size: 20px;
	line-height: 20px;
}

.menu-featured a,
.related-grid-bottom a {
	font-size: 13px;
	line-height: 13px;
}

.related-grid-bottom li {
	margin-bottom: 39px;
}

/*--------------------------------------------------------------
Flexslider
--------------------------------------------------------------*/

.toggle-additional-content {
	bottom: 39px;
	font-size: 48px;
	right: 26px;
}

.flex-direction-nav a {
	bottom: 50px !important;
}

.flex-direction-nav a {
	background-size: 11px auto !important;
}

.flex-direction-nav .flex-prev {
	right: 38px !important;
}

.flex-direction-nav .flex-next {
	right: 16px !important;
}

.additional-content img.size-large {
	width: 100%;
}

.additional-content {
	font-size: 18px;
	padding: 36px 9.3% 14px 9.3%;
	line-height: 23px;
	width: calc(100% - 18.6% - 4px);
}

.additional-content br {
	display: none;
}

.box-content.header-text-content > .header-text > p br {
	display: block !important;
}

/*--------------------------------------------------------------
Projects
--------------------------------------------------------------*/

.content-section,
.content-main-section .content-section {
	padding: 0px 13px 0px 13px;
	width: calc(100% - 26px);
}

.content-top-section {
	margin-top: 0px !important;
}

.content-top-section h1,
.content-top-section h2 {
	max-width: 100%;
}

/*--------------------------------------------------------------
Contact
--------------------------------------------------------------*/

.contact-left,
.contact-right {
	width: 100%;
}

.contact-right {
	margin-top: 80px;
}

/*--------------------------------------------------------------
Grid
--------------------------------------------------------------*/

.quarter,
.footer-content-box,
.category-content-box,
.category-content-link:nth-child(3n+3) .category-content-box {
	width: calc(100% - 8px);
}

.third,
.footer-box,
.category-box {
	width: calc(100% - 8px);
}

/*--------------------------------------------------------------
People
--------------------------------------------------------------*/

.team-grid li {
	display: block;
	margin: 0px 0px 40px 0px;
	width: calc(100% - 6px);
}

.team-grid li:nth-child(4n+1) .grid-bio,
.team-grid li:nth-child(4n+2) .grid-bio,
.team-grid li:nth-child(4n+3) .grid-bio,
.team-grid li:nth-child(4n+4) .grid-bio {
	margin-left: 0px;
}

/*--------------------------------------------------------------
People bios
--------------------------------------------------------------*/

.bio-close {
	top: -6px;
}

.grid-bio-content {
	padding: 48px 4px 48px 4px;
}

.bio-left,
.bio-right {
	width: 100%;
}

.bio-right {
	padding-left: 0px;
}

.title-credentials {
	line-height: 25px;
}

/*--------------------------------------------------------------
People filter
--------------------------------------------------------------*/

.people-filter {
	margin-left: 3px;
	width: calc(100% - 3px);
}

.people-filter span {
	margin: 0px 0px 5px 0px;
}

.people-filter-list {
	padding: 0px 0px 11px 0px;
	width: 100%;
}

/*--------------------------------------------------------------
Archive
--------------------------------------------------------------*/

.archive-section {
	padding: 56px 13px 0px 13px;
	width: calc(100% - 26px);
}

.archive-main {
	padding-right: 0px;
	width: 100%;
}

.sidebar {
	width: 100%;
}

/*--------------------------------------------------------------
Instant search results
--------------------------------------------------------------*/

.instant-search-results {
	padding: 100px 0px 48px 4px;
}

/*--------------------------------------------------------------
Suggested search terms
--------------------------------------------------------------*/

.search-terms {
	font-size: 18px;
	padding: 100px 4px 48px 4px;
	line-height: 23px;
	width: calc(100% - 8px);
}

.search-terms-content {
	float: left;
	left: 6px !important;
	margin-left: 0px;
	position: relative;
	right: 0px !important;
	width: 100%;
}

/*--------------------------------------------------------------
General expanded content
--------------------------------------------------------------*/

.page-template-general-expanded {
	max-width: 100vw;
	overflow-x:	hidden;
	width: 100vw;
}

.general-content .wp-caption-text {
	margin-left: 46px;
	margin-top: 0px;
	position: relative;
	width: calc(100% - 40px);
}

.general-content blockquote p {
	font-size: 20px;
	line-height: 25px;
	margin-bottom: 16px;
}

.general-content h3.expanded.open-close,
h3.expanded.open-close {
	font-size: 16px !important;
	line-height: 21px !important;
}

.expanded::before {
	margin: 1px 0px 0px -18px;
}

.expanded::after {
	margin: 21px 0px 0px 4px;
}

.additional-work .expanded {
	max-width: calc(100% - 40px) !important;
	position: relative;
}

.additional-work .expanded::before,
.additional-work .expanded::after {
	position: absolute;
	right: -18px;
	top: 0px;
}

.additional-work .expanded::after {
	margin: 21px 0px 0px 4px;
}

.general-content .expanded::before {
	margin: 0px 0px 0px -18px;
}

.general-content .expanded::after {
	margin: 20px 0px 0px 4px;
}

.general-content h3 {
	font-size: 16px !important;
	line-height: 21px !important;
	margin-bottom: 7px !important;
}

}

@media all and (max-width : 340px) {

/*--------------------------------------------------------------
Menu
--------------------------------------------------------------*/

.search-form {
	width: 75%;
}

}