@media (max-width: 900px) {





.top-border{
    padding: 0.2rem;
}


.navbar{
    padding: 1rem 1rem 1rem 1rem;
    background-color: #ffffff !important;
}

.navbar ul{
    padding-left: 1rem;
}

.navbar ul li a{
    font-size: 0.8rem;
    margin-right: 1rem;
}

.navbar .nav-sign-in{
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.6rem 1rem;
}

.navbar .nav-log-in{
  font-size: 0.8rem;
  font-weight: 600;
  padding: 0.6rem 2rem;
  border: 2px solid #2a99d6;
  border-radius: 8px;
}

.navbar .nav-logo{
    width: 8rem;
    height: auto;

}





#who-we-are{                                       /*---CSS Starts---*/
    padding: 3rem 1rem 5rem 1rem;
    min-height: 90vh;
}


#who-we-are h2{
    font-size: 1.2rem;
}

#who-we-are h1{
    font-size: 3rem;
    line-height: 3rem;
}

#who-we-are p{
  font-size: 0.9rem;
  line-height: 1rem;
}


.learn-more{
    font-size: 0.9rem;
    padding: 0.6rem 1.6rem;
}

#who-we-are .col-md-6{
    padding: 0rem 0rem;
    position: relative;
}


#who-we-are .col-md-6 input{
 padding: 2rem 1rem !important;
}

#who-we-are .submit-btn{
 top: 10%;
 right: 2%;
 padding: 0.8rem 2rem;
 font-size: 1rem;
}


::placeholder {
  font-size: 0.9rem !important;
}

:-ms-input-placeholder { 
  font-size: 0.9rem !important;
}

::-ms-input-placeholder { 
  font-size: 0.9rem !important;                             /*---CSS Ends----*/
}





#scroller-outer{
    display: none;
}





#our-products{                                     /*---CSS Starts----*/
        padding: 4rem 2rem 2rem 2rem;       
}

#our-products h2{
    font-size: 1.2rem;
}


#our-products h1{
    font-size: 3rem;
    line-height: 3rem;
    font-weight: 600;
}

#our-products p{
  font-size: 0.9rem;
  line-height: 1.2rem;
  color: #5c728d;
}


.product-outer{
    text-align: center;
    padding: 2rem 2rem;
}


.product-outer h3{
    margin-top: 3rem !important;
    font-size: 1.4rem;
}

.explore-btn{
    padding: 0.6rem 2rem;
    font-size: 1.2rem;

}



.product-outer .product-img{
    width: 10rem;
    margin-left: 0rem;
}                                          /*---CSS Ends----*/








#our-vision{                                                               /*---CSS Starts----*/
  padding: 4rem 2rem 0rem 2rem;   
  background-image: url("../images/background/our-vision-bg.jpg"); /* The image used */
  background-color: #ffffff; /* Used if the image is unavailable */
  width: 100%;
  height: auto; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
  text-align: center;
}

#our-vision h2{
    font-size:3rem;
    font-weight: 600;
    color: #ffffff;
}


#our-vision p{
    font-size: 0.9rem;
    color: #ffffff;
    opacity: 0.8;
    width: 100%;
    line-height: 1.1rem;
}


.our-vision-img{
    width: 100%;
    position: relative;
    margin-top: 20rem;
                           /*---CSS Ends----*/
}








#project-overview{                                     /*---CSS Starts----*/
        padding: 3rem 1rem 4rem 1rem;       
}

#project-overview h2{
    font-size: 1.2rem;
    font-weight: 300;
    color: #29a5de !important;
}


#project-overview h1{
    font-size: 3rem;
    font-weight: 600;
    line-height: 3rem;
}

#project-overview p{
  font-size: 1rem;
  line-height: 1.2rem;
  color: #5c728d;
}

#project-overview .nav-item{
 width: 33.33%;
 padding: 0.3rem;
}

#project-overview .nav-item a{
 border: none !important;
 border-bottom: 3px solid #d4e8f6 !important;
 font-size: 1rem;
 font-weight: 500;
 color: #acb5c2;
 line-height: 1.3rem;
 padding: 1rem 0rem;
}

#project-overview .nav-item .active{
 border-bottom: 3px solid #2a91d1 !important;
  font-weight: 600;
  color: #172d48;
}


#myTabContent{
    padding: 3rem 1.5rem;
}

#myTabContent p{
 font-size: 1rem;
}

#myTabContent span{
  font-weight: 600;
  color: #29a5de;
}

.blank-div{
    width: 95%;
    min-height: 10rem;
    border-radius: 10px;
    height: auto;
    margin: 0 auto;
    background-color: #e6f2fa;
}                                                                   /*---CSS Ends---*/






#project-overview-slider{                           /*---CSS start*/
    padding-bottom: 5rem;
    padding-left: 1rem;
    padding-right: 1rem;
}

    #overview-slider .item{
    padding: 1rem;
    }

    #overview-slider .item img{
     margin-bottom: 1.5rem;
    }

    #overview-slider .item h2{
     font-size: 1.2rem;
    }

    #overview-slider .item p{
     font-size: 0.8rem;
    }

    #overview-slider .center p{
        display: block !important;
    }

    #project-overview-slider .my-previous-button{
        top: 20%;
        left: 1%;
    }

    #project-overview-slider .my-previous-button img{
        width: 2.5rem;
    }

    #project-overview-slider .my-next-button{
        top: 20%;
        right: 1%;

    }

    #project-overview-slider .my-next-button img{
        width: 2.5rem;
    }
                                                  /*---CSS Ends*/




 







 #contact-us{                                      /*---CSS Starts--*/
    padding: 3rem 1rem 3rem 1rem;
    text-align: center;
 }


.white-line{
    padding: 0.2rem;
    margin-top: 2rem;
}

#contact-us h2{
    font-size: 3.5rem;
}


#contact-us p{
    font-size: 0.8rem;
  line-height: 1.1rem;
  margin-top: 1rem;
}

#contact-us a{
    font-size: 1.4rem;
  line-height: 1.1rem;
  color: #000000;
}

                                                  /*---CSS Ends--*/







/*start css*/

.content-container {                                    
  display: flex;
  background-color: #2b83c7;
  padding: 3rem 1rem 3rem 1rem;
  background-image: url("./assets/images/background/product-bg.jpg"); /* The image used */
  background-color: #0090f9; /* Used if the image is unavailable */
  width: 100%;
  height: auto; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
  text-align: center;
}

.content-container  p, li {
  max-width: 800px;
}



.content-container > * {
  flex-basis: 100%;
}

.left-content {
  height: 100vh;
  position: relative;
}

.left-content img{
  width: 60%;
  margin-top: -8%;
  border-radius: 20px;
}


.left-content > * {
  position: absolute;
  left: 50%;
  top: 50%;
  opacity: 0;
  visibility: hidden;
}


.right-content {
  padding-right: 15px;
}

.right-content .product-icon{
  width: 3rem;
  height: auto;
}

.right-content h2{
    font-family: 'caros-regular', serif;
    font-weight: 600;
    line-height: 2rem;
    font-size: 2rem;
    color: #ffffff;
    margin-top: 6vh;
}

.right-content p{
   font-family: 'caros-regular', serif;
   font-size: 1rem;
   line-height: 1.4rem;
   margin-top: 4vh;
   color: #9ecaff;
}

.right-content a{
    color: #ffffff;
    font-family: 'caros-regular', serif;
    font-size: 1.1rem;
    font-weight: 600;
}

.right-content .height-padding{
    padding-top: 5vh;
    padding-bottom: 5vh;
}

.right-content .height-padding-top{
   padding-top: 0vh;
   padding-bottom: 15vh;
}

@media screen and (max-width: 900px) {
  .left-content {
    display: none;
  }
  .right-content {
    padding-left: 1rem;
  }
}



/*End css*/




 }









  @media (max-width: 1030px)  /*-----------13/10 inch laptop--------------*/
  and (min-width: 900px){
   
  
.top-border{
    padding: 0.2rem;
}


.navbar{
    padding: 2rem 8rem 2rem 7rem;
    background-color: #eff9fd !important;
}

.navbar ul{
    padding-left: 1rem;
}

.navbar ul li a{
    font-size: 0.9rem;
    margin-right: 1rem;
}

.navbar .nav-sign-in{
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.6rem 1rem;
}

.navbar .nav-log-in{
  font-size: 0.9rem;
  font-weight: 600;
  padding: 0.6rem 2rem;
  border: 2px solid #2a99d6;
  border-radius: 8px;
}

.navbar .nav-logo{
    width: 8rem;
    height: auto;

}




#who-we-are{                                       /*---CSS Starts---*/
    padding: 3rem 1rem 5rem 1rem;
}


#who-we-are h2{
    font-size: 1.2rem;
}

#who-we-are h1{
    font-size: 3rem;
}

#who-we-are p{
  font-size: 0.9rem;
  line-height: 1rem;
}


.learn-more{
    font-size: 0.9rem;
    padding: 0.6rem 1.6rem;
}

#who-we-are .col-md-6{
    padding: 0rem 0rem;
    position: relative;
}


#who-we-are .col-md-6 input{
 padding: 2rem 1rem !important;
}

#who-we-are .submit-btn{
 top: 10%;
 right: 2%;
 padding: 0.8rem 2rem;
 font-size: 1rem;
}


::placeholder {
  font-size: 0.9rem !important;
}

:-ms-input-placeholder { 
  font-size: 0.9rem !important;
}

::-ms-input-placeholder { 
  font-size: 0.9rem !important;                             /*---CSS Ends----*/
}






#our-products{                                     /*---CSS Starts----*/
        padding: 3rem 4rem 2rem 4rem;       
}

#our-products h2{
    font-size: 1.2rem;
}


#our-products h1{
    font-size: 3rem;
    font-weight: 600;
}

#our-products p{
  font-size: 0.9rem;
  line-height: 1.2rem;
  color: #5c728d;
}


.product-outer{
    padding: 2rem 2rem;
}


.product-outer h3{
    font-size: 1.4rem;
}

.explore-btn{
    padding: 0.6rem 2rem;
    font-size: 1.2rem;

}



.product-outer .product-img{
    width: 10rem;
    margin-left: 0rem;
}                                          /*---CSS Ends----*/





#our-vision{                                                               /*---CSS Starts----*/
  padding: 4rem 10rem 6rem 10rem;   
  background-image: url("../images/background/our-vision-bg.jpg"); /* The image used */
  background-color: #ffffff; /* Used if the image is unavailable */
  width: 100%;
  height: auto; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}

#our-vision h2{
    font-size:3rem;
    font-weight: 600;
    color: #ffffff;
}


#our-vision p{
    font-size: 0.8rem;
    color: #ffffff;
    opacity: 0.8;
    width: 80%;
    line-height: 1.1rem;
}


.our-vision-img{
    width: 30rem;
    height: auto;
    position: absolute;
    top: -30%;                             /*---CSS Ends----*/
}









#project-overview{                                     /*---CSS Starts----*/
        padding: 6rem 10rem 6rem 10rem;       
}

#project-overview h2{
    font-size: 1.2rem;
}


#project-overview h1{
    font-size: 3rem;
}

#project-overview p{
  font-size: 0.9rem;
}

#project-overview .nav-item{
 padding: 0.8rem;
}

#project-overview .nav-item a{
 font-size: 1.4rem;
 padding: 1.5rem 0rem;
}


#myTabContent{
    padding: 2.5rem 1.5rem;
}

#myTabContent p{
 font-size: 0.9rem;
}

.blank-div{
    width: 95%;
    min-height: 10rem;
    border-radius: 10px;
    height: auto;
    margin: 0 auto;
    background-color: #e6f2fa;
}                                                                   /*---CSS Ends---*/









#project-overview-slider{                           /*---CSS start*/
    padding-bottom: 5rem;
}

    #overview-slider .item{
    padding: 1rem;
    }

    #overview-slider .item img{
     margin-bottom: 1.5rem;
    }

    #overview-slider .item h2{
     font-size: 1rem;
    }

    #overview-slider .item p{
     font-size: 0.6rem;
    }

    #overview-slider .center p{
        display: block !important;
    }

    #project-overview-slider .my-previous-button{
        top: 60%;
        left: 33%;
    }

    #project-overview-slider .my-previous-button img{
        width: 2.5rem;
    }

    #project-overview-slider .my-next-button{
        top: 60%;
        right: 33%;

    }

    #project-overview-slider .my-next-button img{
        width: 2.5rem;
    }
                                                  /*---CSS Ends*/













 #contact-us{                                      /*---CSS Starts--*/
    padding: 4rem 10rem 4rem 10rem;
 }


.white-line{
    padding: 0.2rem;
    margin-top: 2rem;
}

#contact-us h2{
    font-size: 3rem;
}


#contact-us p{
    font-size: 0.8rem;
  line-height: 1.1rem;
  margin-top: 0.5rem;
}

#contact-us a{
    font-size: 1.4rem;
  line-height: 1.1rem;
  color: #000000;
}

                                                  /*---CSS Ends--*/





/*start css*/

.content-container {                                    
  display: flex;
  background-color: #2b83c7;
  padding: 4rem 1rem 20vh 1rem;
  background-image: url("./assets/images/background/product-bg.jpg"); /* The image used */
  background-color: #0090f9; /* Used if the image is unavailable */
  width: 100%;
  height: auto; /* You must set a specified height */
  background-position: center; /* Center the image */
  background-repeat: no-repeat; /* Do not repeat the image */
  background-size: cover; /* Resize the background image to cover the entire container */
}

.content-container  p, li {
  max-width: 800px;
}



.content-container > * {
  flex-basis: 100%;
}

.left-content {
  height: 100vh;
  position: relative;
}

.left-content img{
  width: 60%;
  margin-top: -8%;
  border-radius: 20px;
}


.left-content > * {
  position: absolute;
  left: 50%;
  top: 50%;
  opacity: 0;
  visibility: hidden;
}


.right-content {
  padding-right: 15px;
}

.right-content .product-icon{
  width: 3rem;
  height: auto;
}

.right-content h2{
    font-family: 'caros-regular', serif;
    font-weight: 600;
    line-height: 2rem;
    font-size: 2rem;
    color: #ffffff;
    margin-top: 6vh;
}

.right-content p{
   font-family: 'caros-regular', serif;
   font-size: 1rem;
   line-height: 1.4rem;
   margin-top: 4vh;
   color: #9ecaff;
}

.right-content a{
    color: #ffffff;
    font-family: 'caros-regular', serif;
    font-size: 1.1rem;
    font-weight: 600;
}

.right-content .height-padding{
    padding-top: 5vh;
    padding-bottom: 35vh;
}

.right-content .height-padding-top{
   padding-top: 0vh;
   padding-bottom: 15vh;
}

@media screen and (max-width: 900px) {
  .left-content {
    display: none;
  }
  .right-content {
    padding-left: 1rem;
  }
}



/*End css*/










  }






  @media (max-width: 1930px)  /*-----------23/24 inch laptop--------------*/
  and (min-width: 1820px){



  }