/* -- HTML -- */

html {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	-webkit-text-size-adjust: 100%;
	-ms-text-size-adjust: 100%;
}

*, *:before, *:after {
	-webkit-box-sizing: inherit;
	-moz-box-sizing: inherit;
	box-sizing: inherit;
}

body {
	text-rendering: optimizeLegibility;
	/*-webkit-font-kerning: normal;
	font-kerning: normal;
	font-feature-settings: "kern";
	-webkit-font-feature-settings: "kern";
	-moz-font-feature-settings: "kern";
	-moz-font-feature-settings: "kern=1";*/
	background: rgb(255,255,255);
	font-family: "SuisseIntl-Light", sans-serif;
}

h1, h2, h3, h4, h5, h6, p, a, ul, ul li, ul li a {
	text-align: left;
	overflow: visible;
}

h1 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 300;
	font-size: 2.5rem;
	line-height: 1.0;
}

h2 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 300;
	font-size: 2.25rem;
	line-height: 1.0;
}

h3 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 300;
	font-size: 2.125rem;
	line-height: 1.0;
}

h4 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 300;
	font-size: 1.5rem;
	line-height: 1.45;
}

h5 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 400;
	font-size: 1.25rem;
	line-height: 1.45;
}

h6 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 400;
	font-size: 1rem;
	line-height: 1.125;
	letter-spacing: 0.03rem;
}

p {
	font-size: 1rem;
	line-height: 1.45;
	margin-bottom: 1.45rem;
}

em {
	font-family: "SuisseIntl-LightItalic", sans-serif;
}

a {
	font-size: 1rem;
	font-weight: normal;
	line-height: 1;
	color: rgb(0,0,0) !important;
	-webkit transition: all 0.75s ease;
    transition: all 0.25s ease;
	
}

a:hover {
	color: #b8372d !important;
}

p a {
	font-size: 1rem;
	line-height: 1.45;
	color: rgb(0,0,0) !important;
	-webkit transition: all 0.75s ease;
    transition: all 0.25s ease;
}

p a:hover {
	color: #b8372d !important;
}

strong {
	font-family: "SuisseIntl-Medium", sans-serif;
}

p.semi-bold {
	font-family: "SuisseIntl-SemiBold", sans-serif;
}

img {
	width: 100%;
}

p.statement-1 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 200;
	line-height: 1.125;
	font-size: 2rem;
	margin-top: 2rem;
	/*letter-spacing: 0.03rem;*/
}

p.statement-2 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 200;
	line-height: 1.35;
	font-size: 1.25rem;
	letter-spacing: 0.03rem;
}

p.statement-3 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 200;
	line-height: 1.45;
	font-size: 1rem;
	letter-spacing: 0.03rem;
}

p.statement-4 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 300;
	line-height: 1.45;
	font-size: 1rem;
}

p.statement-1.sans-bold {
	font-family: "SuisseIntl-Light", sans-serif;
	font-size: 1.875rem;
}

p.statement-2.sans-bold {
	font-family: "SuisseIntl-Light", sans-serif;
	font-size: 1rem;
}

p.statement-3.sans-bold {
	font-family: "SuisseIntl-Light", sans-serif;
	font-size: 0.875rem;
}

p.statement-4.sans-bold {
	font-family: "SuisseIntl-Light", sans-serif;
	font-size: 0.875rem;
}

p.no-margin {
	margin-bottom: 0;
}

p.indent {
	text-indent: 3rem;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	h1 {
		font-size: 3rem;
	}

	h2 {
		font-size: 2.5rem;
	}

	h3 {
		font-size: 2rem;
	}

	h4 {
		font-size: 1.5rem;
	}

	h5 {
		font-size: 1.25rem;
	}

	h6 {
		font-size: 1rem;
	}
	
	p.statement-1 {
		font-size: 1.75rem;
		margin-top: 4rem;
	}
	
	p.statement-2 {
		font-size: 1.25rem;
	}
	
	p.statement-3 {
		font-size: 1.125rem;
	}
	
	p.statement-4 {
		font-size: 1rem;
	}
	
	p.statement-1.sans-bold {
		font-size: 1.625rem;
	}

	p.statement-2.sans-bold {
		font-size: 1.125rem;
	}

	p.statement-3.sans-bold {
		font-size: 1rem;
	}

	p.statement-4.sans-bold {
		font-size: 0.875rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	h1 {
		font-size: 4rem;
	}

	h2 {
		font-size: 2.5rem;
	}

	h3 {
		font-size: 2rem;
	}

	h4 {
		font-size: 1.5rem;
	}

	h5 {
		font-size: 1.25rem;
	}

	h6 {
		font-size: 1rem;
	}
	
	p.statement-1 {
		font-size: 2rem;
		margin-top: 6rem;
	}
	
	p.statement-2 {
		font-size: 1.5rem;
	}
	
	p.statement-3 {
		font-size: 1.25rem;
	}
	
	p.statement-4 {
		font-size: 1rem;
	}
	
	p.statement-1.sans-bold {
		font-size: 1.875rem;
	}

	p.statement-2.sans-bold {
		font-size: 1.375rem;
	}

	p.statement-3.sans-bold {
		font-size: 1.125rem;
	}

	p.statement-4.sans-bold {
		font-size: 0.875rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	h1 {
		font-size: 5rem;
	}

	h2 {
		font-size: 3.5rem;
	}

	h3 {
		font-size: 3rem;
	}

	h4 {
		font-size: 2rem;
	}

	h5 {
		font-size: 1.5rem;
	}

	h6 {
		font-size: 1.25rem;
	}
	
	p {
		font-size: 1.125rem;
	}
	
	p a {
		font-size: 1.125rem;
	}
	
	p.statement-1 {
		font-size: 2.5rem;
		margin-top: 8rem;
	}
	
	p.statement-2 {
		font-size: 1.5rem;
	}
	
	p.statement-3 {
		font-size: 1.375rem;
	}
	
	p.statement-4 {
		font-size: 1rem;
	}
	
	p.statement-1.sans-bold {
		font-size: 2.375rem;
	}

	p.statement-2.sans-bold {
		font-size: 1.375rem;
	}

	p.statement-3.sans-bold {
		font-size: 1.25rem;
	}

	p.statement-4.sans-bold {
		font-size: 0.875rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	h1 {
		font-size: 5.5rem;
	}

	h2 {
		font-size: 4rem;
	}

	h3 {
		font-size: 3rem;
	}

	h4 {
		font-size: 2rem;
	}

	h5 {
		font-size: 1.5rem;
	}

	h6 {
		font-size: 1.25rem;
	}
	
	p {
		font-size: 1.125rem;
	}
	
	p a {
		font-size: 1.125rem;
	}
	
	p.statement-1 {
		font-size: 3rem;
		margin-top: 9rem;
	}
	
	p.statement-2 {
		font-size: 1.875rem;
	}
	
	p.statement-3 {
		font-size: 1.5rem;
	}
	
	p.statement-4 {
		font-size: 1rem;
	}
	
	p.statement-1.sans-bold {
		font-size: 2.875rem;
	}

	p.statement-2.sans-bold {
		font-size: 1.75rem;
	}

	p.statement-3.sans-bold {
		font-size: 1.375rem;
	}

	p.statement-4.sans-bold {
		font-size: 0.875rem;
	}
	
}













/* -- HEADER -- */

.section.header {
	position: relative;
	z-index: 100000;
	top: 0;
	left: 0;
	height: 4rem;
	/*background-color: rgba(255,255,255,1.0);*/
	background-color: #012955;
	/*border-bottom: 1px solid rgba(0,0,0,0.25);*/
}

.module.header {
	position: relative;
	height: 4rem;
	overflow: visible;
}

/* -- LOGO -- */

a.logo {
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	display: inline-block;
	float: left;
	width: 45%;
	height: 5rem;
	font-size: 0.01rem;
	text-indent: -200%;
	background: transparent url('../img/logo/athena_logo_white_trimmed.svg') no-repeat left center;
	cursor: pointer;
}


@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.section.header {
		height: 5rem;
	}
	
	.module.header {
		height: 5rem;
	}
	
	a.logo {
		/*width: 12rem;
		height: 1.375rem;*/
		width: 20rem;
		height: 4rem;
		background: transparent url('../img/logo/athena_logo_white_trimmed.svg') no-repeat left center;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.section.header {
		height: 8rem;
	}
	
	.module.header {
		height: 8rem;
	}
	
	a.logo {
		/*width: 12rem;
		height: 1.375rem;*/
		width: 20rem;
		height: 7rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1440px -- */
	
	.section.header {
		height: 8rem;
	}
	
	.module.header {
		height: 8rem;
	}
	
	a.logo {
		/*width: 12rem;
		height: 1.375rem;*/
		width: 20rem;
		height: 7rem;
	}
}

/* -- NAVIGATION -- */

.c-hamburger {
	float: right;
	position: relative;
	top: 50%;
	right: 0.5rem;
	transform: perspective(1px) translateY(-50%);
	display: inline-block;
	z-index: 20003;
	width: 2rem;
	height: 2rem;
	font-size: 0;
	text-indent: -9999px;
	appearance: none;
	box-shadow: none;
	border-radius: none;
	border: none;
	cursor: pointer;
	overflow: hidden;
}

.c-hamburger:focus {
	outline: none;
}

.c-hamburger span {
	display: block;
	position: absolute;
	top: calc(1rem - 1px);
	left: 0;
	right: 0;
	height: 1px;
	background: rgb(255,255,255);
}

.c-hamburger span::before,
.c-hamburger span::after {
	position: absolute;
	display: block;
	left: 0;
	width: 100%;
	height: 1px;
	background: rgb(255,255,255);
	content: "";
}

.c-hamburger span::before {
  top: -0.5rem;
}

.c-hamburger span::after {
  bottom: -0.5rem;
}

.c-hamburger--htx {
	background-color: transparent;
}

.c-hamburger--htx span {
  transition: background 0s 0.3s;
}

.c-hamburger--htx span::before,
.c-hamburger--htx span::after {
  transition-duration: 0.3s, 0.3s;
  transition-delay: 0.3s, 0s;
}

.c-hamburger--htx span::before {
  transition-property: top, transform;
}

.c-hamburger--htx span::after {
  transition-property: bottom, transform;
}

/* active state, i.e. menu open */
.c-hamburger--htx.is-active {
  background-color: transparent;
}

.c-hamburger--htx.is-active span {
  background: none;
}

.c-hamburger--htx.is-active span::before {
  top: 0;
  transform: rotate(45deg);
}

.c-hamburger--htx.is-active span::after {
  bottom: 0;
  transform: rotate(-45deg);
}

.c-hamburger--htx.is-active span::before,
.c-hamburger--htx.is-active span::after {
  transition-delay: 0s, 0.3s;
}

.menu {
	position: absolute;
	z-index: 90000;
	top: -100vh;
	left: 0;
	width: 100vw;
	height: 100vh;
	padding: 4rem 2rem 4rem 2rem;
	background-color: #012955;
	-webkit transition: all 0.5s ease;
    transition: all 0.5s ease;
	text-align: center;
}

.menu.menu-open {
	top: 0;
}

ul.menu-navigation {
	display: inline-block;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	padding-bottom:  2rem;
}

ul.menu-navigation li {
	display: block;
	padding: 0.75rem 0;
	text-align: center;
}

ul.menu-navigation li a {
	display: inline-block;
	font-family: "SuisseIntl-Light";
	font-style: normal;
	font-weight: 300;
	font-size: 1.5rem;
	letter-spacing: 0.03rem;
	color: rgb(255,255,255) !important;;
	/*text-transform: uppercase;*/
	white-space: nowrap;
	-webkit transition: all 0.35s ease;
    transition: all 0.35s ease;
}

ul.menu-navigation li a:hover, ul.menu-navigation li a.active {
	color: #f7941d !important;
}

ul.menu-navigation li a.login {
	color: #6d7f97 !important;
}

ul.navigation {
	display: none;
	position: relative;
	top: 50%;
	transform: translateY(-50%);
	float: right;
	padding: 0.5rem 0 0 0;
	width: auto;
	height: auto;
	margin-top: 0;
}

ul.navigation li {
	display: inline-block;
	float: left;
	margin-left: 1rem;
	text-align: left;
}

ul.navigation li a {
	display: inline-block;
	font-family: "SuisseIntl-Light";
	font-style: normal;
	font-weight: 300;
	font-size: 0.875rem;
	color: rgb(255,255,255) !important;;
	white-space: nowrap;
	-webkit transition: all 0.35s ease;
    transition: all 0.35s ease;
}

ul.navigation li a:hover, ul.navigation li a.active {
	color: #f7941d !important;
}

ul.navigation li a.login {
	color: #778ba6 !important;
}

ul.navigation li a.login:hover {
	color: #f7941d !important;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
		
	ul.navigation {
		display: none;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.c-hamburger, .menu {
		display: none;
	}
	
	ul.navigation {
		display: inline-block;
		position: relative;
		top: 50%;
		transform: translateY(-50%);
		float: right;
		padding: 0.5rem 0 0 0;
		width: auto;
		height: auto;
		margin-top: 1.73rem;
	}
	
	ul.navigation li {
		display: inline-block;
		float: left;
		margin-left: 1rem;
		text-align: left;
	}

	ul.navigation li a {
		display: inline-block;
		font-family: "SuisseIntl-Light";
		font-style: normal;
		font-weight: 300;
		font-size: 1rem;
		color: rgb(255,255,255) !important;;
		white-space: nowrap;
		-webkit transition: all 0.35s ease;
	    transition: all 0.35s ease;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.c-hamburger {
		display: none;
	}
	
	ul.navigation {
		display: inline-block;
		margin-top: 1.73rem;
	}
	
	ul.navigation li {
		margin-left: 1rem;
	}

	ul.navigation li a {
		font-size: 1.125rem;
	}
}



















/* -- CALLS TO ACTION -- */

a.default-btn, a.overlay-btn {
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	display: inline-block;
	font-family: "SuisseIntl-Semibold", sans-serif;
	font-size: 0.875rem;
	letter-spacing: 0.07rem;
	padding: 0.5rem 1rem 0.5rem 1rem;
	margin-top: 0;
	cursor: pointer;
	-webkit transition: all 0.75s ease;
    transition: all 0.25s ease;
}

a.default-btn {
	color: rgb(0,0,0) !important;
	background-color: transparent;
	border: 1px solid rgb(0,0,0);
	cursor: pointer;
}

a.default-btn:hover {
	color: rgb(255,255,255) !important;
	background-color: rgb(0,0,0);
}

a.overlay-btn {
	color: rgb(255,255,255) !important;
	background-color: transparent;
	border: 1px solid rgb(255,255,255);
	cursor: pointer;
}

a.overlay-btn:hover {
	color: rgb(0,0,0) !important;
	background-color: rgb(255,255,255);
}

a.default-btn.large, a.overlay-btn.large {
	font-size: 1.125rem;
	padding: 1rem 1.875rem 1rem 1.875rem;
	margin-top: 1rem;
}


@media screen and (min-width: 768px) {  /* -- 768px -- */
		
	a.default-btn, a.overlay-btn {
		font-size: 0.875rem;
		padding: 0.75rem 1.5rem 0.75rem 1.5rem;
		margin-top: 0
	}
	
	a.default-btn, a.overlay-btn {
		margin-top: 0.625rem;
	}
	
	a.default-btn.large, a.overlay-btn.large {
		font-size: 1.125rem;
		margin-top: 1.5rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	a.default-btn, a.overlay-btn {
		font-size: 0.875rem;
		padding: 0.75rem 1.5rem 0.75rem 1.5rem;
		margin-top: 3rem;
	}
	
	a.default-btn, a.overlay-btn {
		margin-top: 0.625rem;
	}
	
	a.default-btn.large, a.overlay-btn.large {
		font-size: 1.125rem;
		margin-top: 2rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	a.default-btn, a.overlay-btn {
		font-size: 1rem;
		padding: 0.75rem 1.5rem 0.75rem 1.5rem;
		margin-top: 3rem;
	}
	
	a.default-btn, a.overlay-btn {
		margin-top: 0.625rem;
	}
	
	a.default-btn.large, a.overlay-btn.large {
		font-size: 1rem;
		margin-top: 3rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	a.default-btn, a.overlay-btn {
		font-size: 1rem;
		padding: 0.875rem 2rem 0.875rem 2rem;
		margin-top: 0
	}
	
	a.default-btn, a.overlay-btn {
		margin-top: 1rem;
	}
	
	a.default-btn.large, a.overlay-btn.large {
		font-size: 1rem;
		margin-top: 3rem;
	}
	
}







/* -- FONTS + COLORS -- */

.serif {
	font-family: "Chronicle Display A", "Chronicle Display B";
}

.section-title h1, .section-title h2, .section-title h3, .section-title h4, .section-title h5, .section-title h6 {
	font-family: "Ringside Extra Wide A", "Ringside Extra Wide B";
	font-style: normal;
	font-weight: 200;
	/*color: rgb(102,204,0);*/
}

.white {
	color: rgb(255,255,255) !important;
}

.red {
	color: rgb(255,0,0);
}

.f-suisse-medium {
	font-family: "SuisseIntl-Medium", sans-serif;
}

.f-suisse-semibold {
	font-family: "SuisseIntl-Semibold", sans-serif;
}
.c-navy {					/* BRAND NAVY */
	color: #031f4b;
}

.c-blue {					/* BRAND BLUE */
	color: #3eb6e3;
}

.c-0 { 					/* BRAND BLUE */
	color: #3eb6e3;
}

.c-1 { 					/* WINE */
	color: #6a2c70;
	color: #b8372d;
	color: #9a413b;
	color: #b8372d;
	color: #04396c;
}

.c-2 { 					/* ORANGE */
	color: #b83b5e;
	color: #d26f1c;
}

.c-3 { 					/* SKY BLUE */
	color: #f08a5d;
	color: #85a7d9;
}

.c-4 { 					/* BLUE GREY */
	color: #bfa126;
	color: #a1b4b3;
}

.c-5 { 					/* DARK PURPLE */
	color: #269dbf;
	color: #494777;
}

.c-6 { 					/* KHAKI */
	color: #63a668;
	color: #c8c292;
}

.c-7 { 					/* WHEAT */
	color: #63a668;
	color: #ce9f51;
}

.c-8 { 					/* GREY */
	color: #63a668;
	color: #83847f;
}

.c-9 { 					/* CHOCOLATE */
	color: #63a668;
	color: #493927;
}

.c-10 { 				/* TURQUISE */
	color: #63a668;
	color: #00a59e;
}

.bc-1 {
	background-color: #b8372d;
	background-color: #9a413b;
	background-color: #b8372d;
	background-color: #04396c;
}

.bc-2 {
	background-color: #d26f1c;
	background-color: #035b96;
}

.bc-3 {
	background-color: #85a7d9;
	background-color: #031f4b;
}

.bc-4 {
	background-color: #a1b4b3;
	background-color: #6497b1;
}

.bc-5 {
	background-color: #494777;
	background-color: #04556c;
}

.bc-6 {
	background-color: #c8c292;
	background-color: #03364b;
}

.bc-7 {
	background-color: #ce9f51;
}

.bc-8 {
	background-color: #83847f;
}

.bc-9 {
	background-color: #493927;
}

.bc-10 {
	background-color: #d0dadd;
}

.bc-11 {
	background-color: #012955;
}

.bc-grey {
	background-color: rgb(235,234,230);
}

.bc-navy {
	background-color: #031f4b;
}

.bc-blue {
	background-color: #3eb6e3;
}

.j-left {
	text-align: left;
}

.bg-icon {
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: 25%;
	-moz-background-size: 75%;
	-o-background-size: 50%;
	background-size: 25%;
}






/* -- ELEMENTS -- */

.rule {
	display: inline-block;
	width: 6rem;
	height: 0.25rem;
	background-color: #f7941d;
	margin-bottom: 1rem;
}

.portrait img {
	width: 100%;
}

.quote-container {
	padding: 10%;
}

.quote-container p.quote {
	text-align: center;
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: italic;
	font-weight: 200;
	font-size: 1.625rem;
	line-height: 1.4;
	color: rgba(0,0,0,0.375);
	margin-bottom: 2rem;
}

.quote-container h6.eyebrow, .quote-container h4 {
	text-align: center;
	color: rgba(0,0,0,0.375);
}

.opening-statement, .module.first {
	margin-top: 4rem;
	margin-bottom: 4rem;
}

.statement {
	margin-top: 4rem;
	margin-bottom: 3rem;
}

.statement p {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-weight: 300;
	font-size: 1.5rem;
}
	


h6.eyebrow {
	font-family: "SuisseIntl-Semibold", sans-serif;
	font-size: 0.75rem;
	text-transform: uppercase;
	letter-spacing: 0.125rem;
}

h6.eyebrow.title {
	font-size: 0.75rem;
	line-height: 1.25;
	margin-bottom: 0;
}

h1.centered, h2.centered, h3.centered, h4.centered, h5.centered, h6.centered, p.centered {
	text-align: center;
}

.section-title {
	line-height: 1.1;
	margin-bottom: 1rem;
}

.m-1 {
	margin-bottom: 1rem;
}

.m-2 {
	margin-bottom: 2rem;
}

.m-3 {
	margin-bottom: 3rem;
}

.m-4 {
	margin-bottom: 1.375rem;
}

.contact {
	margin-bottom: 2rem;
}

.contact .phone-icon {
	display: inline-block;
	width: 0.875rem;
	margin-right: 0.375rem;
}

.contact .phone-icon svg {
	fill: #000;
	-webkit transition: all 0.25s ease;
    transition: all 0.25s ease;
}

.contact:hover .phone-icon svg {
	fill: #f7941d;
}

.contact a.eml {
	color: #000 !important;
	-webkit transition: all 0.25s ease;
    transition: all 0.25s ease;
}

.contact:hover a.eml {
	color: #f7941d !important;
}

img.grid-icon {
	width: 6rem;
	margin: 0 auto 1rem 0;
	opacity: 0.625;
}

.capability {
	display: inline-block;
	/* padding: 0 0.75rem 0 0;
	border: 1px solid #000000; */
	margin-right: 1rem;
	margin-bottom: 1rem;
	font-size: 1rem;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.opening-statement, .module.first {
		margin-top: 5rem;
		margin-bottom: 5rem;
	}
	
	.statement {
		margin-top: 4rem;
		margin-bottom: 3rem;
	}
	
	.quote-container {
		padding: 10%;
	}

	.quote-container p.quote {
		font-size: 1.5rem;
		line-height: 1.3;
		margin-bottom: 2rem;
	}
	
	.section-title {
		margin-bottom: 1rem;
	}
	
	.m-1 {
		margin-bottom: 1rem;
	}

	.m-2 {
		margin-bottom: 2rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.opening-statement, .module.first {
		margin-top: 6rem;
		margin-bottom: 6rem;
	}
	
	.statement {
		margin-top: 4rem;
		margin-bottom: 3rem;
	}
	
	.quote-container p.quote {
		font-size: 2.125rem;
		line-height: 1.4;
		margin-bottom: 4rem;
	}
	
	.section-title {
		margin-bottom: 1rem;
	}
	
	.m-1 {
		margin-bottom: 0.75rem;
	}

	.m-2 {
		margin-bottom: 2rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.opening-statement, .module.first {
		margin-top: 8rem;
		margin-bottom: 8rem;
	}
	
	.statement {
		margin-top: 4rem;
		margin-bottom: 3rem;
	}
	
	.quote-container p.quote {
		font-size: 2.5rem;
		line-height: 1.4;
		margin-bottom: 4rem;
	}
	
	.section-title {
		margin-bottom: 2rem;
	}
	
	.m-1 {
		margin-bottom: 1rem;
	}

	.m-2 {
		margin-bottom: 2rem;
	}
	
	.mt-1 {
		margin-top: 1rem;
	}
	
	.mt-2 {
		margin-top: 2rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	.opening-statement, .module.first {
		margin-top: 9rem;
		margin-bottom: 9rem;
	}
	
	.statement {
		margin-top: 9rem;
		margin-bottom: 3rem;
	}
	
	.quote-container p.quote {
		font-size: 2.5rem;
		line-height: 1.4;
		margin-bottom: 4rem;
	}
	
	.section-title {
		margin-bottom: 1.5rem;
	}
	
	.m-1 {
		margin-bottom: 1rem;
	}

	.m-2 {
		margin-bottom: 2rem;
	}
	
	.mt-1 {
		margin-top: 1rem;
	}
	
	.mt-2 {
		margin-top: 2rem;
	}
	
}


/* -- STRUCTURE -- */

.container {
	display: block;
	width: 100%;
}

.section {
	display: inline-block;
	width: 100vw;
	font-size: 0px;
	text-align: center;
}

.section.margin {
	margin-bottom: 2rem;
}
	
.section.padding {
	padding-bottom: 2.5rem;
}

.section.first {
	margin-top: 0;
}

.section.full-screen {
	width: 100vw;
	height: 100vh;
}

.section.half {
	width: 100%;
	margin-bottom: 0.25rem;
}

.section.half.last {
	margin-right: 0;
}

.module {
	display: inline-block;
	padding-right: 1rem;
	padding-left: 1rem;
	width: 100%;
	overflow: hidden;
}

.modulette {
	display: inline-block;
	padding-right: 1.5rem;
	padding-left: 1.5rem;
	width: 100%;
	overflow: hidden;
}

.modulette.case-study {
	padding-right: 1rem;
	cursor: pointer;
}

a.case-study-button {
	position: absolute;
	z-index: 100;
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
	padding: 1.5rem;
}

a.case-study-button h1, a.case-study-button h2, a.case-study-button h3, a.case-study-button h4, a.case-study-button h5, a.case-study-button h6, a.case-study-button a {
	color: rgb(255,255,255) !important;
}

a.case-study-button .case-study-text {
	margin-top: 0;
}

a.case-study-button .overlay-linkbox {
	display: inline-block;
	font-family: "SuisseIntl-Medium", sans-serif;
	font-size: 0.875rem;
	letter-spacing: 0.03rem;
	line-height: 1;
	color: rgb(0,0,0) !important;
	padding: 0.625rem 1.25rem 0.625rem 1.25rem;
	border: 1px solid rgb(255,255,255);
	margin-top: 0.5rem;
	cursor: pointer;
	-webkit transition: all 0.75s ease;
    transition: all 0.75s ease;
	background-color: rgb(255,255,255);
}






.case-study-container {
	position: absolute;
	z-index: 2000;
	display: block;
	-webkit transition: all 0.75s ease;
    transition: all 0.75s ease;
	cursor: pointer;
}

.case-study-container:hover a.overlay-btn {
	color: rgb(0,0,0) !important;
	background-color: rgb(255,255,255);
}

.case-study-container:hover .modulette.case-study {
	margin-top: 0;
}

.full-screen-image {
	position: absolute;
	z-index: 1000;
	width: 100%;
	height: 100%;
	top: 0;
	left: 0;
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
	padding: 0;
	margin: 0;
}

.module.margin {
	margin-bottom: 1rem;
}

.module.margin2 {
	margin-bottom: 2rem;
}

.module.padded {
	padding: 3rem 0;
}

.module.padded-bottom {
	padding-bottom: 3rem;
}

.module.centered h1, .module.centered h2, .module.centered h3, .module.centered h4, .module.centered h5, .module.centered p {
	text-align: center;
}

.module.white {
	color: rgb(255,255,255);
}

.image-layer {
	width: 100%;
}

.image-layer img {
	width: 100%;
}

.hero {
	background-repeat: no-repeat;
	background-position: center center;
	-webkit-background-size: cover;
	-moz-background-size: cover;
	-o-background-size: cover;
	background-size: cover;
}

.overlay {
	position: absolute;
	z-index: 2000;
}

.overlay.full {
	top: 0;
	left: 0;
	width: 100%;
	height: 100%;
}

.overlay.full.centered {
	text-align: center;
}

.tint15 {
	background: rgba(0,0,0,0.15);
}

.tint20 {
	background: rgba(0,0,0,0.2);
}

.tint25 {
	background: rgba(0,0,0,0.25);
}

.tint30 {
	background: rgba(0,0,0,0.3);
}

.tint35 {
	background: rgba(0,0,0,0.35);
}

.tint40 {
	background: rgba(0,0,0,0.4);
}

.tint45 {
	background: rgba(0,0,0,0.45);
}

.tint50 {
	background: rgba(0,0,0,0.5);
}

.overlay.full.tint-0-0-20 {
	background: rgba(1,41,85,0.25);
	/*background: -moz-linear-gradient(top, rgba(1,41,85,0) 0%, rgba(1,41,85,0) 50%, rgba(1,41,85,0.25) 100%); /* FF3.6-15 */
	/*background: -webkit-linear-gradient(top, rgba(1,41,85,0) 0%,rgba(1,41,85,0) 50%,rgba(1,41,85,0.25) 100%); /* Chrome10-25,Safari5.1-6 */
	/*background: linear-gradient(to bottom, rgba(1,41,85,0) 0%,rgba(1,41,85,0) 50%,rgba(1,41,85,0.25) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00012955', endColorstr='#26012955',GradientType=0 ); /* IE6-9 */
}

.tint-0-0-20 {
	background: rgba(1,41,85,0.25);
	/*background: -moz-linear-gradient(top, rgba(1,41,85,0) 0%, rgba(1,41,85,0) 50%, rgba(1,41,85,0.25) 100%); /* FF3.6-15 */
	/*background: -webkit-linear-gradient(top, rgba(1,41,85,0) 0%,rgba(1,41,85,0) 50%,rgba(1,41,85,0.25) 100%); /* Chrome10-25,Safari5.1-6 */
	/*background: linear-gradient(to bottom, rgba(1,41,85,0) 0%,rgba(1,41,85,0) 50%,rgba(1,41,85,0.25) 100%); /* W3C, IE10+, FF16+, Chrome26+, Opera12+, Safari7+ */
	/*filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#00012955', endColorstr='#26012955',GradientType=0 ); /* IE6-9 */
}

.overlay.full-screen.centered {
	text-align: center;
}

.overlay-text {
	display: inline-block;
}

.overlay-text h1, .overlay-text h2, .overlay-text h3, .overlay-text p {
	font-family: "FoundersGrotTest-Medium", sans-serif;
	color: rgb(255,255,255);
}

.overlay-text h1, .overlay-text h2, .overlay-text h3, .overlay-text p {
	font-family: "FoundersGrotTest-Medium", sans-serif;
	color: rgb(255,255,255);
}

.no-y {
	padding-top: 1.5rem;
}

.top-y {
	position: relative;
	top: 15%;
	transform: perspective(1px) translateY(-15%);
}

.center-y {
	position: relative;
	top: 50%;
	transform: perspective(1px) translateY(-50%);
}

.bottom-y {
	position: relative;
	top: 75%;
	transform: perspective(1px) translateY(-75%);
}

.center-x {
	position: relative;
	left: 50%;
	transform: perspective(1px) translateX(-50%);
}

.left-align {
	text-align: left;
}

.relative {
	position: relative;
}

.grid-margin {
	margin-bottom: 0;
}

.border-top {
	border-top: 1px solid rgba(255,255,255,0.25);
	padding-top: 9rem;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.section.first {
		margin-top: 0;
	}
	
	
	.section.margin {
		margin-bottom: 4rem;
	}
	
	.section.padding {
		padding-bottom: 4rem;
	}
	
	.module {
		width: 100%;
		padding-right: 2rem;
		padding-left: 2rem;
	}
	
	.module.padded {
		padding: 6rem 0;
	}
	
	.module.padded-bottom {
		padding-bottom: 6rem;
	}
	
	.modulette {
		padding-right: 2rem;
		padding-left: 2rem;
	}

	.modulette.case-study {
		padding-right: 1rem;
	}
	
	.module.margin {
		margin-bottom: 1rem;
	}
	
	.module.margin2 {
		margin-bottom: 2rem;
	}
	
	.no-y {
		padding-top: 2rem;
	}
	
	a.case-study-button {
		padding: 1.5rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.section.first {
		margin-top: 0;
	}
	
	.grid-margin {
		margin-bottom: 0.25rem;
	}
	
	.section.half {
		float: left;
		width: calc((100% - 0.25rem) / 2);
		margin-right: 0.25rem;
	}
	
	.section.margin {
		margin-bottom: 6rem;
	}
	
	.section.padding {
		padding-bottom: 4rem;
	}
	
	.module {
		width: 100%;
		padding-right: 2rem;
		padding-left: 2rem;
	}
	
	.module.padded {
		padding: 6rem 0;
	}
	
	.module.padded-bottom {
		padding-bottom: 6rem;
	}
	
	.modulette {
		padding-right: 2rem;
		padding-left: 2rem;
	}
	
	.modulette.case-study {
		padding-right: 3rem;
		margin-top: 1rem;
		-webkit transition: all 0.75s ease;
    	transition: all 0.75s ease;
	}
	
	.module.margin {
		margin-bottom: 2rem;
	}
	
	.module.margin2 {
		margin-bottom: 4rem;
	}
	
	.no-y {
		padding-top: 2rem;
	}
	
	a.case-study-button {
		padding: 2rem;
	}
	
	a.case-study-button .case-study-text {
		margin-top: 1rem;
		-webkit transition: all 0.75s ease;
	    transition: all 0.75s ease;
	}
	
	a.case-study-button .overlay-linkbox {
		font-size: 1rem;
		color: rgb(255,255,255) !important;
		padding: 0.75rem 1.5rem 0.75rem 1.5rem;
		-webkit transition: all 0.75s ease;
	    transition: all 0.75s ease;
		background: transparent;
	}

	a.case-study-button:hover .overlay-linkbox {
		color: rgb(0,0,0) !important;
		background-color: rgb(255,255,255);
	}

	a.case-study-button:hover .case-study-text {
		margin-top: 0;
	
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.section.first {
		margin-top: 0;
	}
	
	.section.margin {
		margin-bottom: 8rem;
	}
	
	.section.padding {
		padding-bottom: 6rem;
	}
	
	.module {
		width: 100rem;
		padding-right: 3rem;
		padding-left: 3rem;
	}
	
	.module.padded {
		padding: 12rem 0;
	}
	
	.module.padded-bottom {
		padding-bottom: 12rem;
	}
	
	.modulette {
		width: 100%;
		padding-right: 3rem;
		padding-left: 3rem;
	}
	
	.module.margin {
		margin-bottom: 3rem;
	}
	
	.modulette.case-study {
		padding-right: 4rem;
	}
	
	.module.margin2 {
		margin-bottom: 6rem;
	}
	
	.no-y {
		padding-top: 3rem;
	}
	
	a.case-study-button {
		padding: 3rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	.section.margin {
		margin-bottom: 9rem;
	}
	
	.section.padding {
		padding-bottom: 7rem;
	}
	
	.section.first {
		margin-top: 0;
	}
	
	.module {
		width: 100rem;
		padding-right: 3rem;
		padding-left: 3rem;
	}
	
	.module.padded {
		padding: 12rem 0;
	}
	
	.module.padded-bottom {
		padding-bottom: 12rem;
	}
	
	.modulette {
		width: 100%;
		padding-right: 3rem;
		padding-left: 3rem;
	}

	.modulette.case-study {
		padding-right: 12rem;
	}
	
	.module.margin {
		margin-bottom: 3rem;
	}
	
	.module.margin2 {
		margin-bottom: 6rem;
	}
	
	.no-y {
		padding-top: 3rem;
	}
	
}










/* -- GRIDS -- */

.two-column-grid {
	width: 100%;
	overflow: hidden;
}

.two-column-grid .one-column {
	width: 100%;
	overflow: hidden;
	margin-bottom: 1rem;
}

.two-column-grid .two-columns {
	width: 100%;
	overflow: hidden;
}

.three-column-grid {
	width: 100%;
	overflow: hidden;
}

.three-column-grid .one-column {
	width: 100%;
	overflow: hidden;
	margin-bottom: 2rem;
}

.three-column-grid .one-column.last {
	margin-bottom: 0;
}

.three-column-grid .one-column.last p {
	margin-bottom: 0;
}

.three-column-grid .two-columns {
	width: 100%;
	overflow: hidden;
}

.three-column-grid .three-columns {
	width: 100%;
	overflow: hidden;
}

.four-column-grid  {
	width: 100%;
	overflow: hidden;
}

.four-column-grid .one-column {
	width: 100%;
	overflow: hidden;
}

.four-column-grid .two-columns {
	width: 100%;
	overflow: hidden;
}

.four-column-grid .three-columns {
	width: 100%;
	overflow: hidden;
}

.four-column-grid .four-columns {
	width: 100%;
	overflow: hidden;
}

.two-column-grid.border-top, .three-column-grid.border-top, .four-column-grid.border-top, .footer-cta.border-top {
	padding-top: 2.5rem;
	border-top: 1px solid rgba(0,0,0,0.75);
}

.two-column-grid .one-column.centered, .three-column-grid .one-column.centered, .four-column-grid .one-column.centered {
	text-align: center;
}

.two-column-grid .one-column.inset, .three-column-grid .one-column.inset, .four-column-grid .one-column.inset {
	padding: 3rem 3rem 3rem 3rem;
	/*border-radius: 1.5rem;*/
	/*border: 1px solid rgba(0,0,0,0.75);*/
	/*background-color: #f2f2f2;*/
}

.two-column-grid .one-column h4.centered, .three-column-grid .one-column h4.centered, .four-column-grid .one-column h4.centered, .two-column-grid .one-column h5.centered, .three-column-grid .one-column h5.centered, .four-column-grid .one-column h5.centered {
	text-align: center;
}

.one-column.gridded {
	margin-bottom: 1rem;
}

.one-column.no-mobile {
	display: none;
}

.one-column .height-manager {
	min-height: 18.5rem;
}

.one-column.frame {
	padding: 2rem;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.two-column-grid .one-column {
		float: left;
		width: calc((100% - 1rem) / 2);
		margin-right: 1rem;
		margin-bottom: 1rem;
	}
	
	.two-column-grid .one-column:nth-child(2n) {
		margin-right: 0;
	}

	.three-column-grid .one-column {
		float: left;
		text-align: left;
		width: calc((100% - 2rem) / 3);
		margin-right: 1rem;
		margin-bottom: 2rem;
	}
	
	.three-column-grid .one-column:nth-child(3n) {
		margin-right: 0;
	}
	
	.three-column-grid .one-column.last {
		margin-right: 0;
		margin-bottom: 0;
	}

	.three-column-grid .two-columns {
		float: left;
		width: calc(((100% - 2rem) / 3 ) * 2 + 1rem); 
		margin-right: 1rem;
	}
	
	.three-column-grid .two-columns.last {
		margin-right: 0;
	}

	.four-column-grid .one-column {
		float: left;
		text-align: left;
		width: calc((100% - 3rem) / 4);
		margin-right: 1rem;
	}
	
	.four-column-grid .one-column:nth-child(4n) {
		margin-right: 0;
	}
	
	.four-column-grid .two-columns {
		float: left;
		width: calc(((100% - 3rem) / 4 ) * 2 + 1rem); 
		margin-right: 1rem;
	}
	
	.four-column-grid .two-columns:nth-child(2n) {
		margin-right: 0;
	}

	.four-column-grid .three-columns {
		float: left;
		width: calc(((100% - 3rem) / 4 ) * 3 + 3rem); 
		margin-right: 1rem;
	}
	
	.two-column-grid.border-top, .three-column-grid.border-top, .four-column-grid.border-top, .footer-cta.border-top {
		padding-top: 4rem;
	}
	
	.one-column.gridded {
		margin-bottom: 1rem;
	}
	
	.one-column.no-mobile {
		display: block;
	}
	
	.two-column-grid .one-column.inset, .three-column-grid .one-column.inset, .four-column-grid .one-column.inset {
		padding: 3rem 3rem 3rem 3rem;
	}
	
	.one-column .height-manager {
		min-height: 14.5rem;
	}
	
	.one-column.frame {
		padding: 2rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.two-column-grid .one-column {
		width: calc((100% - 1rem) / 2);
		margin-right: 1rem;
		margin-bottom: 1rem;
	}
	
	.two-column-grid .one-column:nth-child(2n) {
		margin-right: 0;
	}

	.three-column-grid .one-column {
		float: left;
		text-align: left;
		width: calc((100% - 4rem) / 3);
		margin-right: 2rem;
	}
	
	.three-column-grid .one-column:nth-child(3n) {
		margin-right: 0;
	}

	.three-column-grid .two-columns {
		float: left;
		width: calc(((100% - 4rem) / 3 ) * 2 + 2rem); 
		margin-right: 2rem;
	}

	.four-column-grid .one-column {
		float: left;
		text-align: left;
		width: calc((100% - 6rem) / 4);
		margin-right: 2rem;
	}
	
	.four-column-grid .one-column:nth-child(4n) {
		margin-right: 0;
	}

	.four-column-grid .two-columns {
		float: left;
		width: calc(((100% - 6rem) / 4 ) * 2 + 2rem); 
		margin-right: 2rem;
	}
	
	.four-column-grid .two-columns:nth-child(2n) {
		margin-right: 0;
	}

	.four-column-grid .three-columns {
		float: left;
		width: calc(((100% - 6rem) / 4 ) * 3 + 4rem); 
		margin-right: 2rem;
	}
	
	.two-column-grid.border-top, .three-column-grid.border-top, .four-column-grid.border-top, .footer-cta.border-top {
		padding-top: 4rem;
	}
	
	.one-column.gridded {
		margin-bottom: 2rem;
	}
	
	.two-column-grid .one-column.inset, .three-column-grid .one-column.inset, .four-column-grid .one-column.inset {
		padding: 3rem 3rem 3rem 3rem;
	}
	
	.one-column .height-manager {
		min-height: 16.5rem;
	}
	
	.one-column.frame {
		padding: 3rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.two-column-grid .one-column {
		width: calc((100% - 1rem) / 2);
		margin-right: 1rem;
		margin-bottom: 1rem;
	}
	
	.two-column-grid .one-column:nth-child(2n) {
		margin-right: 0;
	}

	.three-column-grid .one-column {
		float: left;
		text-align: left;
		width: calc((100% - 4rem) / 3);
		margin-right: 2rem;
	}
	
	.three-column-grid.tight .one-column {
		width: calc((100% - 1rem) / 3);
		margin-right: 0.5rem;
		margin-bottom: 0.5rem;
	}
	
	.three-column-grid .one-column:nth-child(3n), .three-column-grid-tight .one-column:nth-child(3n) {
		margin-right: 0;
	}

	.three-column-grid .two-columns {
		float: left;
		width: calc(((100% - 4rem) / 3 ) * 2 + 2rem); 
		margin-right: 2rem;
	}

	.four-column-grid .one-column {
		float: left;
		text-align: left;
		width: calc((100% - 6rem) / 4);
		margin-right: 2rem;
	}
	
	.four-column-grid .one-column:nth-child(4n) {
		margin-right: 0;
	}

	.four-column-grid .two-columns {
		float: left;
		width: calc(((100% - 6rem) / 4 ) * 2 + 2rem); 
		margin-right: 2rem;
	}

	.four-column-grid .three-columns {
		float: left;
		width: calc(((100% - 6rem) / 4 ) * 3 + 4rem); 
		margin-right: 2rem;
	}
	
	.two-column-grid.border-top, .three-column-grid.border-top, .four-column-grid.border-top, .footer-cta.border-top {
		padding-top: 6rem;
	}
	
	.one-column.gridded {
		margin-bottom: 2rem;
	}
	
	.two-column-grid .one-column.inset, .three-column-grid .one-column.inset, .four-column-grid .one-column.inset {
		padding: 3rem 4rem 4rem 4rem;
	}
	
	.one-column .height-manager {
		min-height: 10.875rem;
	}
	
	.one-column.frame {
		padding: 4rem;
	}
	
	.square-div {
		position: relative;
		width: 100%;
		height: 0;
		padding-bottom: 100%;
	}
	
}










/* -- ISOTOPE -- */

.filter-holder {
	margin-bottom: 2rem;
}

ul.filters {
	display: block;
	text-align: center;
	padding-bottom: 1rem;
}

ul.filters li {
	text-align: center;
	display: inline-block;
	cursor: pointer;
	font-family: "FoundersGrotTest-Medium", sans-serif;
	font-style: normal;
	font-size: 1rem;
	line-height: 1;
	text-align: center;
	padding: 0.25rem 0.75rem;
	-webkit transition: all 0.5s ease;
    transition: all 0.5s ease;
}

ul.filters li:hover {
	color: #f7941d;
}

ul.filters li.selected {
	color: #f7941d;
}

.grid-sizer, .item {
	position: relative;
	display: inline-block;
	font-size: 0;
	width: calc(100% - 2rem);
	cursor: pointer;
	overflow: hidden;
	padding: 0 0 1rem 0;
	margin: 0;
	-webkit-box-sizing: border-box;
	-moz-box-sizing: border-box;
	box-sizing: border-box;
	cursor: pointer;
}

.item img {
	width: 100%;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.filter-holder {
		margin-bottom: 2rem;
	}
	
	.grid-sizer, .item  {
		width: calc((100% - 4rem) / 2);
		padding: 0.5rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.filter-holder {
		margin-bottom: 2rem;
	}
	
	.grid-sizer, .item  {
		width: calc((100% - 4rem) / 3);
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.filter-holder {
		margin-bottom: 3rem;
	}
	
	.grid-sizer, .item {
		width: calc((100% - 6rem) / 4);
	}
}









/* -- LOCATIONS -- */

.location {
	margin-bottom: 8rem;
}

.location h1, .location h2, .location h3, .location h4 {
	margin-bottom: 0.75rem;
}

.location img {
	margin-top: 0.75rem;
}

.three-column-grid .one-column.location {
	margin-bottom: 4rem;
}

.location p {
	margin-bottom: 1rem;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.location h1, .location h2, .location h3, .location h4 {
		margin-bottom: 1rem;
	}
	
	.three-column-grid .one-column.location {
		margin-bottom: 3rem;
	}
	
	.location p {
		margin-bottom: 0;
	}
		
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.location h1, .location h2, .location h3, .location h4 {
		margin-bottom: 1rem;
	}
	
	.three-column-grid .one-column.location {
		margin-bottom: 6rem;
	}
	
	.location p {
		margin-bottom: 1rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.location h1, .location h2, .location h3, .location h4 {
		margin-bottom: 1.5rem;
	}
	
	.three-column-grid .one-column.location {
		margin-bottom: 6rem;
	}
	
	.location p {
		margin-bottom: 1rem;
	}
}


/* -- CAPABILITIES -- */

.three-column-grid .one-column.capability-index {
	margin-bottom: -2rem;
}

.capability-icon {
	width: 50%;
}

.capability-description {
	margin-bottom: 1.5rem;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.three-column-grid .one-column.capability-index {
		margin-bottom: 2rem;
	}
	
	.capability-description {
		margin-bottom: 0.5rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.three-column-grid .one-column.capability-index {
		margin-bottom: 0;
	}
	
	.capability-description {
		margin-bottom: 0.5rem;
	}
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.three-column-grid .one-column.capability-index {
		margin-bottom: 0;
	}
	
	.capability-description {
		margin-bottom: 0.5rem;
	}
}




/* -- STAFF -- */

.ceo-image-container {
	position: relative; /* If you want text inside of it */
	width: 100%;
	height: 0;
	padding-top: 56.25%; /* 16:9 Aspect Ratio */ 
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: 100%;
	/*border: 1px solid rgba(0,0,0,0.75);*/
}

.staff-image-container-4 {
	position: relative; /* If you want text inside of it */
	width: 100%;
	height: 0;
	padding-top: 115.968992248062%; /* 1:1 Aspect Ratio */
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: 100% 400%;
	/*border: 1px solid rgba(0,0,0,0.75);*/
}

.staff-image-container-5 {
	position: relative; /* If you want text inside of it */
	width: 100%;
	height: 0;
	padding-top: 115.968992248062%; /* 1:1 Aspect Ratio */
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: 100% 500%;
	/*border: 1px solid rgba(0,0,0,0.75);*/
}

.staff-image-container-6 {
	position: relative; /* If you want text inside of it */
	width: 100%;
	height: 0;
	padding-top: 115.968992248062%; /* 1:1 Aspect Ratio */
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: 100% 600%;
	/*border: 1px solid rgba(0,0,0,0.75);*/
}

.staff-image-container-6a {
	position: relative; /* If you want text inside of it */
	width: 100%;
	height: 0;
	padding-top: 115.968992248062%; /* 1:1 Aspect Ratio */
	overflow: hidden;
	background-repeat: no-repeat;
	background-size: 100% 600%;
	/*border: 1px solid rgba(0,0,0,0.75);*/
}

.staff-image-container-4:hover {
	animation-name: moveMe;
	animation-duration: 0.3s;
	animation-timing-function: steps(3);
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

.staff-image-container-5:hover {
	animation-name: moveMe;
	animation-duration: 0.35s;
	animation-timing-function: steps(4);
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

.staff-image-container-6:hover {
	animation-name: moveMe;
	animation-duration: 0.4s;
	animation-timing-function: steps(5);
	animation-iteration-count: 1;
	animation-fill-mode: forwards;
}

@keyframes moveMe {
  from { 
    background-position: top; 
  }
  to { 
    background-position: bottom; 
  }
}

.staff-text-container {
	position: absolute;
	z-index: 100;
	bottom: 0;
	left: 0;
	padding-left: 1.5rem;
	padding-right: 1.5rem;
	padding-bottom: 0.75rem;
	padding-top: 1.5rem;
	text-align: center;
	width: auto;
	background: rgba(1,41,85,0.2);
	background: rgba(0,0,0,0.25);
}

.staff-text-container h4, .staff-text-container h5, .staff-text-container h6 {
	width: 100%;
	text-align: left;
}

.navigator {
	padding: 3rem 0;
	border-top: 1px solid rgba(0,0,0,0.25);
}

.navigator .previous {
	position: relative;
	float: left;
	width: 50%;
	text-align: left;
	overflow: hidden;
}

.navigator .next {
	float: right;
	width: 45%;
	text-align: right;
	overflow: hidden;
}

.navigator .previous img, .navigator .next img {
	display: inline-block;
	width: 6rem;
}


.navigator .previous h5, .navigator .next h5 {
	display: inline-block;
	margin-top: 1rem;
	opacity: 0.35;
	-webkit transition: all 0.5s ease;
    transition: all 0.5s ease;
}

.navigator .previous h5:hover , .navigator .next h5:hover {
	opacity: 1.0;
	color: rgb(0,0,0) !important;
}

.navigator .previous h5 {
	padding-left: 2.25rem;
	background: transparent url('../img/icon/arrow/arrow_previous.svg') no-repeat left center;
	background-size: 1.5rem;
}

.navigator .next h5 {
	padding-right: 2.25rem;
	background: transparent url('../img/icon/arrow/arrow_next.svg') no-repeat right center;
	background-size: 1.5rem;
}

.portrait-bio-area {
	margin-top: 1rem;
}

.portrait-area {
	width: 100%;
	margin-top: 1rem;
}

.bio-area {
	width: 100%;
	margin-top: 1rem;
}


@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.portrait-bio-area {
		margin-top: 2rem;
	}
	
	.portrait-area {
		width: 100%;
		margin-bottom: 2rem;
	}

	.bio-area {
		width: 100%;
		margin-top: 2rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.portrait-bio-area {
		margin-top: 3rem;
	}
	
	.portrait-area {
		float: right;
		width: 50%;
		margin-bottom: 2rem;
	}

	.bio-area {
		float: left;
		width: 50%;
		padding-right: 2rem;
		margin-top: 0;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.portrait-bio-area {
		margin-top: 4rem;
	}
	
	.portrait -area{
		float: right;
		width: 50%;
		margin-bottom: 2rem;
	}

	.bio-area {
		float: left;
		width: 50%;
		padding-right: 2rem;
		margin-top: 0;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	.portrait-bio-area {
		margin-top: 6rem;
	}
	
	.portrait-area {
		float: right;
		width: 50%;
		margin-bottom: 2rem;
	}

	.bio-area {
		float: left;
		width: 50%;
		padding-right: 2rem;
		margin-top: 0;
	}
	
}






/* FOOTER */

.footer-cta {
	width: 100%;
	padding: 2.5rem 0;
	text-align: center;
}

.footer-cta h1, .footer-cta h2, .footer-cta h3, .footer-cta h4 {
	text-align: center;
}

.section.footer {
	height: 10rem;
	background-color: #012955;
	text-align: center;
}

.section.footer .module {
	text-align: center;
}

.section.footer p {
	text-align: center;
	color: rgba(255,255,255, 0.5);
	margin-bottom: 1rem;
}

.section.footer p a {
	color: rgba(255,255,255,0.5) !important;
}

.section.footer p a:hover {
	color: rgba(255,255,255,1.0) !important;
}

ul.social {
	display: inline-block;
	text-align: left;
	margin-bottom: 1rem;
}

ul.social li {
	float: left;
	display: inline-block;
	color: rgb(255,255,255);
	margin-right: 0rem;
	margin-left: 1rem;
}

ul.social li a {
	display: inline-block;
	color: rgb(255,255,255);
	width: 1.25rem;
	height: 1.25rem;
	overflow: hidden;
	text-indent: -200%;
	font-size: 0px;
	background-repeat: none;
	opacity: 0.35;
	-webkit transition: all 0.5s ease;
    transition: all 0.5s ease;
}

ul.social li a:hover {
	opacity: 1.0;
}

ul.social li a.facebook {
	background-image: url('../img/icon/facebook.svg');
}

ul.social li a.instagram {
	background-image: url('../img/icon/instagram.svg');
}

ul.social li a.linkedin {
	background-image: url('../img/icon/linkedin.svg');
}

ul.social li a.twitter {
	background-image: url('../img/icon/twitter.svg');
}

ul.social li a.pinterest {
	background-image: url('../img/icon/pinterest.svg');
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.footer-cta {
		padding: 4rem 0 5rem 0;
	}
	
	.section.footer {
		height: 5rem;
	}
	
	.section.footer .module {
		text-align: left;
	}

	.section.footer p {
		float: right;
		font-size: 0.875rem;
		color: rgba(255,255,255, 0.5);
		margin-right: 1rem;
		margin-bottom: 0;
	}
	
	ul.social {
		float: right;
		display: inline-block;
		text-align: left;
		margin-bottom: 0;
	}

	ul.social li {
		float: left;
		display: inline-block;
		color: rgb(255,255,255);
		margin-right: 1rem;
		margin-left: 0;
	}
		
	ul.social li a {
		width: 1.25rem;
		height: 1.25rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.footer-cta {
		padding: 4rem 0 5rem 0;
	}
	
	.section.footer {
		height: 6rem;
	}
	
	.section.footer p {
		font-size: 1rem;
	}
	
	ul.social li a {
		width: 1.25rem;
		height: 1.25rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.footer-cta {
		padding: 6rem 0 7rem 0;
	}
	
	.section.footer {
		height: 8rem;
	}
	
	ul.social li a {
		width: 1.5rem;
		height: 1.5rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	.footer-cta {
		padding: 6rem 0 7rem 0;
	}
	
	.section.footer {
		height: 8rem;
	}
	
	ul.social li a {
		width: 1.5rem;
		height: 1.5rem;
	}
	
}










/* -- ANIMATIONS -- */

/* -- FADE IN SENTENCE -- */

span.fade-me-in {
	opacity: 0;
	-webkit transition: all 1.5s ease;
    transition: all 1.5s ease;
}

span.fade-me-in.is-active {
	opacity: 1;
}

span.fadeMe1, span.fadeMe2, span.fadeMe3, span.fadeMe4, span.fadeMe5, span.fadeMe6, span.fadeMe7, span.fadeMe8, span.fadeMe9 {
	opacity: 0;
	-webkit transition: all 0.75s ease;
    transition: all 0.75s ease;
}

span.fadeMe1.activate, span.fadeMe2.activate, span.fadeMe3.activate, span.fadeMe4.activate, span.fadeMe5.activate, span.fadeMe6.activate, span.fadeMe7.activate, span.fadeMe8.activate, span.fadeMe9.activate {
	opacity: 1;
}

/* -- ROTATING TEXT -- */

h1.rotating-text, h2.rotating-text, h3.rotating-text {
	display: inline-block;
	vertical-align: top;
}

.word {
  position: absolute;
  width: 550px;
  opacity: 0;
}

.letter {
  display: inline-block;
  position: relative;
  float: left;
  transform: translateZ(25px);
  transform-origin: 50% 50% 25px;
}

.letter.out {
  transform: rotateX(90deg);
  transition: transform 0.32s cubic-bezier(0.55, 0.055, 0.675, 0.19);
}

.letter.behind {
  transform: rotateX(-90deg);
}

.letter.in {
  transform: rotateX(0deg);
  transition: transform 0.38s cubic-bezier(0.175, 0.885, 0.32, 1.275);
}

/* -- GRAVITY -- */

.margin.gravity {
	overflow: visible;
}
	
h1.gravity-text {
	display: inline-block;
	overflow: visible;
}

#reset {
	cursor: pointer;
}

/* -- CLIENTS -- */

.clients {
	text-align: center;
}

.clientlogos {
	width: 100%;
	height: 14.25rem;
	box-sizing: border-box;
	margin-top: 3rem;
	margin-bottom: 6rem;
	margin-right: 0;
	margin-left: 0;
	padding: 0;
	overflow: hidden;
}

.slick-slide {
	padding: 0 2rem;
}

.slick-slide img {
	width: auto;
	max-height: 228px;
}

@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.clientlogos {
		margin-bottom: 6rem;
	}
	
	.slick-slide {
		padding: 0 2rem;
	}
	
	.slick-slide img {
		width: auto;
		max-height: 228px;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.clientlogos {
		margin-bottom: 9rem;
	}
	
	.slick-slide {
		padding: 0 3rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.clientlogos {
		margin-bottom: 9rem;
	}
	
	.slick-slide {
		padding: 0 4rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	
	
}


/* -- INSIGHTIVITY -- */

.insightivity {
	padding-top: 3rem;
	padding-bottom: 3rem;
	background-color: #012955;
}

.insightivity.active {
	animation: changeBackgroundColor 3s normal ease;
	animation-fill-mode: forwards;
}

.insightivity-animation-space {
	position: relative;
	height: 5rem;
	margin-bottom: 4rem;
	overflow: hidden;
}

.word-object {
	position: absolute;
	height: 100%;
}

.word-object h1, .word-object h2 {
	position: relative;
	display: inline-block;
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-size: 4rem;
	font-weight: 200;
	line-height: 1.0;
	color: rgb(255,255,255);
	top: 50%;
	transform: perspective(1px) translateY(-50%);
}

.word-object.insight.active {
	animation: moveInsight 4s normal ease-in-out;
	animation-fill-mode: forwards;
}

.word-object.creativity {
	z-index: 2;
	left: -30%;
	width: 70rem;
	opacity: 1;
}

.word-object.creativity.active {
	animation: moveCreativity 4s normal ease-in-out;
	animation-fill-mode: forwards;
	transform-origin: center center;
}

.word-object.creativity .creativity-left {
	height: 100%;
	text-align: right;
	display: inline-block;
	width: 50%;
	margin-left: -100%;
}

.word-object.creativity .creativity-right {
	height: 100%;
	text-align: left;
	display: inline-block;
	width: 50%;
}

.word-object.creativity .creativity-left.active {
	animation: fadeOutCreat 4s normal ease-in-out;
	animation-fill-mode: forwards;
}

.TM {
	display: inline-block;
	opacity: 0;
}

.TM h1 {
	font-family: "Chronicle Display A", "Chronicle Display B";
	font-style: normal;
	font-size: 2rem;
	font-weight: 200;
	line-height: 1.0;
	color: rgb(255,255,255);
}

.TM.active {
	animation: turnOnTM 4s normal ease-in-out;
	animation-fill-mode: forwards;
	-webkit-animation-duration: 4s;
	animation-duration: 4s;
    -webkit-animation-name: turnOnTM;
    animation-name: turnOnTM;
    -webkit-animation-duration: 3s;
    animation-duration: 3s;
    -webkit-animation-timing-function: ease-in-out;
    animation-timing-function: ease-in-out;
}

.word-object.insight {
	z-index: 1;
	right: -45%;
	opacity: 1;
}

.word-object.insight h2 {
	text-align: right;
}

.insightivity-text {
	opacity: 0;
}

.insightivity-text.active {
	animation: fadeInText 4s normal ease;
	animation-fill-mode: forwards;
}

@keyframes moveCreativity {
	
	0% {
		left: -30%;
	}
	
	50% {
		left: 54%;
	}

	100% {
		left: 54%;
	}
}

@keyframes moveInsight {
	
	0% {
		right: -45%;
	}
	
	50% {
		right: 46%;
	}
	
	100% {
		right: 46%;
	}
}

@keyframes fadeOutCreat {
	
	0% {
		opacity: 1;
	}

	40% {
		opacity: 1;
	}
	
	50% {
		opacity: 0;
	}
	
	100% {
		opacity: 0;
	}
}

@keyframes turnOnTM {
	
	0% {
		opacity: 0;
	}
	
	84% {
		opacity: 0;
	}
	
	85% {
		opacity: 1.0;
		transform: scale(1.0);
	}
	
	90% {
		opacity: 1.0;
		transform: scale(1.3);
    	transform-origin: top center;
	}
	
	95% {
		opacity: 1.0;
		transform: scale(1.0);
	}	
	
	100% {
		opacity: 1.0;
	}	
}

@keyframes fadeInText {
	
	0% {
		opacity: 0;
	}
	
	60% {
		opacity: 0;
	}

	80% {
		opacity: 0;
	}
	
	100% {
		opacity: 1;
	}	
}

@keyframes changeBackgroundColor {
	
	0% {
		background-color: #031f4b;
	}
	
	69% {
		background-color: #031f4b;
	}

	90% {
		background-color: #f7941d;
	}
	
	100% {
		background-color: #f7941d;
	}	
}


@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.word {
	  width: 520px;
	}
	
	.insightivity {
		padding-top: 4rem;
		padding-bottom: 4rem;
	}

	.insightivity-animation-space {
		height: 10rem;
		margin-bottom: 4rem;
	}
	
	.word-object h1, .word-object h2 {
		font-size: 8rem;
	}
	
	.TM h1 {
		font-size: 4rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.word {
	  width: 750px;
	}
	
	.insightivity {
		padding-top: 4rem;
		padding-bottom: 4rem;
	}

	.insightivity-animation-space {
		height: 16rem;
		margin-bottom: 4rem;
	}
	
	.word-object h1, .word-object h2 {
		font-size: 11rem;
	}
	
	.TM h1 {
		font-size: 4rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.word {
	  width: 820px;
	}
	
	.insightivity {
		padding-top: 6rem;
		padding-bottom: 6rem;
	}

	.insightivity-animation-space {
		height: 20rem;
		margin-bottom: 4rem;
	}
	
	.word-object h1, .word-object h2 {
		font-size: 13rem;
	}
	
	.TM h1 {
		font-size: 4.5rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	.word {
	  width: 820px;
	}
	
	.insightivity {
		padding-top: 6rem;
		padding-bottom: 6rem;
	}

	.insightivity-animation-space {
		height: 20rem;
		margin-bottom: 4rem;
	}
	
	.word-object h1, .word-object h2 {
		font-size: 15rem;
	}
	
	.TM h1 {
		font-size: 6rem;
	}
	
}


/* ---  MODIFIERS  --- */

.hide-overflow {
	overflow: hidden;
}

.no-phone {
	display: none;
}

.no-mobile {
	display: none;
}

.h100 {
	height: calc(100vh - 4rem);
	margin-bottom: 0.25rem;
}



@media screen and (min-width: 768px) {  /* -- 768px -- */
	
	.no-phone {
		display: inline-block;
	}
	
	.no-mobile {
		display: none;
	}
	
	.h100 {
		height: calc(100vh - 5rem);
		margin-bottom: 0.25rem;
	}
	
}

@media screen and (min-width: 1024px) {  /* -- 1024px -- */
	
	.no-phone {
		display: inline-block;
	}
	
	.no-mobile {
		display: inline-block;
	}
	
	.h100 {
		height: calc(100vh - 8rem);
		margin-bottom: 0.25rem;
	}
	
}

@media screen and (min-width: 1600px) {  /* -- 1600px -- */
	
	.no-phone {
		display: inline-block;
	}
	
	.no-mobile {
		display: inline-block;
	}
	
	.h100 {
		height: calc(100vh - 8rem);
		margin-bottom: 0.25rem;
	}
	
}

@media screen and (min-width: 1840px) {  /* -- 1840px -- */
	
	.no-phone {
		display: inline-block;
	}
	
	.no-mobile {
		display: inline-block;
	}
	
	.h100 {
		height: calc(100vh - 8rem);
		margin-bottom: 0.25rem;
	}
	
}