38 lines
927 B
CSS
38 lines
927 B
CSS
/* Hero Slider Styles */
|
|
.hero-slider, .carousel-inner, .carousel-item {
|
|
width: 100%;
|
|
height: 65vh;
|
|
position: relative;
|
|
overflow: hidden;
|
|
}
|
|
.hero-image {
|
|
width: 100%;
|
|
height: 65vh;
|
|
object-fit: cover;
|
|
filter: grayscale(100%);
|
|
transition: filter 0.5s ease-in-out;
|
|
}
|
|
.hero-image:hover {
|
|
filter: grayscale(0%);
|
|
}
|
|
.carousel-indicators {
|
|
bottom: 10px;
|
|
}
|
|
.carousel-indicators button {
|
|
width: 30px;
|
|
height: 10px;
|
|
border-radius: 5px;
|
|
border: none;
|
|
margin: 3px;
|
|
opacity: 0.5;
|
|
}
|
|
.carousel-indicators .active {
|
|
opacity: 1;
|
|
}
|
|
.indicator-color-1.active { background-color: #ffcc00; }
|
|
.indicator-color-2.active { background-color: #ffff66; }
|
|
.indicator-color-3.active { background-color: #0099FF; }
|
|
.indicator-color-4.active { background-color: #A3A300; }
|
|
.indicator-color-5.active { background-color: #990000; }
|
|
.indicator-color-6.active { background-color: #29527A; }
|