body{font-family:Arial,sans-serif}
.hero{height:80vh;background:linear-gradient(rgba(0,0,0,.6),rgba(0,0,0,.6)),url("../images/hero/hero1.jpg") center/cover no-repeat}
.card:hover{transform:translateY(-5px);transition:.3s}

/*=========================
    HERO SLIDER
==========================*/

.slider-img{
    height:650px;
    width:100%;
    object-fit:cover;
}

.carousel-item{
    position:relative;
}

.carousel-item::before{
    content:"";
    position:absolute;
    top:0;
    left:0;
    width:100%;
    height:100%;
    background:rgba(0,0,0,.45);
}

.carousel-caption{
    z-index:2;
    bottom:0;
    top:0;
}

.carousel-caption h1{
    text-shadow:0 3px 10px rgba(0,0,0,.6);
}

.carousel-caption p{
    font-size:1.25rem;
    text-shadow:0 2px 8px rgba(0,0,0,.6);
}

.carousel-caption .btn{
    width:220px;
    margin:auto;
    font-weight:bold;
}

.carousel-control-prev-icon,
.carousel-control-next-icon{
    background-size:60%;
}

.carousel-indicators [data-bs-target]{
    width:14px;
    height:14px;
    border-radius:50%;
}

@media(max-width:768px){

.slider-img{
    height:420px;
}

.carousel-caption h1{
    font-size:2rem;
}

.carousel-caption p{
    font-size:1rem;
}

.carousel-caption .btn{
    width:180px;
}
}