@import url('https://fonts.googleapis.com/css2?family=EB+Garamond:ital,wght@0,400..800;1,400..800&family=Roboto+Condensed:ital,wght@0,100..900;1,100..900&family=Roboto:ital,wght@0,100..900;1,100..900&display=swap');

@charset "UTF-8";

/* FOR GREATER PURPOSE */
			
footer{margin-top:0;background-color:#00205c;}
footer .footerlist ul li:before{display:none;}
footer ul.social.horizontal li a{color:#00205c;background-color:rgba(255, 255, 255, 0.8);}
@media only screen and (min-width: 960px){footer .footerlist{margin-top:0;}}
		
/*annimation*/
@keyframes bounce {
	0%, 20%, 50%, 80%, 100% {transform: translateY(0);}
	40% {transform: translateY(-10px);}
	60% {transform: translateY(-5px);}
}
			
.fgp-pillar-image{
	overflow: hidden;
	z-index:-1;
}
.fgp-pillar-image img {
	width: 100%;
	min-height: 450px;
	object-fit: cover;
	transition: transform .8s ease-in-out;
}
.fgp-pillar-image img:hover {transform: scale(1.04);}
			
/*	.slide-in {
	opacity: 0;
	transform: translateY(100px);
	transition: all 2.1s cubic-bezier(0.25, 0.46, 0.45, 0.94);
}
.slide-in.visible {
	opacity: 1;
	transform: translateX(0);
}	*/

.fade-in {
	opacity: 0;
	transform: translateY(50px);
	transition: all 1.8s ease;
}
.fade-in.visible {
	opacity: 1;
	transform: translateY(0);
}	

/*impact*/
.fgp-impact{}
.fgp-impact-img{
	height:75vh;
	height:75dvh;
}
@media (min-aspect-ratio: 3/2) and (max-height: 1150px){
	.fgp-impact-img{height:78vh;height:78dvh;object-position: center -30px;}
}

.fgp-title{
	display: flex;
	flex-direction: column;
	align-items: center;
	justify-content: center;
	width: 100%;
	height: 16vh;
	height: 16dvh;
	margin-top: -16vh;
	margin-top: -16dvh;
}
.fgp-title:before{
	content: '';
	width: 100%;
	height: 100%;
	background: #00205cCC;
	z-index: 1;
}
.fgp-title img{
	width: calc(100% - 80px);			
	height: calc(16vh - 60px);
	height: calc(16dvh - 60px);
	padding: 30px 40px;
	margin-top: -16vh;
	margin-top: -16dvh;
	z-index: 2;
}
.fgp-intro{
	width: 100%;
	padding: 50px 10px 40px 10px;
	background: #fff;
}
			
/*pillar*/
.fgp-pillar{
	display: flex;
	flex-direction: column;
	justify-content: center;
	z-index: 1;
}
.fgp-pillar-main{
	flex: 1;
	width: 90%;
	margin: -4% 5% 2.5% 5%;
	z-index: 1;
}
.fgp-pillar-feature{
	flex: 1;
	width: 90%;
	margin: 2.5% 5% 10% 5%;
	z-index: 1;
}
.fgp-pillar-feature a.linkblock {
	color: inherit;
	text-decoration: none;
}
@keyframes oscillate {
	0% { transform: translateX(0); }
	50% { transform: translateX(+5px); }
	100% { transform: translateX(0); }
}
.fgp-pillar-feature a:hover p:last-of-type, .fgp-pillar-feature a:focus p:last-of-type {
	animation: oscillate 0.8s ease-in-out infinite alternate;
}
			
		/*highlight-facts*/
			.fgp-highlight{
				display:flex;
				justify-content:center;
				width:100%;
				height:450px;
				background-size:cover;
				background-position:center center;
			}
			.fgp-highlight:before{
				position: absolute;
				content: '';
				width: 100%;
				height: 450px;
				background: rgba(0, 32, 92, 0.88);
			}
			.fgp-highlight-content {z-index:1;}
			
		/*quiz*/
			.fgp-down-arrow span, .fgp-down-arrow svg{
				color: #c75000;
				transform: translateX(-50%);
			    animation: bounce 2s ease infinite;
			}
			
		/*voices*/
			.fgp-voices-container{
			}
			.fgp-voices-row{
				display: grid;
				grid-template-columns: repeat(auto-fit, minmax(auto, 350px));
				gap: 20px;
				padding: 10px 40px;
				justify-content: center;
			}
			.fgp-voice{
				display: flex;
				flex-direction: column;
				flex: 1;
				padding: 20px 20px 28px 20px;
				background-color: #d6e5ee;
				border-radius: 20px;
				transition: transform 0.3s ease, box-shadow 0.3s ease;
			}
			.fgp-voice a {
				text-decoration: none;
				color: inherit;
			}
			.fancybox-content{
				max-height: 85vh;
				max-height: 85dvh;
			}
			.fgp-voice .button.pill, .fgp-voice .button.pill a{
				max-width: none !important;
				width: auto !important;
			}
			.fgp-voice .button.pill a{
				padding: 8px 15px;
				font-family: "Roboto Condensed", "Roboto", sans-serif !important;
				font-optical-sizing: auto;
				font-size: 1em;
				font-weight: 500;
				letter-spacing: 0;
				text-align: center;
				text-transform: none;
				border-radius: 15px;
			}
			.fgp-voice .button.transparent a{
				color: #00205c !important;
				background-color: transparent;
				border-color: #00205c !important;
			}
			.fgp-voice .button.transparent a:hover,.fgp-voice .button.transparent a:focus{
				color: #fff !important;
				background-color: #0078b0;
				border-color: #0078b0 !important;
			}
			
@media (min-width: 700px) {
	.fgp-voices-row{
		grid-template-columns: repeat(2, 1fr);
		padding: 10px 20px;
	}
	.fgp-voice:hover,.fgp-voice:focus-within {
		transform: scale(1.05);
		box-shadow: 0 10px 20px rgba(0, 0, 0, 0.12);
	}
}
@media (min-width: 1024px) {
	.fgp-voices-row {
		grid-template-columns: repeat(4, 1fr);
	}
}
			
			
		/*social/vertical video*/

			
		/*video ----- OLD REMOVE...
			.fgp-video{
				height: 800px;
				margin-bottom: 1px;
			}
			.fgp-video:before{
				height: 800px;
			}
			.fgp-play{
				color: #fff !important;
				font-size: clamp(60px, 3.5vw + 1rem, 90px) !important;
				border-color: #fff !important;
			}
			.fgp-play:hover svg{
				background-color: #0078b0;
				border-radius: 50%;
			}
			*/
			
		/*text*/
			article p{
				color: #191919;
				font-family: "Roboto", "PT Sans", sans-serif;
			}
			
			p.fgp-main-text{
				color: #00205c;
				font-family: "EB Garamond", Palatino, serif !important;
				font-size: clamp(22px, 3.5vw + 1rem, 26px) !important;
				font-optical-sizing: auto;
				font-weight: 400;
			}
			h2.fgp-pillar-heading{
				color: #00205c;
				font-family: "EB Garamond", Palatino, serif !important;
				font-size: clamp(52px, 3.5vw + 1rem, 68px) !important;
				font-optical-sizing: auto;
				font-weight: 400 !important;
			}
			h2.fgp-pillar-heading:before{
				content: url('/for-greater-purpose/images/fgp-arrow.svg') !important;
				width: 50px !important;
				height: 105px !important;
				background-color: transparent !important;
				transform: translateX(-50%);
			    animation: bounce 2s ease infinite;
			}
			h2.fgp-highlight-heading{		
				font-family: "EB Garamond", Palatino, serif !important;
				font-size: clamp(42px, 3.5vw + 1rem, 54px) !important;
				font-optical-sizing: auto;
				font-weight: 400 !important;
			}
			h2.fgp-highlight-heading:before{display:none !important;}
			.fgp-pillar-feature h3{
				margin-top: 25px;
				font-family: "EB Garamond", Palatino, serif !important;
				font-optical-sizing: auto;
				font-size: clamp(26px, 3.5vw + 1rem, 32px) !important;
				font-weight: 600 !important;
			}
			.fgp-pillar-feature p{}
			.fgp-pillar-feature img{
				max-width: 75% !important;
				background: #fff;
				border-right: 5px solid #fff;
				border-left: 20px solid #c75000;
			}
			
			.centertext-block {margin:0 6%;}
			
		/*button*/
			article .button.fgp{width:100%;}
			article .button.fgp a{
				padding: .8em 5%;
				color: #fff !important;
				font-family: "Roboto Condensed", "Roboto", sans-serif !important;
				font-optical-sizing: auto;
				/*font-size: clamp(26px, 3.5vw + 1rem, 32px) !important;*/
				/*font-weight: 400 !important;*/
				background-color: transparent;
				border-color: #fff !important;
			}
			
			article .button.fgp.orange a{background-color: #c75000;}

			article .button.fgp.white a{
				color: #00205c !important;
				background-color: #fff;
				border-color: #00205c !important;
			}
			article .button.fgp a:hover, article .button.fgp a:focus{
				color:#fff !important;
				background-color:#0078b0 !important;
				border-color:#0078b0 !important;
			}
			
			
@media (min-width: 765px) {
	.fgp-intro{padding: 50px 40px 40px 40px;}
	.centertext-block {max-width:800px;margin:0 auto;}
	.fgp-pillar{flex-direction: row;}
	.fgp-pillar-main{
		width: 50%;
		max-width: 750px;
		margin: -3% 5% 5% 5%;
	}
	.fgp-pillar-feature{
		width: 30%;
		max-width: 550px;
		margin: -5% 5% 8% 5%;
	}
	.fgp-pillar-feature img{max-width: 100% !important;padding-top: 5px;}
}
@media (min-width: 1200px) {
	.fgp-intro{padding: 60px 40px 50px 40px;}
	.fgp-intro .fgp-main-text{display:flex;}
	.fgp-intro .fgp-main-text:first-of-type:before{
		display: block;
		content: url('/for-greater-purpose/images/fgp-impact-sketched-arrow.svg');
		width: 200px;
		height: 270px;
		margin-top: -100px;
		margin-right: -200px;
		z-index: 3;
		order: 2;
	}
}