<html><head><meta name="color-scheme" content="light dark"></head><body><pre style="word-wrap: break-word; white-space: pre-wrap;">/* Add your styles for the slideshow, dots, and text here */

.slideshow-containerfirst{
    position: relative;
    max-width: 100%;
    overflow: hidden;
    height : 91vh;
}

.slide fade first {
    display: none;
}
.slide fade first{
    height:300px;
    /* background-color: rgb(49, 122, 187); */
}
.slide-image {
    width: 100%;
    height:670px; /* Adjust the height as needed */
    height : 100vh;
    object-fit: cover;
}

.slide::before{
    content: '';
    position: absolute;
    top: 0;
    left: 0;
    height: 100%;
    width: 100%;
    background: -moz-linear-gradient(left,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 100%);
    /* background: -webkit-linear-gradient(left,rgba(0,0,0,.6) 0,rgba(0,0,0,0) 100%); */
    background: linear-gradient(to right,rgba(0,0,0,.5) 0,rgba(0,0,0,0) 100%);
    z-index: 1;
}


/* .slide-fade img {
    width: 100%;
    height: auto;
    margin-bottom: -50%;
} */

.textfirst {
    position: absolute;
    bottom: 30vh;
    left: 8vw;  
    margin-bottom: 6%;
    font-size: 24px;   
    max-width: 45%;
   
    z-index: 2;
}
.textfirst h3{
    font-size: 3vw;
    margin-left:32px;
    border-bottom: 0.5vw solid rgb(188, 218, 194);
    font-weight: 900;
    padding-bottom: 1%;
    color:#FFFFFF;
    /* background-color: black; */
    margin-top: 1.6%;
}
.textfirst p{
   margin-top: 2%;
    font-size: 1.3vw;
    font-weight: 500;
   padding-left:32px;
   /* padding-top: 3%; */
   text-align: left;
   color:#FFFFFF;
   /* background-color:#ebe7e7a6; */
    padding-right:20px;
   
}
.dots-containerfirst {
    text-align: center;
    padding-top: 80px;
   /* margin-top: -12%; */
   bottom: 30%;
   position: relative;
   z-index: 2;
}

.dotfirst {
    height: 1vw;
    width: 1vw;
    margin-top: -10%;
    margin: 0 8px;
    background-color: #faf4f4;
    border-radius: 50%;
    display: inline-block;
    transition: background-color 0.3s ease;
    cursor: pointer;
    z-index: 2;
}

.dotfirst.active {
    background-color: #09661f;
}

@media screen and (max-width: 600px){

    .textfirst{
        bottom: 10vh;
        left: -3vw;
        max-width: 99%;
    }

    .slide-image{
        object-fit:cover ;
    }

    .textfirst h3{
        font-size: 9vw;
    }

    .textfirst p{
        font-size: 4vw;
        padding-right: 1%;
    }

    .dotfirst{
        height: 3vw;
        width: 3vw;
    }
    .slide::before{
        background: linear-gradient(to top,rgba(0,0,0,.8) 0,rgba(0,0,0,0) 100%);
    }
}



@media screen and (min-width:800px) and (max-width:1100px) {
    
    .textfirst h3{
        font-size: 5vw;
    }

    .textfirst p{
        font-size: 3vw;
    }

    .dots-containerfirst{
        bottom: 20%;
    }

    .slideshow-containerfirst{
        height: 95vh;
    }

}



@media screen and (min-width:700px) and (max-width:800px) {
    .slideshow-containerfirst{
        height: 91vh;
    }

    .dots-containerfirst{
        bottom: 30%;
    }

    .textfirst h3{
        font-size: 4.5vw;
    }

    .textfirst p{
        font-size: 2.5vw;
    }
}


</pre></body></html>