/**
 * Page title banner specific styles
 * 
 */

/** General */

	.page-title-banner:nth-last-child( 1 ) {
		margin: 5em 0;
	}

	.page-title-banner {
		max-width: 100%;
		overflow: hidden;
		color: #fff;
		text-align: center;
		background-color: #2f4c67;
		box-sizing: border-box;
		padding: 0;
		position: relative;
	}
	.page-title-banner.blog-banner {
		margin-top: -1em;
	}

	.page-title-banner > div.owl-stage-outer,
	.page-title-banner > div.owl-stage-outer > div,
	.page-title-banner > div.owl-stage-outer > div > div,
	.page-title-banner > div.owl-stage-outer > div > div > div.item { 
		height: 100%;
	}

		#click-overlay {
			position: absolute;
			top: 0;
			left: 0;
			width: 100%;
			height: 100%;
			z-index: 3;
		}
		
		.page-title-banner img#featured-image {
			position: absolute;
			z-index: 1;
			right: 15%;
			width: auto;
			height: 100%;
		}

		.page-title-banner .item {
			min-height: 100px;
			width: 100%;
			padding: 1.5em 0;
			overflow: hidden;
			display: flex;
			align-items: center;
			position: relative;
			background-position: right; 
			background-size: cover;
			background-repeat: no-repeat;
		}
		.page-title-banner.blog-banner .item h1,
		.page-title-banner.blog-banner .item h4 {
			max-width: inherit;
			text-align: center;
		}
		.page-title-banner.blog-banner .item .taxonomy-description p {
			max-width: inherit;
			color: #FFF;
			font-size: .8em;
			text-align: center;
		}
		.page-title-banner.blog-banner .item .taxonomy-description p:last-child {
			margin-bottom: 0;
		}

		/* .page-title-banner.homepage-banner div.owl-stage-outer div div div.item, */
		.page-title-banner.homepage-banner .item {
			height: 700px;
		}

			.page-title-banner .caption {
				width: 100%;
				height: 100%;
				display: flex;
				align-items: center;
				justify-content: center;
				z-index: 2;
				text-align: center;
				color: #fff;
			}

				.page-title-banner .container {
					display: block;
					width: 1200px;
					padding: 0;
				}
				section.include-nav.page-title-banner .container {
					padding-left: 40px;
					padding-right: 40px;
				}

					.flexible-content.page-title-banner h1 {
						font-family: goudy-old-style, serif;
						line-height: 1;
						margin: 0;
						font-weight: 500;
						font-size: 2em;
						color: #fff;
					}

					.flexible-content.page-title-banner .title {
						text-align: left;
						color: #fff;
						margin: 0;
						font-weight: 700;
						font-size: 2em;
					}

					.page-title-banner .subtitle {
						text-align: left;
						font-family: 'DM Sans', sans-serif;
						font-size: 1.6em;
					    margin: .3em 0 .5em;
						font-weight: 500;
						color: #fff;
						width: 60%;
					}

					.page-title-banner .text {
						font-size: 1.2em;
						text-align: left;
						font-weight: 400;
						margin: .4em 0;
						width: 60%;
					}


					.page-title-banner p {
						margin: 1em 0;
						font-size: 1em;
						font-weight: 400;
					}

					.flexible-content.page-title-banner h1,
					.page-title-banner h4,
					.page-title-banner p {
						text-align: left;
						text-shadow: 1px 1px 50px rgba(0,0,0,0.5);
					}

					.flexible-content.page-title-banner h1,
					.page-title-banner h4,
					.page-title-banner p {
						max-width: 800px;
					}

					.flexible-content.page-title-banner .caption .buttons {
						justify-content: flex-start;
					}

						.flexible-content.page-title-banner .caption .buttons > a {
							padding: 1em 1.5em;
							font-size: 1em;
							background-color: #dc561a;
						}

			.page-title-banner .overlay {
				position: absolute;
				width: 100%;
				height: 100%;
				z-index: 1;
				background: rgb(158 158 158 / 40%);
				top: 0;
				left: 0;
			}


/** Banner Pagination */
	.page-title-banner.include-pagination .owl-dots {
		text-align: center;
		height: 16px;
		position: absolute;
		margin: 0;
		bottom: 1em;
		left: 0;
		width: 100%;
	}
	
	.page-title-banner.include-pagination .owl-dot {
		border: 4px solid #FFF;
		background-color: transparent;
		width: 15px;
		height: 15px;
		border-radius: 50%;
		display: inline-block;
		margin: 0 5px;
	}

	.page-title-banner.include-pagination .owl-dot.active {
		border-color: #FFF;
		background: #FFF;
	}


/** Owl Carousel Nav */
	.page-title-banner.owl-carousel.include-nav {
		height: 450px	;
		padding: 0;
	}
	
	.page-title-banner.owl-carousel .owl-prev {
		background-image: url('/images/icons/arrow-left.svg');
	}

	.page-title-banner.owl-carousel .owl-next {
		background-image: url('/images/icons/arrow-right.svg');
	}


/** Responsive */
	@media only screen and (max-width: 900px) {

		.page-title-banner img#featured-image {
			right: 5%;
		}

		.flexible-content.page-title-banner .caption .buttons {
			flex-direction: row;
		}
		
	}

	@media only screen and (max-width: 768px) {

		/* .page-title-banner.homepage-banner div.owl-stage-outer div div div.item, */
		.page-title-banner.homepage-banner .item {
			height: 500px
		}
		
		.page-title-banner .item {
			height: unset;
		}

			.flexible-content.page-title-banner h2 {
				font-size: 28px;
			}

			.flexible-content.page-title-banner h1 {
				font-size: 2.5em;
			}

			.page-title-banner h4 {
				font-size: 1.6em;
				width: 65%;
				margin-top: .5em;
				text-transform: none;
				font-weight: 500;
			}

			.page-title-banner p {
				width: 65%;
			}

			.page-title-banner .button {
				font-size: 14px;
				padding: 0.5em 1.2em;
				line-height: 1;
			}

	}

	@media only screen and (max-width: 500px) {

		.page-title-banner .container {
			margin-left: 1em;
		}

		.page-title-banner img#featured-image {
			height: 75%;
			bottom: 0;
			right: -20px;
		}

		section.include-nav.page-title-banner .container {
			padding: 0 1em;
			margin: 0;
			height: 100%;
		}

		.flexible-content.page-title-banner h1 {
			line-height: 1;
		}

		.flexible-content.page-title-banner .caption .buttons {
			margin-top: 2em;
		}

		.flexible-content.page-title-banner h1 {
			font-size: 2.2em;
		}

		.page-title-banner .subtitle {
			width: 100%;
			font-size: 1.2em;
			margin-top: .8em;
		}

		.page-title-banner .text {
			width: 100%;
		}

	}