@charset "utf-8";
/* CSS Document */

.carousel-inner {padding-bottom: 2.8em;}

/* Make the image fully responsive */
.carousel-inner .banner-logo { max-height: 140px; margin: 0 auto;}
.carousel-item { height: /*130vh;*/50em;}
.carousel-item:nth-child(1) { background:url(../img/banner.webp) no-repeat top center; background-size:cover; }

.carousel-caption { position: absolute; width: 48vw; left: 49%; top: 7%; padding: 0; margin: 0; letter-spacing: 2px;}
.carousel-caption h1 { font-weight:900; font-size: 2.15em; padding: 0; margin: .35em 0 .25em 0;}
.carousel-caption h4 { font-weight:400; font-size: 1.25em; letter-spacing: 2px; line-height:1.35em;}
.carousel-caption .lead { font-size: 1.025em; color:#444; padding:0 2em; font-weight: 400; margin-bottom: 1.75em;}
.carousel-caption .hero-btn { font-size: 1.025em; padding: .75em 1.5em; background: #fff; color:#009d96; margin:0 .9em; letter-spacing: 1px; display: inline-block; margin-bottom: 1em;}
.carousel-caption .hero-btn:hover { color:#fff; background:#000;}

.hero-overlay { position: absolute; right: 0; bottom: 0; left: 0; display:flex; min-height:320px; 
	background-image: url('data:image/svg+xml,<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 1440 320"><path fill="%23ffffff" fill-opacity="1" d="M0,160L80,181.3C160,203,320,245,480,240C640,235,800,181,960,176C1120,171,1280,213,1360,234.7L1440,256L1440,320L1360,320C1280,320,1120,320,960,320C800,320,640,320,480,320C320,320,160,320,80,320L0,320Z"></path></svg>');
	background-size:cover; background-repeat:no-repeat;
}

@media only screen and (max-width: 1376px) {
	.carousel-inner .banner-logo { max-height: 120px;}
	.carousel-caption { top: 13%;}
}

@media only screen and (max-width: 1280px) {
	.carousel-caption { font-size: .8em;}
}

@media only screen and (max-width: 992px) {
	.carousel-inner .banner-logo { max-height: 100px;}
	.carousel-caption { top: 15%; font-size: 1em;}
	.hero-overlay {min-height:280px; }
}

@media only screen and (max-width: 832px) { 
	.carousel-caption { font-size: .9em; width: 52vw; left:42%;}
}

@media only screen and (max-width: 700px) { 
	.carousel-caption { width: 56vw; left:38%;}
}

@media only screen and (max-width: 660px){
	.carousel-caption { width: 60vw; left:32%;}
}

@media only screen and (max-width: 620px){
	.carousel-caption { top: 11%;}
	.hero-overlay {min-height:220px; }
}

@media only screen and (max-width: 580px){
	.carousel-caption { top: 8%;}
}

@media only screen and (max-width: 500px){
	.carousel-caption { width: 70vw; left:23%;}
}

@media only screen and (max-width: 432px){
	.carousel-item { height: 55em;}
}

@media only screen and (max-width: 384px){
	.carousel-item { height: 58em;}
}

@media only screen and (max-width: 360px){
	.carousel-caption h1 { font-size: 1.8em;}
	.hero-overlay {min-height:200px; }
}