*{
    margin:0;
    padding:0;

}

body{

    margin-left: 5px;
    margin-right: 5px;

}

.firstheader{
    background-color:#27ae60;
    height:30px;
    margin-left: 10px;
    margin-right: 10px;
    margin-top: 0px;
    font-weight: bold;
}

.firstheader p{
    color: white;
    padding-top: 5px;
    font-family:'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
    font-size:14px;
}


.header{
    background-color:white;
    margin-left: 10px;
    margin-right: 10px;
    height:130px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-top: 0;
    position: sticky;
   
    }


    .headerc{
        background-color:white;
        margin-left: 10px;
        margin-right: 10px;
        height:120px;
        margin-top: 0;
        position: sticky;
       
        }

        .cbanner{
            margin-left: 10px;
            margin-right: 10px;
          
           
        }

        .cbanner img{
            width: 100%;
        }
    


    #endsec{
        align-items: center;
    }


.roundrect {
    border-radius: 15px;

    }


    #infodetail{
        margin-top:20px;
        margin-left:20px;
        margin-bottom:20px;
    }

    #infodetail2{
        margin-top:40px;
        margin-left:20px;
        margin-bottom:20px;
    }


    #serviceleft1{
        background-color:white;
        margin-left:80px;
        margin-right:857px;
        margin-top:10px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        margin-top:3px;
        margin-bottom:10px;
        padding:20px;
        font-size: 90%;
        height: 40%;
        box-shadow: 4px 7px 7px #D29DD8;
        font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
      }
     
        
        #servicesright1{
            background-color:white;
            margin-left:80px;
            margin-right:80px;
            margin-top:3px;
            margin-bottom:10px;
            border-bottom-left-radius: 5px;
            border-bottom-right-radius: 5px;
            padding:20px;
            font-size: 90%;
            float:right;
            width:720px;
            clear:right;
            box-shadow: 4px 7px 7px #D29DD8;
        }
    


    #contactinfo{
        background-color:white;
        margin-left:80px;
        margin-right:680px;
        margin-top:10px;
        border-radius: 5px;
        margin-bottom:10px;
        padding:20px;
        font-size: 90%;
        box-shadow: 5px 8px 8px #D29DD8;
      }
     



      .contactushead {
        font-size:18px;
        margin-bottom:0px;
        color:#232d60;
        background-color:#a9dfbf;
        margin-right:80px;
        margin-left:80px;
        margin-top:0px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        margin-bottom:10px;
        padding:20px;
        font-weight:normal;
        box-shadow: 2px 3px 3px #009688;
        font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
    }

      #contact-form{
        font-size: 18px;  
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS';
    }

    .form-control{

        width:720px;
        background: transparent;
        border:none;
        outline:none;
        border-bottom: 1px solid gray;
        color:black;
        font-size: 18px;
        margin-bottom: 16px;
        font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS';
    }

    
    input{
        height:45px;

    }

    form .submit{
        background:#ff5722;
        border-color:transparent;
        color:fff;
        font-size: 20px;
        font-weight: bold;
        letter-spacing: 2px;
        height:50px;
        margin-top: 20px;
    }

    form .submit:hover{
        background-color: #f44336;
        cursor:pointer;
    }

    .content2{
        font-weight:normal;
    }
    
.navbar{
    width:100%;
    margin:auto;
    padding:15px 0;
    display: flex;
    font-weight: bold;
    align-items: center;
    justify-content: space-between;
    margin-left: 0;

}



nav{
    font-size: 14px;
    flex:1;
    padding-left: 40px;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
   font-weight: bolder;
   display: block;
   text-align: left;

}

nav li a
{
    padding: 0 10px; /* Adjust the values as needed */

}

nav ul li{
    display:inline-block;
    list-style:none;
    margin:5px 10px;
    position: relative;

}

nav ul {
    padding: 0; /* Remove default padding */
    margin: 0; /* Remove default margins */
    text-align: center;
}

nav ul li a{
    text-decoration:none;
    color:#333;
    padding:10px;
    display: inline-block;

}



nav ul li a::after{
    content:'';
    height:3px;
    width:0;
    background: #6DBE48;
    position:absolute;
    left:0;
    bottom:-10px;
    transition: 0.5s;
   
}

nav ul li a:hover{
background: #6DBE48;
padding:10px;
color:white;

}



.content2 {
    font-size:18px;
    font-weight:lighter;
    margin-bottom:10px;
    color:#232d60;
    margin-left:220px;
    margin-right:220px;
    margin-top:0px;
    margin-bottom:10px;
    padding:20px;
    font-weight:normal;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
}

.content2 p{
    line-height: 1.8;

}

.welcome{
    padding-top: 40px;
    font-family:'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
    font-weight:bolder;
}

.welcome h1{
    color: white;
    animation-duration: 2s;
    animation-name: slide-in;
    font-size:45px;
}

.motto h4{
    color: white;
    font-family: 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
    font-weight:bolder;
    animation-duration: 3s;
    animation-name: slide-in1;
}


@keyframes slide-in {
    from {
      translate: 150vw 0;
      scale: 200% 1;
    }
  
    to {
      translate: 0 0;
      scale: 100% 1;
    }
  }
  

  @keyframes slide-in1 {
    from {
      translate: -150vw 0;
      scale: 200% 1;
    }
  
    to {
      translate: 0 0;
      scale: 1 100%;
    }
  }
  


.social-links a{
    text-decoration: none;
    color:#c96b9e;
    padding-right:20px;
    font-size:15px;
}

nav ul li:hover::after{
    width:100%;

}



span{
    background:#A010F3;
    height:100%;
    width:0;
    border-radius: 25px;
    position:absolute;
    left:0;
    bottom:0;
    z-index:-1;
    transition:0.5s;

}

button:hover span{
    width:100%;
    color:white;
}

button a:visited {
  
    text-decoration: none;
  }

  button:hover{
    border:none;
    color:white;
}

    .lis{
        font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
        font-size:14px;
        color:#3D7AE4;
        font-weight:bolder;
        text-align: right;
    }

    .intro{
        font-size:20px;
        font-weight:bold;
        margin-left:220px;
        margin-right:220px;
        margin-top:50px;
        padding-top: 5px;
        margin-bottom:0px;
        color:#232d60;
        font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
   
    }

    .bannerimage{
        margin-top: 70;
        background-image: linear-gradient(rgba(0, 0, 0, 0.5), rgba(0, 0, 0, 0.5)), url("images/tobbanner.png");
        height: 300px;
        background-position: center;
        background-repeat: no-repeat;
        background-size: cover;
        position: relative;
        margin-bottom: 0;
      
    }
    

.about{
    top:45px;
    font-size:20px;
    font-weight:bold;
    margin-left:220px;
    margin-right:220px;
    margin-top:20px;
    padding-top: 5px;
    margin-bottom:0px;
    color:#232d60;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
    background-color: #6DBE48;
}

.aboutdetail{
    font-size:18px;
    font-weight:lighter;
    margin-bottom:5px;
    color:#232d60;
    background-color:white;
    margin-left:220px;
    margin-right:220px;
    margin-top:0px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-bottom:10px;
    padding:20px;
    font-weight:normal;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
}


hr { 
    display: block;
    margin-top: 0.5em;
    margin-bottom: 0.5em;
    margin-left: auto;
    margin-right: auto;
    border-style: inset;
    border-width: 2px;
  } 

  
  .services{

    top:45px;
    font-size:20px;
    font-weight:bold;
    margin-left:90px;
    margin-right:90px;
    margin-top:10px;
    margin-bottom:0px;
    color:#0000ff;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
    background-color: #6DBE48;
    padding-top: 5px;
  }



.header img
{
    width:25%;
    height: 80%;
    margin-top:5px;
    margin-left:10px;
    margin-right:0px;
    padding-right:0px;
    float: left;
    position:absolute;
}

.headerc img
{
    width:25%;
    height: 80%;
    margin-top:5px;
    margin-left:10px;
    margin-right:0px;
    padding-right:0px;
    float: left;
    position:absolute;
}

  p.centered
{
  text-align:center;
  font-weight:lighter;

}

#bolder{
    font-weight: bolder;

}

  #servicebanner{
    background-color:white;
    margin-left:90px;
    margin-right:90px;
    margin-top:600px;
    border-radius: 5px;
    margin-bottom:5px;
    padding:20px;
    font-weight:normal;
    font-size: 18px;
    box-shadow: 2px 5px 5px #009688;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';

  }

  .servicebanner1{
    background-color:#d4efdf;
    margin-left:220px;
    margin-right:220px;
    margin-top:0px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-bottom:10px;
    padding:20px;
    font-weight:normal;
    font-size: 18px;
    box-shadow: 2px 5px 5px #009688;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';

  }

  .aboutbanner{
    background-color:#d4efdf;;
    margin-left:220px;
    margin-right:220px;
    margin-top:0px;
    border-bottom-left-radius: 5px;
    border-bottom-right-radius: 5px;
    margin-bottom:10px;
    padding:20px;
    font-weight:normal;
    font-size: 18px;
    box-shadow: 2px 5px 5px #009688;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';

  }

 
  #subservice{
    background-color:white;
    margin-left:200px;
    margin-right:150px;
    margin-top:5px;
    border-radius: 5px;
    margin-bottom:5px;
    padding:20px;
    font-size: 90%;
    box-shadow: 1px 3px 3px #009688;
    font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
  }


  #subservice img{
    display: flex;
    justify-content: center;
    align-items: center;
  }
    
      .imagec{
        background-color:white;
        margin-left:5px;
        margin-right:10px;
        margin-top:10px;
        padding:5px;
        float:left;
        border-radius: 15px;
      
      
        }

        .imagec img{
            width:50px;
            height:50px;
        }

        #footer{
            background-color:#154360; 
            margin-left:5px;
            margin-right:5px;
            margin-top:5px;
            margin-bottom:0px;
            height:90px;
            border-top-left-radius: 5px;
            border-top-right-radius: 5px;
            clear:both;
            color: #fff;
            text-align: center;
            padding:15px;
            font-size:70%;
            font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
        }

        #footer ul {
            margin:5px;
            border-radius: 5px;
            padding:5px;
            list-style-type:none;
            text-align:center;
            font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
            }
    
    
            #footer ul li {
                display:inline;
            }
    
            #footer ul li a {
                text-decoration: none;
                font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
                font-weight: light;
                padding:2em lem;
                color:#fff;
                background-color: #154360; 
                margin-left: 25px;
                margin-right: 20px;
                font-size:14px;
            }
    
            #footer ul li a:hover {
                color: #66415E;
                background-color: #fff;
            }

            #rfooter{
                background-color:  #154360; 
                margin-top:1px;
                padding-bottom:5px;
                padding:5px;
                font-size: 130%;
                float:right;
                clear:right;
                margin-bottom:0px;
                width:90%;
     
            }


            .dropdown {
                display: inline-block;
                position: relative;
             
              }

              .dropdown:hover{
                background-color:#6DBE48;
              }
              
              .dropdown-content {
                display: none;
                position: absolute;
                background-color:#6DBE48;
                width: 100%;
                box-shadow: 0px 8px 16px 0px rgba(0, 0, 0, 0.2);
                z-index: 1;
                width:442px; 
                padding-left: 5px;
                padding-right: 5px;
              }
              
              .dropdown-content a {
                color: white;
                padding-left: 50px;
                padding-right: 50px;
                text-decoration: none;
                display: block;
                text-align: left;
                white-space: nowrap;
           
              }

           
              
              .dropdown:hover .dropdown-content {
                display: block;
              }
              
              .dropdown-content ul {
                display: none;
                position: absolute;
                left: 100%;
                top: 75;
              }
              
              .dropdown-content:hover ul {
                display: block;
               
              }

              .dropdown-content a:hover {
                background-color: #232d60;
                text-align: left;
              }

    .servicebanner1 .image{
        background-color:#d4efdf;
        margin-left:10px;
        margin-right:20px;
        margin-top:10px;
        padding:5px;
        float:left;
    }

    .aboutbanner .imageabout{
        background-color:#d4efdf;
  margin-left: 250px;
  margin-right: 250px;   
        float:none;
        display: block;
        display: flex;
        justify-content: center
    }

      .image-container {
        position: relative; /* For positioning the popup text */
        display: inline-block; /* Allows the container to be inline */
      }
      
      .image-container .popup-text {
        display: none; /* Initially hide the popup text */
        position: absolute; /* Position it relative to the container */
        top: 100%; /* Position below the image */
        left: 0;
        background-color: rgba(0, 0, 0, 0.7); /* Optional: Add a background */
        color: white;
        padding: 5px;
        border-radius: 5px;
        z-index: 10; /* Ensure it appears above other elements */
      }
      
      .image-container:hover .popup-text {
        display: block; /* Show the popup text on hover */
      }


      .image-containerprev{
        display: block;
        margin-left: auto;
        margin-right: auto;
       
      }


      .aboutprev{
        font-size:18px;
        font-weight:lighter;
        margin-bottom:5px;
        color:#232d60;
        background-color:#d4efdf;
        margin-left:220px;
        margin-right:220px;
        margin-top:0px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        margin-bottom:10px;
        padding:20px;
        font-weight:normal;
        font-family:'CorisandeRegular', 'Roboto Condensed', 'Roboto', 'Aptos', 'DejaVu Sans';
    }




    

     
@media (max-width:768px){


    
    
    #rfooter{
        background-color: #154360; 
 
        font-size: 120%;
        text-align: center;
    }

    
.header{
    width:95%;   
    margin-left: 10px;
    margin-right: 10px; 
    height:70px;
    }

    .headerc{
        width:95%;   
        margin-left: 10px;
        margin-right: 10px; 
        height:70px;
        }

    #contacts{
        float:none;
    }


    #footer ul {
        display: none;
    }
    .logo{
     display:none;     
}


.nav a {
    float: none;
    width: 100%;
  }


nav ul {
    text-align: left;
    padding: 0; /* Remove default padding */
    margin: 0; /* Remove default margins */
}
nav ul li{

    margin:1px 2px;
    display: inline-block;
}

nav ul li a{
    color:#333;
  
}

nav ul li a::after{

    bottom:-1px;

}


.about{
    top:40px;
    font-size:18px; 
    margin-left:2px;
    margin-right:2px;
}


.aboutdetail{
    font-size:17px;
    margin-left:2px;
    margin-right:2px;
}


.aboutprev{
    font-size:17px;
    margin-left:2px;
    margin-right:2px;
}


.intro{
    margin-left:2px;
    margin-right:2px;
    margin-top:2px;
    margin-top:20px;
}


.content2{
    font-size:17px;
    margin-left:2px;
    margin-right:2px;
}



.social-links{
    display: none;
}
 
  .services{

    font-size:18px;
    margin-left:2px;
    margin-right:2px;
  }

    

    #servicebanner{
        background-color:white;
        margin-left:2px;
        margin-right:2px;
        margin-top:5px;
        border-radius: 5px;
        margin-bottom:5px;
        padding:10px;
        font-size: 15px;
        box-shadow: 2px 5px 5px #009688;
    }

    .servicebanner1{
        margin-left:2px;
        margin-right:2px;
        margin-top:0px;
        border-radius: 5px;
        margin-bottom:5px;
        padding:10px;
        font-size: 15px;
   
    }

    .aboutbanner{
        margin-left:2px;
        margin-right:2px;
        margin-top:0px;
        border-bottom-left-radius: 5px;
        border-bottom-right-radius: 5px;
        margin-bottom:5px;
        padding:10px;
        font-size: 15px;

    
      }




    #subservice{
        margin-left:1px;
        margin-right:1px;
        margin-top:3px;
        border-radius: 5px;
        margin-bottom:3px;
        padding:10px;
        font-size: 13px;
        box-shadow: 1px 2px 2px #009688;
      }
    
      #servicesright1{
        background-color:white;
        margin-left:3px;
        margin-right:3px;
        margin-top:5px;
        border-radius: 5px;
        margin-bottom:5px;
        padding:10px;
        font-size: 90%;
        box-shadow: 4px 7px 7px #D29DD8;
        width:auto;
        float: none;
        clear: none;
    }
    
        #serviceleft1{
            background-color:white;
            margin-left:3px;
            margin-right:5px;
            margin-top:5px;
            border-radius: 5px;
            margin-bottom:5px;
            padding:10px;
            font-size: 90%;
            box-shadow: 4px 7px 7px #D29DD8;
        }
        .contactushead{
            margin-left:2px;
            margin-right:2px;

        }



.header img
{
    width:30%;
    height: 70%;
    margin-top:5px;
    margin-left:10px;
    margin-right:0px;
    padding-right:0px;
}

.headerc img
{
    width:30%;
    height: 70%;
    margin-top:5px;
    margin-left:10px;
    margin-right:0px;
    padding-right:0px;

}
  
.form-control{

    width:420px;
                                                             
}

.imagec img{
    width:40px;
    height:40px;
}

.welcome h1{
    color: white;
    animation-duration: 2s;
    animation-name: slide-in;
    font-size:35px;
}

.motto h4{

    font-weight:lighter;

}



}