#billboard-carousel {

	img{margin: 0;}

	.carousel-control-prev {width: 45px;}
	.carousel-control-next {width: 45px;}

	.carousel-control-prev, .carousel-control-next {
		top: 50%;
		transform: translate(-50%, -50%);
		height: 45px;
	}

	.carousel-indicators {
		position: absolute;
		width: 100%;
		margin: 0;
		top: calc( 100vw / 16 * 9);
		bottom: auto;

		img {
			height: 50px;
			overflow: hidden;
			display: block;
			width:auto;
			max-width:100%;
		}
		li {
			height: 50px;
			max-width: 100px;
			width:auto;
			border: none;
			box-shadow: 1px 3px 5px 0px rgba(0,0,0,0.75);

			&.active {
				border-bottom: 4px solid #fff;
			}
		}
	}

	.billboard-caption {
		background: var(--white);
		padding: 1rem;
		
		.title {
			margin-top: calc(5vw + 50px);
			text-transform: uppercase;
			font-weight: 900;
			font-size: 2rem;
		}

		.subtitle {
			font-weight: 600;
			color: var(--navy);
		}
		
		.billboard-airinfo {
			font-weight: 900;
			color: var(--navy);
		}

		.billboard-link {
			font-weight: 600;
			font-style: italic;
		}

		li{margin: 1rem 0;}
	}
	.billboard-image-wrapper{
		.billboard-link {
			display:block;

			& > div{
				background-repeat: no-repeat;
				background-position: top center;
				background-size: cover;
				width: 100%;
				height:100%;
			}
		}
	}
}

@media (min-width: 769px) {
	#billboard-carousel .billboard-caption .title {
		margin-top: calc(4vw + 50px);
	}
}

@media (min-width: 1200px) {
	#billboard-carousel {
		position: relative;
		margin: 2rem 0;
		overflow:hidden;

		a {
			outline: none !important;
		}

		.carousel-control-prev {margin-left: 310px;}
		.carousel-control-prev, .carousel-control-next {
			top: 50%;
			opacity: 0;
			transition: opacity 0.5s;
		}

		.carousel-indicators {
			bottom: 1rem;
			top: auto;

			img {
				height: 50px;
				width: 100%;
			}

			li {
				height: 50px;
				width: 100%;
				border: none;
				box-shadow: 1px 3px 5px 0px rgba(0,0,0,0.75);

				&.active {border-bottom: 4px solid #fff;}
			}
		}

		.carousel-item {
			&:hover {
				.carousel-control-prev, .carousel-control-next {
					opacity: 1;
					transition: opacity 0.25s;
				}
			}
		}

		.billboard-row{
			display:grid;
			grid-template-columns: 1fr 3fr;
			grid-auto-flow: dense;
			height: 500px;
		}
		
		.billboard-image-wrapper{
			grid-column:2;
		}
		.billboard-caption {
			overflow:hidden;
			padding: 1rem 2rem;

			.title { 
				margin-top: 1rem;
				line-height:normal;
			}

			.billboard-airinfo {
				color: var(--navy);
				font-weight: bold;
			}
		}
	}
}

.block-editor-page #billboard-carousel{
	.carousel-item:not(.active),
	.billboard-image-mobile{display:none;}
}
