/*--------------------------------
    05. Slider CSS Start
----------------------------------*/
.main-slider-area {
}

.slider .indicators .indicator-item {
    background-color: #666666;
    border: 3px solid #ffffff;
    -webkit-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    -moz-box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
    box-shadow: 0 2px 5px 0 rgba(0, 0, 0, 0.16), 0 2px 10px 0 rgba(0, 0, 0, 0.12);
}

    .slider .indicators .indicator-item.active {
        background-color: #ffffff;
    }

.slider {
    width: 100%;
    height: 90vh !important;
    max-height: 500px;
}

    .slider .slides {
        width: 100%;
        height: 90vh !important;
        max-height: 500px;
    }

        .slider .slides li .slider-img {
            position: relative;
            width: 100%;
            height: 90vh;
            max-height: 500px;
        }

            .slider .slides li .slider-img:before {
                content: "";
                position: absolute;
                left: 0;
                top: 0;
                z-index: 0;
                width: 100%;
                height: 100%;
                background: rgba(0, 0, 0, 0.01);
            }

    .slider .indicators {
        bottom: 60px;
        z-index: 100;
    }

    .slider .slides li .caption {
        top: 40%;
    }

        .slider .slides li .caption h3 {
            color: #ffffff;
            font-size: 45px;
        }

            .slider .slides li .caption h3 span {
                color: #fe6c6d;
            }

        .slider .slides li .caption p {
            font-size: 18px;
            font-style: italic;
            letter-spacing: 1px;
        }

/* Slider Two CSS */
.main-slider-two .slider {
    width: 100%;
    height: 100vh !important;
}

    .main-slider-two .slider .slides {
        height: 100vh !important;
    }

        .main-slider-two .slider .slides li .slider-img {
            position: relative;
            height: 100vh;
        }