.landingPage {

}

.landingPage.spacing {
    position: relative;
    padding-top: 80px;
    padding-bottom: 70px;
}

#myCarousel {
    height: 800px;
    overflow: hidden;
}

#title {
    width: 100%;
    position: absolute;
    z-index: 2;
    top: 20%;
    left: 37%;
    color: #fff;
}

#title1 {
    position: absolute;
    z-index: 2;
    top: 40%;
    left: 37%;
    color: #fff;
}

#title1 h2 {
    width: 100%;
    margin-left: 15%;
    top: 25%;
}

#title1 hr {
    width: 100%;
    top: 25%;
    margin-left: 15%;
}

.carousel-inner {
    overflow: visible;
}

.carousel-caption {
    position: absolute;
    top: 600px;
    margin-left: 35%;
    color: inherit;
    text-align: left;
    z-index: 1;
}

.carousel-caption hr {
    margin: 0px;
}

#myCarousel img {
    position: absolute;
    height: 800px;
    width: 1200px;
    right: 60%;
}

.carousel-indicators {
    height: 32px;
    vertical-align: center;
}

.carousel-indicators [data-bs-target] {
    background-color: #7a6a47;
}

.carousel-control-next, .carousel-control-prev {
    width: 32px;
    height: 32px;
    border: 2px solid #7a6a47;
    border-radius: 16px;
    color: #7a6a47;
    padding: 5px;
}

.carousel-control-next-icon {
    background-image: url(../../proto/svg/next.svg);
}

@media (max-width: 767px) {
    #myCarousel {
        height: 400px;
    }

    .carousel-indicators {
        visibility: hidden;
    }

    .carousel-inner {
        visibility: hidden;
    }

    #myCarousel {
        background-image: url("../../proto/images/education-1.jpg");
        background-position: center;
    }

    #title h2, #title1 h2{
        font-size: 23px;
        font-weight: normal;
        /*color: #000;*/
    }

    #title {
        width: 100%;
        position: absolute;
        z-index: 2;
        top: 10%;
        left: 7%;
        color: #fff;
    }

    #title1 {
        position: absolute;
        z-index: 2;
        top: 30%;
        left: 17%;
        color: #fff;
    }

}


@media (min-width: 768px) and (max-width: 991px) {
}

@media (min-width: 992px) and (max-width: 1199px) {
}

@media (min-width: 1200px) and (max-width: 1399px) {
}

@media (min-width: 1400px) {
}