@font-face {
    font-family: 'Giorgio Sans Web';
    src: url('/includes/public/assets/fonts/giorgio/GiorgioSans-Black-Web.eot');
    src: url('/includes/public/assets/fonts/giorgio/GiorgioSans-Black-Web.eot?#iefix') format('embedded-opentype'),
         url('/includes/public/assets/fonts/giorgio/GiorgioSans-Black-Web.woff2') format('woff2'),
         url('/includes/public/assets/fonts/giorgio/GiorgioSans-Black-Web.woff') format('woff');
    font-weight: 800;
    font-style: normal;
    font-stretch: normal;
}

html, body {
    margin: 0;
    --giorgio: 'Giorgio Sans Web', sans-serif;
    --sofia: "sofia-pro", sans-serif;
}

p {
	font-family: var(--sofia);
	font-size: 20px;
	line-height: 1.4;
	color: #fef8e8;
}

.first-word,
.story-capitalized {
	font-family: var(--giorgio);
	font-size: 25px;
	text-transform: uppercase;
	letter-spacing: 2px;
}

.story-container a {
    color: #008CBA;
    text-decoration: none;
}

@media(hover:hover) {
    .story-container a:hover {
        color: #0078a0 !important;
        text-decoration: none;
    }
}


/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	p {
		font-size: 26px;
	}

	.first-word,
	.story-capitalized {
		font-size: 30px;
	}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {
	p {
		font-size: 24px;
		line-height: 1.8;
	}

	.first-word,
	.story-capitalized {
		font-size: 38px;
		line-height: 44px;
	}
}

/* magnific/foundation button color conflict fix */
.mfp-iframe-holder .mfp-close { background-color: transparent; }


.story-page {
	overflow: hidden;
}

.story-header {
	position: relative;
	width: 100%;
	height: 600px;
}
	.story-header .top-position {
		visibility: hidden;
		width: 0;
		height: 0;
	}

	.story-header header {
		display: block;
		margin: 0 auto;
		padding: 20px;
		position: relative;
	}
		.story-header header .logo {
			display: inline-block;
			width: 167px;
			height: 58px;
			background-image: url('/includes/public/assets/shared/main-logo.svg');
			background-size: cover;
			background-repeat: no-repeat;
			background-position: center center;
		}

		.story-header header .story-nav-wrapper {
			margin: 0 auto;
			text-align: center;
		}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-header {
		height: 650px;
	}
		.story-header header {
			padding: 20px 30px;
		}
			.story-header header .story-nav-wrapper {
				margin: 10px auto 0;
				text-align: center;
			}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {
	.story-header {
		height: 800px;
	}
		.story-header header {
			max-width: 1200px;
			padding: 30px 60px;
		}
			.story-header header .logo {
				position: absolute;
			}

			.story-header header .story-nav-wrapper {
				max-width: 500px;
			}
}


.story-header .hero {
	display: flex;
	width: 100%;
	height: 100%;
	position: absolute;
	top: 0;
	left: 0;
	right: 0;
	bottom: 0;
	content: '';
	flex-direction: column;
	justify-content: center;
	align-items: center;
	background-position: center center;
	background-repeat: no-repeat;
	background-size: cover;
}
	.story-header .hero::after {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		content: '';
	}
		.story-header.transparent .hero::after {
			display: none;
		}

		.story-header.red .hero::after {
			background-color: #f45848;
			opacity: 0.4;
		}

		.story-header.blue .hero::after {
			background-color: #0a3c4e;
			opacity: 0.7;
		}

		.story-header.yellow .hero::after {
			background-color: #f8e08e;
			opacity: 0.3;
		}

		.story-header.black .hero::after {
			background-color: #252525;
			opacity: 0.5;
		}

		.story-header.cream .hero::after {
			background-color: #fef8e8;
			opacity: 0.4;
		}

	.story-header .hero .inner {
		margin-top: 20px;
		text-align: center;
		z-index: 1;
	}

	.story-header.has-nav .hero .inner {
		margin-top: 270px;
	}

	.story-header .hero .inner h1 {
		margin: 0 auto 10px;
		font-family: var(--giorgio);
		font-size: 50px;
		line-height: 0.8;
		letter-spacing: .25px;
		text-transform: uppercase;
		color: #fef8e8;
	}
		.story-header.interior .hero .inner h1 {
			text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
		}

	.story-header .hero .inner p {
		margin-bottom: 0;
		font-family: var(--sofia);
		font-size: 20px;
		line-height: 1.4;
		font-weight: 300;
		color: #f45848;
	}
		.story-header.interior .hero .inner p {
			color: #fef8e8;
			text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
		}

	.story-header .hero .inner .author {
		display: none;
	}
		.story-header.interior .hero .inner .author {
			display: block;
			margin-top: 45px;
			font-family: var(--sofia);
			font-size: 20px;
			line-height: 1.4;
			color: #fef8e8;
			text-shadow: 2px 2px 8px rgba(0, 0, 0, 0.7);
		}

	.story-header.text-yellow .hero .inner h1,
	.story-header.text-yellow .hero .inner p,
	.story-header.interior.text-yellow .hero .inner .author {
		color: #f8e08e;
	}

	.story-header.text-red .hero .inner h1,
	.story-header.text-red .hero .inner p,
	.story-header.interior.text-red .hero .inner .author {
		color: #f45848;
	}

	.story-header.text-cream .hero .inner h1,
	.story-header.text-cream .hero .inner p,
	.story-header.interior.text-cream .hero .inner .author {
		color: #fef8e8;
	}

	.story-header.text-blue .hero .inner h1,
	.story-header.text-blue .hero .inner p,
	.story-header.interior.text-blue .hero .inner .author {
		color: #0a3c4e;
	}

	.story-header.text-black .hero .inner h1,
	.story-header.text-black .hero .inner p,
	.story-header.interior.text-black .hero .inner .author {
		color: #252525;
	}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-header .hero .inner,
	.story-header.has-nav .hero .inner {
		margin-top: 20px;
		max-width: 600px;
	}

	.story-header .hero .inner h1 {
		font-size: 80px;
	}

	.story-header .hero .inner p {
		font-size: 24px;
		line-height: 1.2;
	}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {

}


.story-two-col {
	padding: 40px 20px;
}
	.story-two-col .left-col {
		flex: 2;
	}

	.story-two-col .right-col {
		flex: 2;
	}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-two-col {
		display: flex;
		justify-content: space-between;
		padding: 60px 30px 20px;
		margin-bottom: 20px;
	}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {
	.story-two-col {
		padding: 80px 80px 20px;
	}
}


.story-footer {
	position: relative;
	width: 100%;
	background-color: #0a3c4e;
}
	.story-footer .backtotop {
		height: 125px;
		position: relative;
		text-align: center;
		line-height: 0;
	}
		.story-footer.red .backtotop {
			background-color: #f45848;
		}

		.story-footer.yellow .backtotop {
			background-color: #f8e08e;
		}

		.story-footer.blue .backtotop {
			background-color: #0a3c4e;
		}

		.story-footer.cream .backtotop {
			background-color: #fef8e8;
		}

		.story-footer .backtotop .topper {
			display: inline-block;
			position: absolute;
			left: 50%;
			bottom: 0;
			transform: translate(-50%, 0);
			cursor: pointer;
            text-decoration: none;
		}
			.story-footer .backtotop .topper::after {
				display: block;
				content: '';
				border-style: solid;
				border-width: 0 63px 53px 63px;
				border-color: transparent transparent #66c8c8 transparent;
			}

			.story-footer .backtotop .topper span {
				position: relative;
				top: 40px;
				text-transform: uppercase;
				color: #0a3c4e;
				font-size: 15px;
				font-family: var(--sofia);
				line-height: 1;
			}

	.story-footer footer {
		display: block;
		min-height: 150px;
		margin: 0 auto;
		padding: 45px 30px;
		position: relative;
	}
		.story-footer .footer-left {
			margin-left: 110px;
			font-family: var(--sofia);
			font-size: 15px;
			line-height: 1.4;
			color: #547783;
			font-weight: 300;
			text-transform: uppercase;
		}
			.story-footer .footer-left p {
				color: inherit;
				font-size: inherit;
				font-family: inherit;
				line-height: inherit;
			}

		.story-footer .footer-right {
			margin-top: 18px;
		}

		.story-footer .logo {
			display: inline-block;
			width: 73px;
			height: 80px;
			float: left;
			background-image: url('/includes/public/assets/shared/main-logo-02.svg');
			background-size: cover;
			background-repeat: no-repeat;
			background-position: center center;
		}

		.story-footer .copyright-text {
			text-align: center;
			font-family: var(--sofia);
			font-size: 15px;
			line-height: 1.4;
			font-weight: 300;
			color: #547783;
		}
			.story-footer .copyright-text p {
				font-family: inherit;
				font-size: inherit;
				line-height: inherit;
				color: inherit;
			}

		.story-footer .footer-social {
			text-align: center;
			margin-bottom: 30px;
		}
			.story-footer .footer-social ul {
				margin: 0;
				padding: 0;
				list-style: none;
			}
				.story-footer .footer-social ul > li {
					display: inline-block;
					margin-right: 10px;
				}
					.story-footer .footer-social ul > li:last-child {
						margin-right: 0;
					}

					.story-footer .footer-social ul > li > a {
						font-size: 30px;
						line-height: 1;
						color: #f8e08e;
					}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-footer .backtotop {
		height: 150px;
	}

	.story-footer footer {
		max-width: 1200px;
		padding: 35px 60px;
	}
		.story-footer .footer-left {
			max-width: 340px;
			margin: 20px 0 0 90px;
		}

		.story-footer .copyright-text {
			text-align: right;
		}

		.story-footer .footer-social {
			text-align: right;
			margin-bottom: 0;
		}
			.story-footer .footer-social ul > li > a {
				font-size: 20px;
			}

            .story-footer .footer-row {
                display: grid;
                grid-template-columns: repeat(2, minmax(0, 1fr));
            }
        
            .story-footer .footer-right {
                display: grid;
            }
        
            .story-footer .footer-right .footer-social ul {
                justify-content: flex-end;
            }
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {

}


ul.story-nav {
	margin: 0;
	padding: 0;
	list-style: none;
}
	ul.story-nav > li {
		display: inline-block;
		margin-right: 0;
		line-height: 1;
	}
		ul.story-nav > li:last-of-type {
			margin-right: 0;
		}

		ul.story-nav > li > a {
			display: inline-block;
			padding: 0;
			font-family: var(--sofia);
			font-size: 15px;
			color: #fef8e8;
			letter-spacing: 2.2px;
			text-transform: uppercase;
			border-bottom: 1px solid transparent;
            text-decoration: none;
		}

		ul.story-nav > li:hover > a,
		ul.story-nav > li.is-active > a {
			color: #f45848;
			border-bottom: 1px solid #fff;
		}

		.link-color-blue ul.story-nav > li:hover > a,
		.link-color-blue ul.story-nav > li.is-active > a {
			color: #0a3c4e;
		}

		.link-color-yellow ul.story-nav > li:hover > a,
		.link-color-yellow ul.story-nav > li.is-active > a {
			color: #f8e08e;
		}

		.link-color-cream ul.story-nav > li:hover > a,
		.link-color-cream ul.story-nav > li.is-active > a {
			color: #fef8e8;
		}

		.link-color-black ul.story-nav > li:hover > a,
		.link-color-black ul.story-nav > li.is-active > a {
			color: #252525;
		}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	ul.story-nav > li {
		line-height: unset;
		margin-right: 30px;
	}

	ul.story-nav > li > a {
		font-size: 11px;
		padding: 5px;
	}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {

}


.story-container {
	position: relative;
}
	.story-container .background-cont {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		overflow: hidden;
	}

	.story-container .background-image {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		content: '';
		background-repeat: no-repeat;
		background-position: top left;
		background-size: cover;
	}
		.story-container .background-image.blur {
			filter: blur(8px);
			-webkit-filter: blur(8px);
			-moz-filter: blur(8px);
			-o-filter: blur(8px);
			-ms-filter: blur(8px);
            transform: scale(1.03);
		}

	.story-container .background-color {
		display: block;
		width: 100%;
		height: 100%;
		position: absolute;
		top: 0;
		left: 0;
		right: 0;
		bottom: 0;
		content: '';
	}
		.story-container.overlay .background-color {
			opacity: 0.9;
		}

		.story-container.red .background-color {
			background-color: #f45848;
		}

		.story-container.blue .background-color {
			background-color: #0a3c4e;
		}

		.story-container.cream .background-color {
			background-color: #fef8e8;
		}

		.story-container.yellow .background-color {
			background-color: #f8e08e;
		}

		.story-container.black .background-color {
			background-color: #252525;
		}

	.story-container > .content {
		display: block;
		position: relative;
		color: #fef8e8;
	}
		.story-container.text-red > .content,
		.story-container.text-red > .content h1,
		.story-container.text-red > .content h2,
		.story-container.text-red > .content h3,
		.story-container.text-red > .content p {
			color: #f45848;
		}

		.story-container.text-blue > .content,
		.story-container.text-blue > .content h1,
		.story-container.text-blue > .content h2,
		.story-container.text-blue > .content h3,
		.story-container.text-blue > .content p {
			color: #0a3c4e;
		}

		.story-container.text-cream > .content,
		.story-container.text-cream > .content h1,
		.story-container.text-cream > .content h2,
		.story-container.text-cream > .content h3,
		.story-container.text-cream > .content p {
			color: #fef8e8;
		}

		.story-container.text-yellow > .content,
		.story-container.text-yellow > .content h1,
		.story-container.text-yellow > .content h2,
		.story-container.text-yellow > .content h3,
		.story-container.text-yellow > .content p {
			color: #f8e08e;
		}

		.story-container.text-black > .content,
		.story-container.text-black > .content h1,
		.story-container.text-black > .content h2,
		.story-container.text-black > .content h3,
		.story-container.text-black > .content p {
			color: #252525;
		}

		.story-container.controlled > .content {
			width: 100%;
			margin: 0 auto;
		}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-container.controlled > .content {
		max-width: 1200px;
	}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {

}


.story-imagebox {
	padding: 40px 20px;
	position: relative;
}
	.story-imagebox.is-right {
		flex-direction: row-reverse;
	}

	.story-imagebox .image-cont {
		position: relative;
		top: -80px;
		z-index: 1;
	}
		.story-imagebox .image-cont img {
			border: 10px solid transparent;
		}

		.story-imagebox.cream .image-cont img {
			border-color: #fef8e8;
		}

		.story-imagebox.red .image-cont img {
			border-color: #f45848;
		}

		.story-imagebox.yellow .image-cont img {
			border-color: #f8e08e;
		}

		.story-imagebox.blue .image-cont img {
			border-color: #0a3c4e;
		}

	.story-imagebox .content {
		padding-top: 35px;
		font-family: var(--sofia);
		font-size: 20px;
		line-height: 1.5;
		position: relative;
		top: -50px;
	}
		.story-imagebox .content p {
			margin-bottom: 0;
			font-family: inherit;
			font-size: inherit;
			line-height: inherit;
			color: inherit;
		}

		.story-imagebox.text-cream .content p {
			color: #fef8e8;
		}

		.story-imagebox.text-red .content p {
			color: #f45848;
		}

		.story-imagebox.text-yellow .content p {
			color: #f8e08e;
		}

		.story-imagebox.text-blue .content p {
			color: #0a3c4e;
		}

		.story-imagebox.text-black .content p {
			color: #252525;
		}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-imagebox {
		display: flex;
		padding: 55px 55px 70px;
		justify-content: space-evenly;
	}
		.story-imagebox .image-cont {
			top: -110px;
			margin-right: 40px;
		}

		.story-imagebox.is-right .image-cont {
			margin-right: 0;
			margin-left: 40px;
		}

	.story-imagebox .content {
		max-width: 350px;
		font-size: 26px;
		line-height: 1.6;
		top: 0;
	}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {
	.story-imagebox {
		display: flex;
		padding: 70px 70px 80px;
		justify-content: space-evenly;
	}
		.story-imagebox .image-cont {
			top: -140px;
			margin-right: 50px;
		}

		.story-imagebox.is-right .image-cont {
			margin-right: 0;
			margin-left: 50px;
		}

	.story-imagebox .content {
		max-width: 550px;
		font-size: 28px;
		line-height: 1.8;
	}
}


.story-quote {
	position: relative;
}
	.story-quote p {
		margin-bottom: 0;
		max-width: 90%;
		padding-top: 60px;
		font-family: 'Shift', serif;
		font-weight: 500;
		font-size: 50px;
		line-height: .8;
		color: #fef8e8;
	}
		.story-quote p::before {
			display: inline-block;
			position: absolute;
			top: 0;
			left: -10px;
			font-family: impact, helvetica, arial, sans-serif;
			font-size: 210px;
			line-height: 0.8;
			color: #fef8e8;
			content: '\201c';
		}
			.story-quote.yellow p::before {
				color: #f8e08e;
			}
			.story-quote.red p::before {
				color: #f45848;
			}
			.story-quote.cream p::before {
				color: #fef8e8;
			}
			.story-quote.blue p::before {
				color: #0a3c4e;
			}
			.story-quote.black p::before {
				color: #252525;
			}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-quote span {
		left: -3px;
	}

	.story-quote p {
		max-width: 100%;
		margin-left: 80px;
		padding-top: 0;
		font-size: 46px;
		line-height: 1;
	}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {
	.story-quote p {
		margin-left: 90px;
		font-size: 54px;
		line-height: 1.2;
	}
}


.story-content {}
	.story-content .image-cont {}
		.story-content .image-cont img {
			width: 100%;
		}

	.story-content .content {
		justify-content: start;
	}
		.story-content.is-right .content {
			justify-content: end;
			text-align: right;
		}

		.story-content .content .inside {
			padding: 40px 20px 60px;
			position: relative;
			background-color: #f8e08e;
		}
			.story-content.red .content .inside {
				background-color: #f45848;
			}

			.story-content.yellow .content .inside {
				background-color: #f8e08e;
				color: #0a3c4e;
			}

			.story-content.blue .content .inside {
				background-color: #0a3c4e;
				color: #fef8e8;
			}

			.story-content .content p {
				font-family: var(--sofia);
				font-size: 20px;
				line-height: 1.4;
			}
				.story-content .content p:last-of-type {
					margin-bottom: 0;
				}

				.story-content.text-red .content p,
				.story-content.text-red .content h1,
				.story-content.text-red .content h2,
				.story-content.text-red .content h3,
				.story-content.text-red .content h4 {
					color: #f45848;
				}

				.story-content.text-red .content p,
				.story-content.text-red .content h1,
				.story-content.text-red .content h2,
				.story-content.text-red .content h3,
				.story-content.text-red .content h4 {
					color: #fef8e8;
				}

				.story-content.text-yellow .content p,
				.story-content.text-yellow .content h1,
				.story-content.text-yellow .content h2,
				.story-content.text-yellow .content h3,
				.story-content.text-yellow .content h4 {
					color: #f8e08e;
				}

				.story-content.text-blue .content p,
				.story-content.text-blue .content h1,
				.story-content.text-blue .content h2,
				.story-content.text-blue .content h3,
				.story-content.text-blue .content h4 {
					color: #0a3c4e;
				}

				.story-content.text-black .content p,
				.story-content.text-black .content h1,
				.story-content.text-black .content h2,
				.story-content.text-black .content h3,
				.story-content.text-black .content h4 {
					color: #252525;
				}

/* Tablet: 641+ */
@media only screen and (min-width: 40.063em) {
	.story-content .content {
		display: flex;
		margin-bottom: -130px;
	}
		.story-content .content .inside {
			padding: 40px;
			padding-bottom: 150px;
			background-color: #f8e08e;
			width: 90%;
			position: relative;
			top: -70px;
			z-index: 1;
		}
			.story-content .content p {
				font-size: 26px;
				line-height: 1.8;
			}
}

/* Desktop: 1025+ */
@media only screen and (min-width: 64.063em) {
	.story-content .content .inside {
		padding: 75px;
		padding-bottom: 150px;
		width: 80%;
	}
		.story-content .content p {
			font-size: 28px;
			line-height: 1.8;
		}
}