/* ======================================
    Stylesheet for the banner carousel  
======================================= */

 
.views-banner-carousel{
aspect-ratio:16/6;
overflow:hidden;
}

.views-banner-carousel img{
width:100%;
height:100%;
object-fit:cover;
}

/*
.views-banner-caption{
position:absolute;
top:50%;
left:50%;
transform:translate(-50%,-50%);
background:rgba(0,0,0,0.35);
color:white;
padding:25px 40px;
border-radius:6px;
text-align:center;
}
*/


.views-banner-carousel{
    position: relative;
    aspect-ratio: 16/6;
    overflow: hidden;
}

.views-banner-carousel img{
    width:100%;
    height:100%;
    object-fit:cover;
}

/* Caption positioned bottom middle */
.views-banner-caption{
    position:absolute;
    bottom:50%;          /* distance from bottom */
    left:50%;
    transform:translateX(-50%);
    
    text-align:center;
    color:#fff;
    background:rgba(0,0,0,0.4);   /* transparent overlay */
    
    padding:15px 30px;
    border-radius:6px;
    max-width:700px;
    width:90%;
}

.views-banner-caption h2{
    font-size:2rem;
    font-weight:700;
    margin-bottom:8px;
}

.views-banner-caption p{
    font-size:1rem;
    margin:0;
}

/*.views-banner-carousel::after{
	content:"";
	position:absolute;
	left:0;
	right:0;
	bottom:0;
	height:40%;
	background:linear-gradient(to top, rgba(0,0,0,0.6), transparent);
}*/