@charset "UTF-8";

.open-sans-Medium {
  font-family: "Open Sans", sans-serif;
  font-variation-settings:
    "wdth" 700;
}
body, html {
    height: 100%;
    margin: 0;
    /*background-color: white;*/
    background-color: rgba(43, 93, 90, 1);
    overflow-x:hidden;
    scroll-behavior: smooth;
}
img, video {
    max-width: 100%;
    height: auto;
}
.app-container {
    display: flex;
    flex-direction: column;
    height: 100%;
}
/* Navbar section start */
.navbar-simple {
    display: flex;
    align-items: center;
    height: 11vh;
    padding-top: 0px;
    padding-bottom: 0px;
    background-color: rgba(43, 93, 90, 0.8);
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 6;
}
.navbar-brand-container {
    display: flex;
    align-items: flex-start;
    height: 75%;
    margin: 0 4vw 0 14.5vw;
}
.navbar-nav {
    margin-left: 25vw;
}
.navbar-brand-img {
    max-height: 10vh;
    margin-right: 10px;
    padding-top: 5px;
    padding-bottom: 10px;
}

.nav-link, .dropdown-menu {
    font-size: 0.6vw;
    font-family: 'Open Sans', sans-serif;
    color: white ;
    margin-right: 1vw;
    justify-content: space-around;
    letter-spacing: 1px;
}

.no-underline {
    text-decoration: none !important;
}

/* Dropdown menu styles */
.nav-item.dropdown {
    position: relative;
    z-index: 1000;
}

.dropdown-menu {
    display: none;
    position: absolute;
    background-color: rgba(43, 93, 90, 0.8);
    top: 100%;
    left: 0;
    z-index: 1000;
    width: 10vw;
    padding: 0 0 0 0;
    margin: 0;
    border-radius: 0;
}
.nav-item.dropdown:hover .dropdown-menu {
    display: block;
}
.dropdown-item {
    color: white !important;
    text-align: center;
    font-size: 0.6vw;
    width: 100%;
    height: auto;
    border-bottom: 1px solid rgba(45, 133, 128, 1);
}
.dropdown-item:hover {
    background-color: rgba(43, 93, 90, 0.8);
}
/* Navbar section ends */

/*Slideshow section starts*/
.mySlides {
    display: flex;
    z-index:0;
    margin: 0 0 0 0;
    height: 50vw;
    width: 100%;
    position: relative;

}
.slide-img {
    align-items: flex-start;
    height:auto;
    width: 100%;
    object-fit: contain;
}
.slideshow-container {
    display: flex;
    box-sizing: border-box;
    width: auto;
    height: auto;
    position: relative;
}
.slide-text {
    position: absolute;
    text-align: left;  /* Aligns the text to the left */
    width: 45%;
    z-index: 3;
}
.slide-text h1 {
    color: white;
    font-weight: bold;
}
.slide-text p {
    color: #21BFB5;
    font-weight: bold;
}
.slide-svg_seal{
    height: 11rem;
    margin-top: 0.75rem;
    margin-left: 0.5rem;
}
/*Slideshow section ends*/

/* Base styles for the Our Services section */
.services-separator {
    display: flex;
    justify-content: center;
    height:3vw;
    align-items: center;
    background-color: #FDFDFD;
    margin: 0;
}
.services-header {
    display: flex;
    align-items: center;
    justify-content:flex-end;
    width: 69%;
    margin: 1vw 0 0 0;
}
.services-title {
    font-size: 3vw;
    color: white;
}
.services-divider {
    width: 20%;
    height: 0.2vw;
    background-color: black;
    margin-right: 1vw;
}
.services {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
    padding: 0 0 0 0;
}

.services h2, .services p {
    color: black;
}

/* Styles for each service section */
.service {
    display:flex;
    width: 69%;
    height:100%;
    margin: 2vw 0 3vw 0;
    background-color: #FBFBFB;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.service-text {
    flex: 1;
    padding: 0;
}

.service-image {
    flex: 1;
    display: flex;
    justify-content: center;
    align-items: center;
}

.service-img {
    width: 100%;
    height: 100%;
}

.service-divider {
    background-color: #2B5D5A;
    margin: 0.5vw 0;
}
.service-divider-v2 {
    background-color: #2B5D5A;
    margin: 0.5vw 0;
}

/* Specific styles for each service section */
.service-1 .service-text {
    order: 1;
    padding: 3vw 2vw 0 5vw;
}

.service-1 .service-image {
    order: 2;
    padding: 3vw;
}

.service-2 .service-text {
    order: 2;
    padding: 3vw 5vw 0 2vw;
}

.service-2 .service-image {
    order: 1;
    padding: 3vw;
}

.service-3 .service-text {
    order: 1;
    padding: 3vw 2vw 0 5vw;
}

.service-3 .service-image {
    order: 2;
    padding: 3vw;
}

.service-4 .service-text {
    order: 2;
    padding: 3vw 5vw 0 2vw;
}

.service-4 .service-image {
    order: 1;
    padding: 3vw;
}

/* Our Services CSS ends */

/*CSS for contact us Div*/
.contact-separator {
    display: flex;
    justify-content: center;
    height:20vh;
    align-items: center;
    background-color: rgb(43, 93, 90);
}
.contact-separator2 {
    display: flex;
    justify-content: center;
    align-items: center;
    background-color: black;
}
.contact-section {
    display: flex;
    justify-content: center;
    align-items: center;
    height: auto;
    width: 100%;
    background-size: cover;
    background-position: center;
    background-repeat: no-repeat;
    margin: 0 0 0 0;
    overflow: hidden;
}
.content-box {
    display:flex;
    flex-grow: 1;
    background-color: rgba(255, 255, 255, 1);
    justify-content: space-between;
    padding: 5px;
    box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
    height: 100%;
    max-width: 70vw;
    width: 80%;
    margin: 3% 0 3% 0;
}
.contact-info {
    flex:1;
    max-width: 50%;
    max-height:100%;
    margin:2% 0 0 6%; /*top right down left */
}
.contact-form {
    flex:1;
    max-width: 50%;
    max-height: 100%;
    margin:2% 7% 0 0;
}
.contact-info h3{
    position: relative;
    padding-bottom: 0px;
    font-size: 3vw;
}
.contact-item {
    display: flex;
    width: 100%;
    margin-bottom: 1vw;
}
.contact-text p .contact-form p {
    font-size: 1vw;
    color: black !important;
}
.contact-text{
    color: black !important;
}
.contact-icon {
    width: 30px;
    height: 30px;
    margin: 1% 2% 0 0;
}
.extra-logo {
    width: 40px;
    height: 40px;
    margin: 0 0 0 0;
}
.logo-row {
    display: flex;
    gap: 2vw;
    margin: 0 0 5% 0;
}
.contact-form h3 {
    position: relative;
    padding-bottom: 10px;
    font-size: 3vw;
}
.contact-form h3::after {
    content: '';
    position: absolute;
    left: 0;
    bottom: 0;
    width: 150px;
    height: 2px;
    background-color: #2B5D5A;
}
.input-row {
    flex: 1;
    display: flex;
    justify-content: space-between;
    gap: 10px;
}
.input-container {
    flex: 1;
    margin: 0 0 0 0;
}
.input-box, .message-box {
    width: 100%;
    padding: 10px;
    margin-top: 5px;
    margin-bottom: 15px;
    margin-right: 0.5vw;;
    border: 1px solid #ccc;
    border-radius: 5px;
    box-sizing: border-box;
}
.message-box {
    height: 15vh;
    resize: vertical;
    box-sizing: border-box;
    margin: 0 0 0 0;
}
.submit-button {
    display: block;
    /*margin-left: auto;*/
    padding: 10px 20px;
    background-color: #31706D;
    color: white;
    border: none;
    cursor: pointer;
    z-index: 5;
}
.submit-button:hover {
    background-color: #4CAF50;
}
/*contact us CSS end*/

/* Base styles for the Projects section */
.second-project-separator {
    display: flex;
    justify-content: center;
    height:auto;
    align-items: center;
    background-color: white;
}
.second-project-separator-logo {
    height: auto;
}
.second-project-separator-text-container {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 20px 0 10px 0;
    margin: 0;
    width: 100%;
    height:auto;
}
.second-project-separator2 {
    display: flex;
    justify-content: center;
    height:auto;
    align-items: center;
    background-color: rgba(14, 14, 14,1);
}
.second-project-separator-text-container2 {
    display: flex;
    flex-direction: column;
    align-items: center;
    justify-content: center;
    text-align: center;
    padding: 10px 0 0 0;
    margin: 0;
    width: 100%;
    height:100%;
}
.second-project-separator-text-2 {
    font-weight: Bold;
    color: black;
}
.second-project-separator3{
    height: 1vw;
    background-color: black;
}
.third-project-separator {
    display: flex;
    justify-content: center;
    height:8vh;
    align-items: center;
    background-color: rgba(14, 14, 14,1);
    margin: 0;
}
/* Base styles for the Projects in Detail section */
.featured-projects{
    display: flex;
    align-items: center;
    flex-direction: column;
    background-color: rgba(14, 14, 14,0.93);
}
.featured-projects-header {
    display: flex;
    align-items: center;
    width:69%;
}
.featured-projects-title{
    font-size: 3vw;
    color:white;
}
.featured-projects-divider {
    width: 20%;
    height: 0.2vw;
    background-color: white;
    margin-left: 1vw;
}
.project-detail {
    display: flex;
    align-items: center;
}
.project-image {
    width: 85%;
    height: auto;
    padding: 3vw;
}
.project-text {
    width: 68%;
    display: flex;
    flex-direction: column;
    align-items: flex-start;
}

.project-info {
    font-size: 1.5vw;
    font-weight: bold;
    margin-bottom: 0.5vw;
    color: white;
}
.project-info-v2 {
    font-size: 1.5vw;
    font-weight: bold;
    margin-bottom: 0.5vw;
    color: white;
}
.project-description {
    font-size: 1.2vw;
    color:white;
}
.project-description-v2 {
    font-size: 1.2vw;
    color:white;
}

.project-divider {
    background-color: #2B5D5A;
    margin: 1.5vw 0;
}
/* Projects in detail section end */

/* Gallery section start */
.gallery-container {
    display: flex;
    flex-wrap: wrap;
    margin: 0px;
    height: auto;
    width: 100%;
}
.gallery-row {
    display: flex;
    flex-wrap: wrap;
    width: 100%;
    margin: 0;
    padding: 0;
}
.gallery-item {
    position: relative;
    flex: 1;
    width: 25%;
    height: auto;
    overflow: hidden;
}
.gallery-img {
    width: 100%;
    height: auto;
    object-fit: cover;
    transition: transform 0.3s ease;
}
.caption {
    position: absolute;
    top: 50%;
    left: 50%;
    transform: translate(-50%, -50%);
    background-color: rgba(0, 0, 0, 0.3);
    color: white;
    font-weight: bold;
    text-align: center;
    padding: 10px;
    box-sizing: border-box;
    opacity: 0;
    transition: opacity 1s ease;
    width: 100%;
    height: 100%;
    display: flex;
    align-items: center;
    justify-content: center;
    font-size: 1vw;
}

.gallery-item:hover .caption {
    opacity: 0.5;
    color: white;
}
.gallery-item:hover .gallery-img {
    transform: scale(1);
    filter: brightness(0.7);
}

.gallery-item:hover .caption {
    opacity: 1;
}
/* Project Section end */


/* Base styles for the About Us section */
.about-us-separator {
    display: flex;
    justify-content: center;
    height:8vh;
    align-items: center;
    background-color: rgb(43, 93, 90);
    margin: 0;
}
.about-us-header{
    display: flex;
    align-items: center;
    width:68%;
}
.about-us-title{
    font-size: 3vw;
    color:black;
}
.about-us-divider{
    width: 20vw;
    height: 0.2vw;
    background-color: black;
    margin-left: 1vw;
}
.about-us {
    display: flex;
    flex-direction: column;
    align-items: center;
    background-color: white;
    padding: 0 0 0 0;
}

.about-us h2, .about-us h3, .about-us p {
    color: black;
}
.about-us h4 {
    color: #21BFB5;
}
/* Styles for the first section */
.info-section-1 {
    display: flex;
    width: 100%;
    margin: 2vw 0 2vw 0;
}
.text-container-1 {
    flex: 1;
    padding: 0 0 0 0;
}
.image-container-1{
    flex: 1;
    padding: 0 10vw 0 0;
}
.info-section-1 .info-image {
    width: 100%;
    height: 100%;
}
.text-container-1 {
    display: flex;
    flex-direction: column;
    justify-content: space-evenly;
    margin: 0 0vw 0 0vw ;
    padding: 0 5vw 0 10vw;
}
/* Styles for the second section */
.info-section-2 {
    display: flex;
    width: 100%;
    margin-bottom: 2vw;
}
.image-container-2{
    flex: 1;
    padding: 0 10vw 0 0;
}
.text-container-2 {
    flex: 1;
    padding: 0 0 0 0;
}
.info-section-2 .info-image {
    width: 100%;
    height: 100%;
}
.text-container-2 {
    display: flex;
    flex-direction: column;
    justify-content: center;
    margin: 0;
    padding: 0 5vw 0 10vw;
}
/* Styles for the third section */
.info-section-3 {
    display: flex;
    width: 100%;
    margin-bottom: 2vw;
}
.image-container-3 {
    flex: 1;
    padding: 0 0 0 10vw;
}
.info-section-3 .info-image {
    width: 100%;
    height: auto;
}
.text-container-3 {
    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: flex-start;
    padding: 0 10vw 0 5vw;
}
/* About Us end */

/* Bottom part of the page */
.bottom-separator {
    display: flex;
    justify-content: space-between;
    align-items: center;
    height: 8vh;
    padding: 0 20px;
    margin: 0;
    background-color: rgba(14, 14, 14, 0.93);
    color: white;
}

.bottom-separator .copyright-text {
    font-size: 14px;
    font-weight: lighter;
    margin-left:2vw;
}
/* Bottom part end */

.top-clients {
    display: flex;
    justify-content: center;
    align-items: center;
    flex-direction: column;
    padding: 20px 0 0 0;
    background-color: white;
}
.top-clients-text{
    color: black;
    margin-bottom: 1vw;
}
.top-img {
    width: 100%;
    height: auto;
}
.footer {
    display: flex;
    background-color: rgba(43, 93, 90, 1);
    color: white;
    padding: 20px 5vw;
    text-align: center;
    height: 6vw;
    font-size: 13px;
}

.footer .container-fluid {
    width: 80%;
    margin: 0 auto;
    height:100%;
}

.footer .footer-link {
    color: white;
    text-decoration: none;
}


.footer .footer-item1 {
    margin: 0 0 0 0;
    text-align: left;
    flex:1;
}
.footer .footer-item2 {
    margin: 0 0 0 0;
    text-align: right;
    flex:1;
}
.mid {
    text-align: center;
}

/*Company Serve and Stats section Start*/
.co-stats {
    background-color: white;
    display: grid;
    width: auto;
    height: auto;
}
#company-stats{
    display: grid;
    grid-template-columns: 100%;
    width: 85%;
    height:auto;
    margin: 0 auto;
    justify-items: center;
}
.service-map{
    height:auto;
    width: 100%;
}
/*Company Serve and Stats section Ends*/



/* Sizing styles start */
/* Media query for extra large screens */
@media (min-width: 1200px) {

    .nav-separator{
        height: 11vh;
    }
    .dropdown-item {
        padding: 1rem 0 1rem 0;
        font-size: 0.65rem;
        width: auto;
    }
    .nav-link, .dropdown-menu {
        font-size: 0.75rem;
        margin-right: 1vw;
        letter-spacing: 1px;
    }
    .dropdown-menu {
        width: 1vw;
    }
    .slide-img {
        height:auto;
    }
    .contact-separator2 {
        height:1vw;
    }
    .contact-separator {
        height:2.5vw;
    }
    .about-us-separator {
        height:4vh;
    }
    .about-us{
        height:auto;
    }
    .about-us h2 {
        font-size: 2.1vw;
    }
    .about-us h3 {
        font-size: 2.1vw;
    }
    .about-us h4 {
        font-size: 1.6vw;
    }
    .about-us p {
        font-size: 1.1vw;
    }
    .about-us-header{
        margin: 3vw 0 0 0;
    }
    .about-us .about-us-title{
        font-size: 3vw;
    }
    .about-us-divider{
        width: 24%;
        height: 0.2vw;
        margin-left: 1vw;
    }
    /* about us section-1 */
    .info-section-1 {
        padding: 0vw 6vw 1vw 6vw;
    }
    .text-container-1 {
        padding: 1vw 8vw 0 10vw;
        justify-content: space-evenly;
    }
    /* about us section-2 */
    .info-section-2 {
        padding: 1vw 6vw 0 6vw;
        height: 40%;
    }
    .text-container-2 {
        padding: 0vw 8vw 0 10vw;
        justify-content: flex-start;
        margin: 6vw 0 0;
    }
    .image-container-2{
        padding: 0 10vw 0 0;
    }
    .info-section-2 .info-image {
        width: 100%;
        height: 84%;
    }
    /* about us section-3 */
    .info-section-3 {
        padding: 0vw 6vw 0vw 6vw;
    }
    .text-container-3 {
        padding: 3vw 10vw 0 8vw;
        margin: 6vw 0vw;
    }
    /* our services */
    .service h2 {
        font-size: 2.1vw;
    }
    .service p {
        font-size: 1.2vw;
    }
    .service-divider {
        width: 26vw;
        height:0.5vw;
    }
    .service-divider-v2 {
        width: 14vw;
        height:0.5vw;
    }
    .services-header {
        margin: 0 0 0 0;
    }
    .services-title {
        font-size: 3vw;
    }
    .services-divider {
        width: 20%;
        height: 0.2vw;
    }
    /* Project section */
    .projects {
        height: auto;
    }
    .second-project-separator-logo {
        width: auto;
        height: 5.5vw;
        margin-bottom: 0.5vw;
    }
    .second-project-separator-text-container {
        margin-bottom: 0.5vw;
    }
    .second-project-separator-text-2 {
        padding: 0.5vh 20vw;
        font-size: 1.9vw;
        letter-spacing: 1px;
    }
    .second-project-separator3{
        height: 1vw;
    }
    .caption {
        font-size: 1.4vw;
    }
    .featured-projects-header {
        margin: 3vw 0 0 0; /* Adjust as needed */
    }
    .featured-projects-title{
        font-size: 3vw;
    }
    .featured-projects-divider {
        width: 20%;
        height: 0.2vw; /* Adjust height as needed */
        margin-left: 1vw; /* Adjust spacing between title and divider as needed */
    }
    .project-detail {
        width: 75%;
        margin: 1vw 0;
    }
    .project-info {
        font-size: 1.5vw;
        margin: 0 0 0 0;
    }
    .project-info-v2 {
        font-size: 1.5vw;
        margin: 0 0 0 6vw;
    }
    .project-description {
        font-size: 1.2vw;
        margin: 0 8vw 0 0;
    }
    .project-description-v2 {
        font-size: 1.2vw;
        margin: 0 0 0 6vw;
    }
    .project-divider {
        width: 55%;
        height: 0.4vw;
    }
    .top-clients-text{
        font-size: 2vw;
    }
    .top-img {
        max-width: 100%;
        height: 20vw; /* Ensures the image scales proportionally */
    }
    .navbar-brand-container { /* Added from css2 */
        display: flex;
        align-items: flex-start; /* Center vertically */
        height: 75%;
    }
    .navbar-brand-img { /* Added from css2 */
        height: 100%; /* Set height to 100% of parent container */
        margin-right: 10px; /* Optional: Adjust margin as needed */
        padding-top: 0.25vw;
        padding-bottom: 10px;
    }
    .navbar-simple { /* Added from css2 */
        height: 11vh;
    }
    .contact-section { /* Added from css2 */
        height: 15%;
        width: 100%;
    }
    .content-box { /* Added from css2 */
        padding: 5px;
        height: auto;
        width: 80%;
        margin: 0% 0 0% 0;
    }
    .contact-info { /* Added from css2 */
        max-width: 40%;
        height: auto;
        margin: 2% 0 0 4%;
    }
    .contact-form { /* Added from css2 */
        max-width: 60%;
        max-height: 100%;
        margin: 2% 5% 0 0;
    }
    .contact-form h3, .contact-info h3 { /* Added from css2 */
        font-size: 2vw;
    }
    .contact-info p, .contact-form p { /* Added from css2 */
        font-size: 1.2vw;
    }
    .contact-text {
        font-size: 1.2vw;
    }
    .contact-item { /* Added from css2 */
        margin-bottom: 0vw;
    }
    .contact-map { /* Added from css2 */
        width: 90%;
        height: 35%; /* Adjust this height as needed */
        border: 2px;
        padding: 1% 2vw 0 0;

    }
    .socials { /* Added from css2 */
        width: 3.5vw;
        height: auto;
    }
    .extra-logo { /* Added from css2 */
        width: 40px;
        height: 40px;
        margin: 0 0 0 0;
    }
    .logo-row { /* Added from css2 */
        gap: 2vw;
        margin: 0 0 5% 0;
    }
    .contact-form h3 { /* Added from css2 */
        padding-bottom: 10px;
    }
    .contact-form h3::after { /* Added from css2 */
        width: 30%;
        height: 5px;
    }
    .input-row { /* Added from css2 */
        flex-direction: row;
        gap: 10px;
    }
    .input-box, .message-box { /* Added from css2 */
        width: 100%;
        padding: 10px;
        margin-top: 5px;
        margin-bottom: 15px;
        margin-right: 0.5vw;
        font-size: 1.2vw;
    }
    .submit-button { /* Added from css2 */
        font-size: 1.2vw;
        margin-bottom: 2%;
    }
    .contact-icon { /* Added from css2 */
        width: 40px;
        height: 40px;
        margin: 1.5% 3% 0 0;
    }
    .message-box { /* Added from css2 */
        resize: vertical;
        height: 18vh;
        min-height:20vh;
        max-height:30vh;
    }
    .footer-icon {
        margin-left: 0.5vw;
        margin-bottom: 1vw;
        margin-top: 0vw;
    }
    .footer-item1 {
        display: flex;
        align-items: center;
    }
    /*Company Serve and Stats section Start*/
    #company-stats{
        width: 80%;
        height:auto;
    }
    .service-map{
        height:auto;
        width: 100%;
        object-fit: fill;
    }
    /*Company Serve and Stats section Ends*/
    /*Slideshow section starts*/
    .mySlides {
        display: flex;
        z-index:0;
        margin: 0 0 0 0;
        height:100%;
        width: 100%;
    }
    .slide-img {
        align-items: flex-start;
        height:100%;
        width: 100%;
        object-fit: scale-down;
    }
    .slide-text{
        top: 15%;
        left: 5%;
        padding: 5px;
    }
    .slide-text h1 {
        margin: 0;
        font-size: 5.5vw;
        text-shadow: 0.1vw 0.1vw #252424;
    }
    .slide-text p {
        font-size: 1.5vw;
        margin: 2px 0;
        text-shadow: 0.1vw 0.1vw #252424;
    }
}

/* Media query for medium to larger screens */
@media (max-width: 1200px) {
    .slide-img {
        height:auto;
        object-fit: scale-down;
    }
    .nav-separator{
        height: 8vh;
    }
    .dropdown-item {
        padding: 1rem 0 1rem 0;
        font-size: 1.1vw;
        width: 100%;
    }
    .nav-link, .dropdown-menu {
        font-size: 1.2vw;
        margin-right: 1vw;
        letter-spacing: 1px;
    }
    .dropdown-menu {
        width: auto;
    }
    .navbar-collapse {
        display: flex !important;
        flex-basis: auto !important;
        justify-content: flex-start;
    }
    .navbar-nav {
        display: flex;
        flex-direction: row;
        margin-left: auto; /* Pushes the navbar links to the right */
        display: none;
    }
    .navbar-toggler {
        display: none;
    }
    .navbar-brand-container { /* Added from css2 */
        display: flex;
        align-items: flex-start; /* Center vertically */
        height: 100%;
    }
    .navbar-brand-img { /* Added from css2 */
        height: 8vh; /* Set height to 100% of parent container */
        margin-right: 10px; /* Optional: Adjust margin as needed */
        padding-top: 0.25vw;
        padding-bottom: 10px;
    }
    .navbar-simple { /* Added from css2 */
        height: 8vh;
    }
    .about-us-separator {
        height:2.5vw;
    }
    .about-us{
        height:auto;
    }
    .about-us h2 {
        font-size: 2vw;
    }
    .about-us h3 {
        font-size: 2vw;
    }
    .about-us h4 {
        font-size: 1.9vw;
    }
    .about-us p {
        font-size: 1.4vw;
    }
    .about-us-header{
        margin: 3vw 0 0 0; /* Adjust as needed */
        width: 70%;
    }
    .about-us .about-us-title{
        font-size: 4vw;
        margin:0;
    }
    .about-us-divider{
        width: 17%;
        height: 0.2vw; /* Adjust height as needed */
        margin-left: 1vw; /* Adjust spacing between title and divider as needed */
    }
    /* about us section-1 */
    .info-section-1 {
        padding: 0vw 5vw 1vw 5vw;
    }
    .text-container-1 {
        padding: 1vw 8vw 0 10vw;
        justify-content: space-evenly;
    }
    /* about us section-2 */
    .info-section-2 {
        padding: 0vw 5vw 1vw 5vw;
    }
    .text-container-2 {
        padding: 3.5vw 8vw 0 10vw;
        justify-content: flex-start;
    }
    /* about us section-3 */
    .info-section-3 {
        padding: 0vw 5vw 0vw 5vw;
    }
    .text-container-3 {
        padding: 0 10vw 0 8vw;
        margin: 7vw 0vw;
    }
    /* our services */
    .service h2 {
        font-size: 2vw;
    }
    .service p {
        font-size: 1.4vw;
    }
    .service-divider {
        width: 23.5vw;
        height:0.5vw;
    }
    .service-divider-v2 {
        width: 13vw;
        height:0.5vw;
    }
    .services-header {
        margin: 2vw 0 0 0; /* Adjust as needed */
    }
    .services-title {
        font-size: 4vw;
    }
    .services-divider {
        width: 20%;
        height: 0.2vw; /* Adjust height as needed */
    }
    /* Project section */
    .projects {
        height: auto;
    }
    .second-project-separator-logo {
        width: auto; /* Adjust logo size as needed */
        height: 6vw;
        margin-bottom: 0.5vw; /* Adjust spacing between logo and text */
    }
    .second-project-separator-text-container {
        margin-bottom: 0.5vw;
        padding: 10px 0 0 0;
    }
    .second-project-separator-text-2 {
        padding: 0.5vh 20vw; /* Adjust padding as needed */
        font-size: 2vw; /* Adjust font size as needed */
        letter-spacing: 1px;
        height: auto;
    }
    .second-project-separator{
        height:auto;
    }
    .second-project-separator3{
        height: 3vw;
    }
    .third-project-separator {
        height:7vh;
        margin: 0;
    }
    .featured-projects-header {
        margin: 2vw 0 0 0; /* Adjust as needed */
    }
    .featured-projects-title{
        font-size: 4vw;
    }
    .featured-projects-divider {
        width: 20vw;
        height: 0.2vw; /* Adjust height as needed */
        margin-left: 1vw; /* Adjust spacing between title and divider as needed */
    }
    .caption {
        font-size: 1.85vw;
    }
    .project-detail {
        width: 75%;
        margin: 1vw 0;
    }
    .project-info {
        font-size: 2vw;
        margin: 0 0 0 0;
    }
    .project-info-v2 {
        font-size: 2vw;
        margin: 0 0 0 6vw;
    }
    .project-description {
        font-size: 1.4vw;
        margin: 0 8vw 0 0;
    }
    .project-description-v2 {
        font-size: 1.4vw;
        margin: 0 0 0 6vw;
    }
    .project-image {
        width: 100%; /* Adjust the width as needed */
        height: auto;
        margin-right: 2vw; /* Space between image and text */
    }
    .project-divider {
        width: 55%;
        height: 0.5vw;
    }
    .top-clients {
        padding: 1vw 0 0 0;
    }
    .top-clients-text{
        font-size: 2.5vw;
        margin-bottom: 2vw;
    }
    .top-img {
        max-width: 100%;
        height: auto; /* Ensures the image scales proportionally */
    }
    /* Contact Us start */
    .contact-separator2 {
        height:3vw;
    }
    .contact-separator {
        height:6vw;
    }
    .contact-section {
        height: 50%;
        width: 100%;
    }
    .content-box {
        padding: 5px;
        height: auto;
        width: 100%;
        max-width: 80%;
        margin: 0 0 0 0;
    }
    .contact-info {
        width: 50%;
        height: auto;
        margin: 2% 0 0 4%;
    }
    .contact-form {
        width: 50%;
        height: 100%;
        margin: 2% 5% 0 0;
    }
    .contact-form h3, .contact-info h3 { /* Added from css2 */
        font-size: 3vw;
    }
    .contact-text {
        font-size: 1.6vw;
    }
    .contact-info p, .contact-form p { /* Added from css2 */
        font-size: 1.9vw;
    }
    .contact-item {
        margin-bottom: 0vw;
    }
    .contact-map { /* Added from css2 */
        width: 90%;
        height: 45%; /* Adjust this height as needed */
        border: 2px;
        padding: 1vw 2vw 0 0;
    }
    .socials { /* Added from css2 */
        width: 3.5vw;
        height: auto;
    }
    .extra-logo { /* Added from css2 */
        width: 40px;
        height: 40px;
        margin: 0 0 0 0;
    }
    .logo-row { /* Added from css2 */
        gap: 2vw;
        margin: 0 0 5% 0;
    }
    .contact-form h3 { /* Added from css2 */
        padding-bottom: 10px;
    }
    .contact-form h3::after { /* Added from css2 */
        width: 30%;
        height: 4px;
    }
    .input-row { /* Added from css2 */
        flex-direction: row;
        gap: 10px;
    }
    .input-box, .message-box { /* Added from css2 */
        width: 100%;
        padding: 10px;
        margin-top: 5px;
        margin-bottom: 15px;
        margin-right: 0.5vw;
        font-size: 1.9vw;
    }
    .submit-button { /* Added from css2 */
        font-size: 2vw;
        margin-bottom: 2%;
    }
    .contact-icon { /* Added from css2 */
        width: 30px;
        height: 30px;
        margin: 1.5% 3% 0 0;
    }
    .message-box { /* Added from css2 */
        resize: none;
        height: 25vh;
    }
    /* Contact Us end */
    .footer {
        background-color: rgba(43, 93, 90, 0.9);
        color: white;
        padding: 20px 5vw 0 5vw;
        text-align: center;
        height: auto;
        font-size: 12px;
    }
    .footer .container-fluid {
        width: 100%;
        margin: 0 0 0 0;
        height:auto;
    }
    .footer .footer-item1 {
        margin: 0 0 0 0; /* Add some padding inside each item for better visualization */
        text-align: left; /* Center align the text */
        flex:1;
    }
    .footer .footer-item2 {
        margin: 0 0 0 0; /* Add some padding inside each item for better visualization */
        text-align: right; /* Center align the text */
        flex:1;
    }
    .footer-icon {
        margin-left: 0.5vw;
        margin-bottom: 1.3vw;
        margin-top: 0vw;
    }
    .footer-item1 {
        display: flex;
        align-items: center;
    }
    /*Company Serve and Stats section Start*/
    #company-stats{
        width: 100%;
        height:auto;
    }
    .service-map{
        height:auto;
        width: 100%;
        object-fit: fill;
    }
    /*Company Serve and Stats section Ends*/
    /*Slideshow section starts*/
    .mySlides {
        display: flex;
        z-index:0;
        margin: 0 0 0 0;
        height: 100%;
        width: 100%;
    }
    .slide-img {
        height:100%;
        width: 100%;
        object-fit: contain;
    }
    .slide-text{
        top: 20%;  /* Adjusts the vertical position */
        left: 5%;  /* Adjusts the horizontal position towards the left */
        padding: 5px;
    }
    .slide-text h1 {
        margin: 0;
        font-size: 5vw;
        text-shadow: 0.5px 0.5px #252424;
    }
    .slide-text p {
        font-size: 1.3vw;
        margin: 2px 0;
        text-shadow: 0.5px 0.5px #252424;
    }
    .slide-svg_seal{
        height: 8rem;
        margin-top: 0.75rem;
        margin-left: 0.5rem;
    }
    /*Slideshow section ends*/
}
@media only screen and (min-width:993px) and (max-width: 1199px){
    .mySlides:nth-child(1) .slide-text{
        top: 10%;  /* Adjusts the vertical position */
        left: 5%;
    }
    .mySlides:nth-child(1) .slide-svg_seal{
        height: 10rem;
        margin-top: 0.75rem;
        margin-left: 0.5rem;
    }
}
@media only screen and (min-width: 769px) and (max-width: 992px){
    .mySlides:nth-child(1) .slide-text{
        top: 15%;  /* Adjusts the vertical position */
        left: 5%;
    }
    .slide-svg_seal{
        height: 7rem;
        margin-top: 0.5rem;
        margin-left: 0.5rem;
    }
}
@media only screen and (min-width: 601px) and (max-width: 768px){
    .mySlides:nth-child(1) .slide-text{
        top: 10%;  /* Adjusts the vertical position */
        left: 5%;
    }
    .slide-svg_seal{
        height: 6rem;
        margin-top: 0.5rem;
        margin-left: 0.5rem;
    }
}
@media only screen and (min-width: 431px) and (max-width: 600px){
    .mySlides:nth-child(1) .slide-text{
        top: 10%;  /* Adjusts the vertical position */
        left: 5%;
    }
    .slide-svg_seal{
        height: 4.5rem;
        margin-top: 0.5rem;
        margin-left: 0.15rem;
    }
}
/* Media query for smaller screens */
@media (max-width: 430px) {
    .slide-img {
        height:75vw;
    }
    .nav-separator{
        height: 8vh;
    }
    .dropdown-item {
        padding: 1rem 0 0 0;
        font-size: 2vw;
        width: 100%;
        text-align: center; /* Center align text */

    }
    .navbar-brand-container {
        display: flex;
        align-items: flex-start; /* Center vertically */
        height: auto;
    }

    .navbar-brand-img {
        height: 7.5vh; /* Set height to 100% of parent container */
        margin-right: 10px; /* Optional: Adjust margin as needed */
        padding-top: 2px;
        padding-bottom: 10px;
    }
    .navbar-simple {
        height: 8vh;
    }
    .nav-link, .dropdown-menu {
        top: 0;
        background-color: rgba(43, 93, 90, 0.8);
        font-size: 0.7vw;
        margin-right: 1vw;
        letter-spacing: 1px;
        text-align:right;
    }
    .dropdown-menu {
        position: static;
        width: 100%; /* Adjust width as needed */
        padding: 0;
        margin: 0;
    }
    .navbar-toggler {
        display:none;
    }
    .navbar-nav {
        display: none;
    }
    /* About US section start */
    .about-us-separator {
        height:1vh;
    }
    .about-us{
        height:auto;
    }
    .info-section-1, .info-section-2, .info-section-3 {
        flex-direction: column;
    }
    .about-us h2 {
        font-size: 4vw;
    }
    .about-us h3 {
        font-size: 4vw;
    }
    .about-us h4 {
        font-size: 3vw;
    }
    .about-us p {
        font-size: 2.3vw;
    }
    .about-us-header{
        margin: 3vw 0 0 0; /* Adjust as needed */
        width: 55%;
    }
    .about-us .about-us-title{
        font-size: 5vw;
    }
    .about-us-divider{
        width: 50%;
        height: 0.3vw;
        margin-left: 2vw;
    }
    .image-container-1, .image-container-2, .image-container-3 {
        padding: 0 10vw 3vw 10vw;
    }
    .text-container-1, .text-container-2, .text-container-3 {
        padding: 0 11vw 0 11vw;
    }
    .info-section {
        width: 85%;
    }
    .info-section-1 {
        flex-direction: column-reverse;
    }
    .info-section-2 {
        flex-direction: column-reverse;
    }
    .text-container-3 {
        margin: 2vw 0vw;
    }
    /* About US end*/

    /* our services */
    .service {
        flex-direction: column;
    }
    .service h2 {
        font-size: 4vw;
    }
    .service p {
        font-size: 2.3vw;
    }
    .service-divider {
        width: 77%;
        height:0.6vw;
    }
    .service-divider-v2 {
        width: 25vw;
        height:0.5vw;
    }
    .service-img {
        width: 100%;
        height: 100%;
    }
    .service-1 .service-image {
        order: 2;
        padding: 0 4vw 4vw 4vw;
    }
    .service-2 .service-text {
        order: 1;
        padding: 3vw 2vw 0 5vw;
    }
    .service-2 .service-image {
        order: 2;
        padding: 0 4vw 4vw 4vw;
    }
    .service-3 .service-image {
        order: 2;
        padding: 0 4vw 4vw 4vw;
    }
    .service-4 .service-text {
        order: 1;
        padding: 0vw 2vw 0 5vw;
    }
    .service-4 .service-image {
        order: 2;
        padding: 0 4vw 4vw 4vw;
    }
    .service-3 .service-text {
        order: 1;
        padding: 3vw 2vw 0 5vw;
    }
    .services-header {
        margin: 2vw 0 0 0; /* Adjust as needed */
    }
    .services-title {
        font-size: 5vw;
    }
    .services-divider {
        width: 50%;
        height: 0.3vw;
        margin-right: 1vw;
    }
    /* Project section */
    .projects {
        height: auto;
        flex-direction: column;
    }
    .second-project-separator{
        height:auto;
    }
    .second-project-separator-logo {
        width: auto;
        height: 10vw;
        margin-bottom: 1vw;
    }
    .second-project-separator-text-container {
        margin-bottom: 0.5vw;
        font-size: 2vw ;
    }
    .second-project-separator-text-2 {
        padding: 0 20vw 0 20vw;
        font-size: 3vw;
        letter-spacing: 1px;
        width: 100%;
    }
    .third-project-separator {
        height:6vh;
        margin: 0;
    }
    .featured-projects-header {
        margin: 2vw 0 0 0; /* Adjust as needed */
    }
    .featured-projects-title{
        font-size: 5vw;
    }
    .featured-projects-divider {
        width: 35%;
        height: 0.3vw;
        margin-left: 1vw;
    }
    .project-detail {
        width: 75%;
        margin: 1vw 0;
    }
    .project-text {
        width: 100%;
        align-items: center;
        text-align: center;
    }
    .project-image {
        width: 65%;
        height: auto;
        margin-right: 1vw;
    }
    .project-info {
        font-size: 2.5vw;
    }
    .project-description {
        font-size: 2vw;
    }
    .project-info-v2 {
        font-size: 2.5vw;
    }
    .project-description-v2 {
        font-size: 2vw;
    }
    .project-divider {
        width: 55%;
        height: 0.5vw;
    }
    /*Projects in detail section end */

    /* Gallery items start */
    .caption {
        font-size: 2vw;
    }
    .gallery-item:hover .caption {
        opacity: 0.5;
    }
    .gallery-item:hover .gallery-img {
        transform: scale(1);
        filter: brightness(0.7);
    }
    .gallery-item:hover .caption {
        opacity: 1;
    }
    /* Gallery items end */

    /* Top Clients start */
    .top-clients {
        padding: 2vw 0 0 0;
    }
    .top-clients-text{
        color: black;
        margin-bottom: 2vw;
        font-size: 3.5vw;
    }
    .top-img {
        max-width: 100%;
        height: auto;
    }
    /* Top Clients end */

    /* Contact Us start */
    .contact-separator {
        height:3vw;
    }
    .contact-section {
        height: 30%;
        width: 100%;
    }
    .content-box {
        padding: 5px;
        height: auto;
        width: 100%;
        max-width: 80%;
        margin:0 0 0 0;
        flex-direction: column;
    }
    .contact-info {
        max-width: 70vw;
        height:auto;
        margin: 2% 0 2% 4%;
    }
    .contact-form {
        width: 100vw;
        height: 100%;
        margin: 4% 0 4% 4%;
    }
    .contact-form h3, .contact-info h3 {
        font-size: 5vw;
    }
    .contact-info p, .contact-form p{
        font-size: 2.8vw;
    }
    .contact-paragraph {
        font-size: 2.8vw;
        width: 69vw;
    }
    .contact-item {
        margin-bottom: 0vw;
        width: 70vw;
    }
    .contact-text {
        font-size: 1.6vw;

    }
    .contact-map {
        width: 72vw;
        height: 50vw; /* Adjust this height as needed */
        border: 0;
        padding: 1vw 1vw 1vw 0;
    }
    .socials{
        width:8vw;
        height:auto;
    }
    .extra-logo {
        width: 40px;
        height: 40px;
        margin: 0 0 0 0;
    }
    .logo-row {
        gap: 2vw;
        margin: 3% 0 5% 0;
    }
    .contact-form h3 {
        padding-bottom: 7px;
        font-size: 5vw;
    }
    .contact-form h3::after {
        width: 60%;
        height: 3px;
    }
    .input-row {
        flex-direction: row;
        gap: 10px;
        width: 70vw;
    }
    .input-container {
        flex: 1;
        margin: 0 0 0 0;
        width: 70vw;
    }
    .input-box, .message-box {
        width: 100%;
        padding: 5px;
        margin-top: 0px;
        margin-bottom: 10px;
        margin-right: 0.5vw;
        font-size: 2.5vw;
    }
    .submit-button {
        font-size: 2.5vw;
    }
    .contact-icon {
        width: 25px;
        height: 25px;
        margin: 1% 3% 0 0;
    }
    .message-box {
        resize: vertical;
        min-height: 15vw;
        height: 20vw;
        width:70vw;
    }
    /* Contact Us end */
    .footer {
        flex-direction: column;
        text-align: center;
        height: auto;
        font-size: 13px;
    }
    .footer .container-fluid {
        width: auto;
        margin: 0;
        text-align: center;
        margin-bottom: 10px;
        height: auto;
    }
    .footer .row {
        flex-direction: column;
        justify-content: center;
        align-items: center;
        text-align: center;
    }
    .footer .footer-item1 {
        text-align: center;
    }
    .footer .footer-item2 {
        text-align: center;
    }
    .footer .mid {
        display: none; /* Hide the middle empty column */
    }
    .footer-icon {
        display: block; /* Ensures the image is treated as a block element */
        margin-left: auto; /* Centers the image horizontally */
        margin-right: auto; /* Centers the image horizontally */
        margin-bottom: 2vw;
        margin-top: 0;
    }
    .footer-link {
        margin-bottom: 0;
    }
    .footer-item1 {
        display: flex;
        align-items: center;
        justify-content: center; /* Center align content horizontally */
    }
    /*Company Serve and Stats section Start*/
    #company-stats{
        display: grid;
        grid-template-columns: 100%;
        width: 100%;
        height:auto;
        margin: 0 auto;
        justify-items: center;
    }
    .service-map{
        height:60vw;
        width: 100%;
        object-fit: fill;
    }
    /*Company Serve and Stats section Ends*/
    /*Slideshow section starts*/
    .mySlides {
        display: flex;
        z-index:0;
        margin: 0 0 0 0;
        height: 56vw;
        width: 100%;
    }
    .slide-img {
        height:100%;
        width: 100%;
        object-fit: fill;
    }
    .slide-text{
        top: 20%;  /* Adjusts the vertical position */
        left: 2%;  /* Adjusts the horizontal position towards the left */
        padding: 5px;
    }
    .slide-text h1 {
        margin: 0;
        font-size: 6vw;
        text-shadow: 0.5px 0.5px #252424;
    }
    .slide-text p {
        font-size: 1.8vw;
        margin: 0;
        text-shadow: 0.5px 0.5px #252424;
    }
    .mySlides:nth-child(1) .slide-text{
        top: 10%;  /* Adjusts the vertical position */
        left: 5%;
    }
    .slide-svg_seal{
        height: 4rem;
        margin-top: 0.3rem;
        margin-left: 0.2rem;
    }
    /*Slideshow section ends*/
}
/* Sizing styles end */

.main-content {
    visibility: visible;

    flex: 1;
    display: flex;
    flex-direction: column;
    justify-content: center;
    background-color: transparent;
}