/*fonts*/
	@font-face {
	    font-family: 'Prophet';
	    src: url('fonts/Prophet-Medium.woff2') format('woff2'),
	         url('fonts/Prophet-Medium.woff') format('woff');
	    font-weight: 500;
	    font-style: normal;
	}

	@font-face {
	    font-family: 'Prophet';
	    src: url('fonts/Prophet-ExtraBold.woff2') format('woff2'),
	         url('fonts/Prophet-ExtraBold.woff') format('woff');
	    font-weight: 800;
	    font-style: normal;
	}

	@font-face {
	    font-family: 'Prophet';
	    src: url('fonts/Prophet-Bold.woff2') format('woff2'),
	         url('fonts/Prophet-Bold.woff') format('woff');
	    font-weight: bold;
	    font-style: normal;
	}

	@font-face {
	    font-family: 'Prophet';
	    src: url('fonts/Prophet-Regular.woff2') format('woff2'),
	         url('fonts/Prophet-Regular.woff') format('woff');
	    font-weight: normal;
	    font-style: normal;
	}
	@font-face {
		font-family: 'NeueHaasNormal';
		src: url('fonts/5e1b5c6919c05c2f3f953601_NeueHaasUnicaW1G-Regular.ttf') format('truetype');
		font-weight: normal;
		font-style: normal;
	}
/*-webkit-appearance: none;*/

body{
	font-family: 'NeueHaasNormal','Roboto', 'sans-serif';
	font-weight: normal;
	font-style: normal;
	font-size: 19px;
	line-height: 150%;
	letter-spacing: 0.02em;
	margin: 0;
	color:#333333;
	scroll-behavior: smooth;
}

h2{
	font-family: 'Prophet', 'Verdana','sans-serif';
	font-weight: normal;
	font-style: normal;
	font-size: 49px;
	line-height: 110%;
	margin:0;
	color:#333333;
	padding: 60px 0 20px 0;
}

h3{
	font-family: 'Prophet', 'Verdana','sans-serif';
	font-weight: normal;
	font-style: normal;
	font-size: 28px;
	line-height: 1.2;
	padding:22px 0;
	margin: 0;
	color:#333333;
}

a{
	text-decoration: none;
	color:#333333;
}

button{
	font-family: 'NeueHaasNormal','Roboto', 'sans-serif';
	font-weight: normal;
	font-style: normal;
	font-size: 19px;
	line-height: 140%;
	letter-spacing: 0.02em;
	margin: 0;
	color:#00866e;
	border: #00866e 1px solid;
	background-color: white;
	padding:15px;
	min-width: 120px;
	margin: 5px;
	transition:0.3s;
	cursor: pointer;
}

button:hover{
	background-color: #00866e;
	color: white;
}

li{
	padding-top: 5px;
	padding-bottom:5px;
}

ul{
	padding-left: 0;
	list-style-position: outside;
}

ol{
	padding-left: 0;
	list-style-position: outside;
}

sup{
	line-height: 100%;
}

.header a{
	background-color: white;
}

.detail{
	font-size:15.75px; 
	color: #666666;
}

.quote{
	font-style: italic;
	padding-top: 10px;
}

.quoter{
	text-align: right;
	padding-bottom: 10px;
}

.page-content-holder{
	max-width: 1500px;
	margin: auto;
	padding-left: 60px;
	padding-right: 60px;
}

.center-column{
	width: 100%;
	max-width: 600px;
	margin:auto;
}

.element-holder{
	break-inside: avoid;
	padding-top:50px;
	padding-bottom: 50px;
	background-color: white;
}

.element-holder a{
	color:#00866e;	
}

.footnotes{
	font-style: italic;
	border-top: #00866e solid 1px;
	border-bottom: #00866e solid 1px;
	margin:  50px 0;
	font-size:15.75px; 
}

.footnotes li{
	list-style: none;
	padding-top: 10px;
	padding-bottom: 10px;
	line-height: 150%;
}

.pdf{
	background-color: transparent !important;
	border-color: white !important;
	color: white !important;
}

.pdf:hover{
	background-color: white !important;
	color:#00866e !important;
}

.article-info{
	display: flex;
	justify-content: space-between;
	margin-top: 30px;
}

.project-article{
	float: left;
	padding:1%;
	margin-bottom: 40px;

}

.project-article p{
	margin: 0;
}

.bordered-box{
	border-color: #333333; 
	border-width: 1px;
	border-style: solid;
	padding: 10px 40px;
	margin: 50px 0;
}

.pull-quote{
	padding: 30px;
	background-color: #00866e ;
	color: white;
	text-align: center;
	font-size: 28px;
}


/*---------------------arrows------------------------*/

	.arrow-text{
		font-size: 19px;
		color:#00866e;
		height: 35px;
		border-bottom: 1px solid #00866e;
		cursor: pointer;
	}

	.arrow-white{
		background-image: url(images/arrow-big-white.png);
		background-repeat: no-repeat;
		background-position: bottom;
		background-size: contain;
		width:42px;
		height: 36px;
	}

	.arrow-green{
		background-image: url(images/arrow-big-green.png);
		background-repeat: no-repeat;
		background-position: bottom;
		background-size: contain;
		width:42px;
		height: 36px;
	}

	.green-strip{
	/*	width: 50px;*/
		border-bottom: 1px solid #00866e;
	}

	.arrow-link-container{
		display: flex;
		justify-content: flex-end;

	}

	ul.arrow-list{
		list-style-type: none;

	}

	li.arrow-down{
		background-image: url('images/arrow-down.png');
		background-repeat: no-repeat;
		height: 30px;
		color: #00866e;
		padding-left:18px;
		padding-top: 5px;
		padding-bottom: 5px;
	}

	li.arrow-out{
		background-image: url('images/arrow-out.png');
		background-repeat: no-repeat;
		height: 30px;
		color: #00866e;
		padding-right:100px;
		padding-top: 5px;
		padding-bottom: 5px;
	}

	.contributor-arrow{
		background-image: url('images/arrow-out.png');
		background-repeat: no-repeat;
		height: 30px;
		width: 77px;
		margin-top: 30px;
	}

	.arrow-up{
		background-image: url('images/arrow-up.png');
		background-repeat: no-repeat;
		height: 30px;
		color: #00866e;
		padding-left:18px;
		padding-top: 5px;
		padding-bottom: 5px;
	}

/*---------------------header -----------------------*/
	.head-logo{
		margin:10px;
		max-width: 200px;
	}

	.header{
		height: 115px;
		display:flex;
		justify-content: flex-end;
		align-items: center;
		padding-right:15px;
		z-index: 15;
	}

	.header a{
		color: #333333;
		padding-left: 30px;
		padding-right: 30px;
	}

	.header a:hover{
		text-decoration: underline;
	}

	.hamburger-holder{
		position: absolute;
		right:0;
		top:0;
		z-index: 20;
		height: 115px;
		width: 115px;
		/*background-color: yellow;*/
		display: flex;
		align-items: center;
		justify-content: center;
	}

	.hamburger-menu{
		width: 100%;
		background-color: white;
		height: 460px;
		transition: 0.3s;
		position: absolute;
		top: 0px;
		z-index: 10;
		display: flex;
		flex-direction: column;
		justify-content: space-around;
	}

	.hamburger-menu a{
		text-align: center;
	}

	.onscreen{
		-ms-transform:translate(0px,-575px);
		-webkit-transform:translate(0px,-575px);
		transform:translate(0px, -575px);
	}

	.show-on-mobile{
		display: none;
	}

/*---------------------hero image--------------------*/

	.hero-column{
		width: 100%;
		max-width: 768px;
		margin:auto;
		margin-top: 60px;
		margin-bottom: 60px;
	}

	.hero-text{
		display: flex;
		align-items: center;
		flex-direction: column;
		height:100%;
	}

	.hero-image{
		max-width: 100%;
		background-blend-mode: exclusion;
		background-size: cover;
		background-color: #00866E; 
		background-position: center;
		transition: background-color 0.5s;
	}

	.hero-image h2{
		color:white;
	}

	.hero-image .arrow-text{
		border-bottom: 1px solid white;
	}

	.hero-column .arrow-text{
		color: white;
	}

	.hero-image:hover{
		background-color: transparent;
		transform: translateZ(0);
	}

	.hero-clip {
		-webkit-clip-path: polygon(270px 0, 100% 0, 100% 100%, 0 100%, 0 162px);
		clip-path: polygon(270px 0, 100% 0, 100% 100%, 0 100%, 0 162px);
	}

	.hero-triangle{
		position: absolute;
		width: 20%;
	}

	.author-container{
		display: flex;
		color: white;
		align-items: center;

	}

	.author-container img{
		width: 50px;
		height: 50px;
		border-radius: 25px;
		background-color: white;
		margin-right: 18px;
	}

/*---------------------hero research-----------------*/

	.hero-research-holder{
		display: flex;
	}

	.hero-research img{
		max-width: 50%;
		height: auto;
	}

	.hero-research-text h3{
		padding: 0px;
		
	}

	.hero-research-clip {
		-webkit-clip-path: polygon(134px 0, 100% 0, 100% 100%, 0 100%, 0 81px);
		clip-path: polygon(134px 0, 100% 0, 100% 100%, 0 100%, 0 81px);
	}

	.hero-research-image{
		background-blend-mode: exclusion;
		background-size: cover;
		background-color: #00866E; 
		background-position: center;
		transition: background-color 0.5s;
	}

	.hero-research-image:hover{
		background-color: transparent;
		transform: translateZ(0);
	}

	.hero-research-text{
		/*max-width: 50%;*/
		padding:15px;
		/*display: flex;
		flex-direction: column;
		justify-content: space-between;*/
	}

	.hero-research-left{
		width: 50%;
	}

	.hero-research-description{
		padding: 20px 0;
	}

	.hero-research-outer{
		max-width: 50%;
	}

/*---------------------Research squares--------------*/

	.research-holder{
		display: inline-block;
		width: 50%;
		float: left;
	}

	.research-item{
		display: flex;
		flex-direction: column;
		width: 51%;

	}

	.research-text h3{
		padding:13px 0;
	}

	.research-item img{
		max-width: 100%;
		/*height: auto;*/
	}

	.research-item-image img{
		width: 100%;
		height:auto;
	}

	.coverage-item{
		display: flex;
		flex-direction: column;
		padding: 20px;
		min-height: 590px;
	}

	.research-item-image{
		background-blend-mode: exclusion;
		background-size: cover;
		background-color: #00866E; 
		background-position: center;
		transition: background-color 0.5s;
	}

	.research-item-clip {
		-webkit-clip-path: polygon(134px 0, 100% 0, 100% 100%, 0 100%, 0 81px);
		clip-path: polygon(134px 0, 100% 0, 100% 100%, 0 100%, 0 81px);
	}

	.research-item-image:hover{
		background-color: transparent;
		transform: translateZ(0);
	}

	.research-text{
		padding: 10px;
		background-color: white;
	}


	.research-description{
		padding:22px 0;
	}

	.research-item h3{
		padding:0px;
		line-height: 1.2;
	}

	.research-triangle{
		position: absolute;
		width: 10%;
	}

	.research-bottom{
	display: flex;
	justify-content: space-between;
	align-items: center;
	}

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

	.filter-btn{

	}

	#filter-holder{
		padding: 20px 0;
		display: inline-block;
		/*display: flex;
		justify-content: space-between;*/
	}

	.research-field{
		display: inline-block;
	}

	.filter-item{
		float: left;
		padding: 0 1% ;
		display: none;
		min-height: 600px;
	}

	.show{
		display: inline-block;
	}

	.active{
	background-color: #00866E;
	color: white;
	}

/*---------------------about-------------------------*/
	.member-frame{
		display: inline-block;
	}
	.member-image-frame{
		height:220px;
	}

	.member-outer{
		width: 25%;
		float: left;
		min-height: 400px;
	}

	.director-holder{
		display: flex;
		justify-content: space-between;
	}

	.director-text{
		background-color: white;
		width: 60%;
		padding: 5px 20px;
	}

	.director-photo{
		width: 40%;
	}

	.member-duo{
		display: flex;
		justify-content: space-between;
		width: 50%;
		padding-bottom: 30px;
	}

	.duo-holder{
		display: flex;
		flex-direction: row;
	}

	.member-item{
		display: flex;
		flex-direction: column;
		padding: 5px;
		background-color: white;
	}

	.member-clip{
		-webkit-clip-path: polygon(100px 0, 100% 0, 100% 100%, 0 100%, 0 60px);
		clip-path: polygon(100px 0, 100% 0, 100% 100%, 0 100%, 0 60px);
	}

	.member-item img{
		max-width: 100%;
		height: auto;
	}

	.video{
		position:relative;
		padding-top:56.25%;
		background-color: #00866E;
	}

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

	.footer{
		background-color:#333333;
		color: white;
		padding:25px 60px;
		font-size: 16px;
		margin-top:50px;
	}

	.footer-inner{
		width: 100%;
		max-width: 1500px;
		margin: auto;
		display: flex;
		justify-content: space-between;
	}

	.footer a{
		color:white;
	}

	.link-list{
		display: flex;
		flex-direction: column;
		padding-left: 50px;
	}

	.contact-container{
		align-self: flex-end;
	}

	.foot{
		display: flex;
	}

	.foot-left{
		flex-direction: row;
	}

	.sc-image{
		height: 25px;
		width: 25px;
		background-color: white;
		margin:5px;
		padding:5px;
	}

	.sc-holder{
		display: flex; 
		justify-content: flex-end;
	}

/*--------------------infographic--------------------*/
	.infocontainer{
			max-width: 100%;
			border-color: #00866e;
			/*border-style: solid;*/
			border-width: 1px;
			padding: 20px;
			display: inline-block;
		}
		.infotitle{
			padding:10px;
			color: white;
			background-color: #00866e;
			font-family: 'Prophet', 'Verdana','sans-serif';
			font-weight: normal;
			font-style: normal;
			font-size: 28px;
			/*border-radius: 6px 6px 0 0;*/
		}
		.infocontent{
			padding: 10px;
			font-size: 15.75px;
			background-color: white;
			/*border-radius: 0 0 6px 6px ;*/
		}
		.infobox{
			/*border-color: #00866e;
			border-style: solid;
			border-width: 1px;
			border-radius: 10px;*/
			float: left;
		}
		.infothirdtohalf{
			width:31%;
			margin:1%; 
		}
		.infotwothirdtohalf{
			width: 64%;
			margin:1%;
		}

/*---------------------Small Desktop view------------*/

	@media screen and (min-width: 481px) and (max-width: 1024px) { /*small screens*/


		.coverage-item{
			min-height:  475px;
		}	

		.author-container {
			margin:10px;
			align-items: center;
		}
		.dont-display-small{
			display: none;
		}

		.hero-text{
			padding-left: 25px;
			padding-right:25px;
		}

		.page-content-holder{
			max-width:888px;
			margin:auto;
			padding: 0;
			width: 100%;
		}

		.element-holder{
			padding-left: 10px;
			padding-right: 10px;
		}

		.head-logo{
			width: 70%;
			margin: 10px;
		}

		.footer{
			padding:25px 10px;
		}

		.research-item{
			width: 51%;
		}

		.hero-clip {
		-webkit-clip-path: polygon(200px 0, 100% 0, 100% 100%, 0 100%, 0 120x);
		clip-path: polygon(200px 0, 100% 0, 100% 100%, 0 100%, 0 120px);
		}

	}

/*---------------------Mobile view-------------------*/

	@media screen and (max-width: 480px){ /*small phones*/
	

		.infothirdtohalf{
			width:98%;
			margin:1%; 
		}
		.infotwothirdtohalf{
			width: 98%;
			margin:1%;
		}

		.duo-holder{
			display: flex;
			flex-direction: column;
		}
		
		.director-holder{
			flex-direction: column;
		}

		.director-text{
			width: 100%; 
			padding: 5px;
		}

		.director-photo{
			width: 100%;
		}

		.member-outer{
			width: 50%;
			min-height: 350px;
		}

		.article-info{
			flex-direction: column;
		}

		.author-container {
			margin:10px;
			align-items: center;
		}

		.video{
			margin:10px;
		}

		.coverage-item{
			display: flex;
			flex-direction: column;
			padding:0 0 40px 0;
			min-height: 0;
		}

		.page-content-holder{
			width:100%;
			padding: 0;

		}

		.research-text h3{
			padding:0;
		}

		.research-item{
			width: 100%;
			padding-bottom: 40px; 
		}

		.research-holder{
		width: 100%;
		}

	/*	.element-holder{
			padding-left: 25px;
			padding-right: 25px;
		}*/

		h2{
			font-size: 32px;
		}

		h3{
			font-size: 22px;
		}

		body{
			font-size: 16px;
			
		}

		button{
			font-size: 16px;
			line-height: 140%;
			letter-spacing: 0.02em;
			padding:10px;
			min-width: 90px;
			margin: 5px;
		}

		.button{
			font-size: 16px !important;
		}

		#mce-EMAIL{
			font-size: 16px !important;
		
		}

		.head-logo{
			max-width: 30%;
			margin: 10px;
		}

		.footer{
			padding:25px;
		}

		.footer-inner{
			flex-direction: column;
		}

		.foot-left{
			flex-direction: column;
		}

		.link-list{
			padding: 10px;
			text-align: left !important;
		}

		.sc-holder{
			justify-content: flex-start;"
		}

		.element-holder{
			padding-left: 10px;
			padding-right:10px;
		}

		.hero-text{
			padding: 10px;
		}

		.hero-image{
			margin:10px;
		}

		.hero-column{
			margin:50px 0 25px 0;
		}

	/*	.hero-column h2{
			padding-bottom: 50px;
		}*/

		.hero-research-holder{
			flex-direction: column;
			padding-bottom: 40px;
		}

		.hero-research-left{
			width: 100%;
		}

		.hero-research-text{
			max-width: 100%;
		}

		.arrow-link-container{
			padding-top: 13px;
		}

		.hero-research-outer{
			max-width: 100%;
		}

		.hero-clip {
			-webkit-clip-path: polygon(145px 0, 100% 0, 100% 100%, 0 100%, 0 88px);
			clip-path: polygon(145px 0, 100% 0, 100% 100%, 0 100%, 0 88px);
		}

		.member-clip{
			-webkit-clip-path: polygon(85px 0, 100% 0, 100% 100%, 0 100%, 0 50px);
			clip-path: polygon(85px 0, 100% 0, 100% 100%, 0 100%, 0 50px);
	}

	}

/*--------------Mail Chimp subscribe button----------*/

	.arrow{
		background-image: url(images/arrow-big-darkgreen.png);
		background-repeat: no-repeat;
		background-position: bottom;
		background-size: contain;
		width:42px;
		height: 42px;
	}

	.mc-field-group{
		border-bottom: 1px solid #333333;
		max-width: 450px;
		width: 75%;
		margin-right: 20px;
	}

	.signup-holder{
		max-width: 600px;
		width: 100%;
		display: flex;
	}

	#mc_embed_signup_scroll{
		display: flex;
		width: 100%;
	}

	#mce-EMAIL{
		background-color: transparent;
		height: 33px;
		border: none;

		width: 100%;	

		font-family: 'NeueHaasNormal','Roboto', 'sans-serif';
		font-weight: normal;
		font-style: normal;
		font-size: 19px;
		letter-spacing: 0.02em;
	}

	.button{
		font-family: 'NeueHaasNormal','Roboto', 'sans-serif';
		background-color: transparent;
		color: #00866E;
		font-size: 19px;
		text-align: left;
		letter-spacing: 0.02em;
		height: 36px;
		max-width: 150px;
		padding: 0;
		border: none;
		cursor: pointer;
	}

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

	@media screen and (max-width: 850px) {

		.show-on-mobile{
			display: inherit;
		}

		.hide-on-mobile{
			display: none;
		}
	}