* {
   padding: 0;
   margin: 0;
   box-sizing: border-box;
 }
 img {
   max-width: 100%;
 }
 .top {
   position: sticky;
   top: 0;
   z-index: 99;
   background-color: white;
  }
  .header
  {
    display: flex;
    background-color: #0088cc;
    justify-content: space-between;
    padding-top: 10px;
    padding-bottom: 5px;
  }
  .logo  {
   margin-left: 2%;
  }
  .logomobile {
    display: none;
    }
 .title {

   color: white;
   padding-top: 2%;
   margin-left: -9%;    /*to decrease justify distance b/n logo and title */

 
 }
 .titleam
 {
    font-size: 18px;
    
 }
 .titleen {
    font-size: 13px;
    text-align: center;
 }
 .search {
   display: flex;
   gap: 5px;
   margin-top: 30px;
  
  }
  .search input {
    margin-top: 3px;
    height: 30px;
    background-color:white;
    border: 2px solid white;
    width: 180px;
    border-radius: 5px;
    outline: none;
    font-size: 16px;
  }
 .searchicon {
    color: white;
    cursor: pointer;
   
 }
 .socialmediapanel {
   
   display: flex;
   flex-direction: column;
   /* justify-content: end; */
   justify-content: center;
   
 }
 .socialmediacontent {

    display: flex;
    gap: 20px;
  
 }
 .icon-circle-border {
   display: inline-block;
   width: 25px;
   height: 25px;
   border: 2px solid white; /* white border */
   border-radius: 50%; /* Makes it circular */
   text-align: center;
   line-height: 18px; /* Centers the icon vertically */
 
}
.noborder {
   border: none;
}
.lan {

   margin-top: 35px;
   margin-right: 2%;
}
.lanlist ul {

   list-style: none;
}
.lanlist ul a {
   padding: 10px;
   margin-bottom: 5px;
   color: white;
  
}
.lanmobile {
  display: none;
  background-color: #0088cc;

}
 /* menu start */
.menucontainer {
  height: 29px;
  font-family: " Times new roman", sans-serif;
}
.menucontainer ul{
   display: flex;
   list-style: none;
   justify-content: center;
   gap: 70px;
   background-color: #274c9d;
   color: white;
   font-size: 14px;
   padding: 5px;
   margin-top: 0.5px;
 }
 .menucontainer ul a {       /*for menu without dropdown a */
   text-decoration: none;
   color: white;
   font-size: 14px;
 }

 .dropbtn {
   background-color:inherit;
   color: white;
   padding: inherit;
   font-size: inherit;
   border: none;
  
 }
 
 .dropdown {
   position: relative;
   display: inline-block;
   
 
 }
 
 .dropdown-content {
   display: none;
   position: absolute;
   background-color: rgb(223, 217, 217);
   min-width: 260px;
   box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
   z-index: 1;
   /* margin-left: -70px;     */
  /* to center the dropdown   */
 }
 .menucontainer div a {     /*for menu with dropdown a */
   color: black;
   display: block;
   padding-top: 20px;
   padding-left: 50px;
   padding-bottom: 5px;
 }
 
 .dropdown-content a:hover { background-color: rgb(197, 195, 195);}
 
 /* .dropdown:hover .dropdown-content {display: block;}  this handle using js*/ 
 
 .dropdown:hover .dropbtn {background-color:inherit;}

/* menu end */
/*... panel start.... */



 .panel {
  
   margin-bottom: 0px;
}
/* list style for panel content */
.panel li {
  list-style: none;
  position: relative;
  padding: 0 0 0 20px;
  margin: 10px;
  
}
        
.panel li::before {
  content: ""; 
  position: absolute; 
  left: 0; 
  top: 4px; 
  border: solid 8px  #0088cc;;
  border-radius: 8px;
}

.panel li::after {
  content: ""; 
  position: absolute; 
  left: 7px;
  top: 7px;
  width: 3px;
  height: 6px;
  border: solid white;
  border-width: 0 2px 2px 0;
  transform: rotate(45deg);
}
/* end of list style for panel */
.middlepanel  {
   text-align: justify;
   font-family: " Times new roman", sans-serif,ui-sans-serif, system-ui, -apple-system, BlinkMacSystemFont, Segoe UI, Roboto, Helvetica Neue, Arial, Noto Sans, sans-serif, Apple Color Emoji, Segoe UI Emoji, Segoe UI Symbol, Noto Color Emoji;
   /* font-family: "Moderustic", sans-serif; */

   font-style: normal;
   font-size: 17px;
   font-weight: 400;
  line-height: 26px;
  color: rgb(17, 24, 39);

}
/* photo section -container */ 
.photocontent {
  display: flex;
  flex-direction: column;
  justify-content: center;
  align-items: center;
 
  margin: 0;
 


}

.slider {
  width: 1280px;  /* orginal photo width*/
  height: 550px; /* Keep the height to 550px as desired */
  margin: 0 auto;
  overflow: hidden;
  position: relative;
  border-radius: 10px;
  box-shadow: 0 4px 8px rgba(0, 0, 0, 0.2);
}

.slide-track {
  display: flex;
  transition: transform 0.5s ease;
  width: calc(1280px * 12); /* 6 originals + 6 duplicates */
}

.slide {
  width: 1280px;
  height: 550px;
  object-fit: cover; /* Ensures the image fills the container */
  background-color: #f0f0f0; /* Optional: background color for visual consistency */
}
.caption {
  position: absolute;
  bottom: 0;
  width: 100%;
  padding: 10px;
  color: #fff;
  background: rgba(0, 0, 0, 0.6);
  font-size: 24px;
  text-align: center;
}
.arrow {
  position: absolute;
  top: 50%;
  transform: translateY(-50%);
  color: white;
  cursor: pointer;
  font-size: 40px;
  z-index: 2;
}

.arrow.left {
  left: 1px;


}

.arrow.right {
  right: 1px;
}

/* photo end */

/* middle panel general style  */

  .missiontext,
  .contactusconetent,
  .hirepurchasecontent,
  .aboutuscontent,
  .financialleasecontent,
  .reportcontent,
  .plancontent,
  .requirementcontent,
  .stakeholderscontent,
  .faqcontent,
  .traningcontent,
  .consultancycontent,
  .newscontent,
  .leasefinancecontent,
  .announcementcontent,
  .hirepurchasecontentonhome,
  .financialleasecontentonhome,
  .requirementcontentonhome
 {
   margin: 40px 80px;
  }
.requirementcontentonhome {
  align-self: flex-start;
}
  .subtitle
   {
   color: blue;
   
  }
 /* marigin top for sector on home and service */
  .hirepurchasecontentonhome .subtitle,
  .financialleasecontentonhome .subtitle,
  .hirepurchasecontent .subtitle,
  .financialleasecontent .subtitle {
    margin-top: 20px;
  }
  .mission i,
  .vision i,
  .values i
  {
    font-size: 50px;
    color: #0088cc;
    margin-top: 20px;
   
  }
.valuecontent i,
.stackholderscontent i,
.hirepurchasecontent i,
.financialleasecontent i,
.plancontent i,
.financialleasecontentonhome i
  {
    font-size: 30px;
    color: #0088cc;
  }
  .requirementcontentonhome ul li,
  .hirepurchasecontentonhome ul li,
  .financialleasecontentonhome ul li,
  .hirepurchasecontent ul li,
  .financialleasecontent ul li,
  .plancontent ul li,
  .requirementcontent ul li,
  .contactusconetent ul li,
  .stakeholderscontent ul li,
  .faqcontent ul li,
  .traningcontent ul li{
   margin-left: 30px;
  }
  .dcenter {
    display: flex;
    justify-content: center;
    align-items: center;
  }
  .each_title{
    color: blue;
    font-size: 18px;
    font-weight: bold;
   }
   .iconsubtitle {
     display: inline-block;
     font-size: 30px;
   }
   .contenttitle {
   
    color: #0088cc;
    font-size: 40px;
    margin-bottom: 15px;
  }
  
  .dflex {
    display: flex;
    justify-content: space-between;
    gap: 40px;
  }
  .hirepurchasecontentonhome .each_subtitle,
.financialleasecontentonhome .each_subtitle,
.requirementcontentonhome .each_subtitle
 {
  font-size: 30px;
  color: #0088cc;
 }
 .reqonhome_title {
  font-size: 20px;
  color: #0088cc;
 }
  .brochuercontent {

   margin-top: 40px;
  }
  .brochuercontent div {
   margin-bottom: 40px;
 
  }
  .nocontent {
   
    text-align: center;
    height: 300px;
    font-weight: bold;
    font-size: 25px;
    display: flex;
    flex-direction: column;
    justify-content: center;

  }

  .headofficecontact  {
    display: flex;
    /* flex-direction: column; */
    justify-content: center;
    align-items: center;
   
   }

  .missiontext p{
    font-size: 13px;
   font-weight: bold;
   color: black;
  
  }
 
 
 
 
  .missiontitle,
  .visiontitle,
  .valuestitle
  {
    color:blue ;
    font-size:40px ;
    padding: 10px;
    display: inline-block;
    
   
    
  }
  .values {
   width: 70%;
  margin: 0 auto;
  }

  .faqquestions div {
    margin-left: 60px;
  }
  .faqquestions i {
    font-size: 20px;
    color: #0088cc;
   
  }
 .faqquestions p {
    font-size: 16px;
   
  }
  .faqcontent .contenttitle {
    font-size: 24px;
  }

   .hirepurchasecontentonhome .each_subtitle {
    margin-top: 50px;
   }
   .financialleasecontentonhome
   {
    margin-top: 0px;
   
   
   }
   .traningtopimagecon {
    background-image: url("../image/traningleasetwo.jpg");
    width: 100%;
    height:600px ;
    background-size: cover;
    background-repeat: no-repeat;
  

   }
   .trainingimagecontainer {
    background-image: url("../image/traninglease.jpg");
    background-repeat: no-repeat;
    background-size: contain;
    height: auto;
    width: 100%;
    background-position: center;
    /* border: 2px solid green; */
   }
   .traningcontentlist {
    text-align: left;
   }
  .branchcontacttitle {
    margin-top: 70px;
    margin-bottom: 20px;
   
  }
/* brocher slide start here */

.image-container {
  position: relative;
  width: 100%;
  
  overflow: hidden;
  display: flex;
  gap: 30px;
  flex-direction: column;
  justify-content: center;
}
.image-slide
 {

  opacity: 0;
  transform: translateX(-100%);
  transition: transform 1s ease, opacity 1s ease;
  border: 2px solid #0088cc;
 
}
/* Class to apply the slide-in effect */
.image-slide.visible{
  transform: translateX(0%);
  opacity: 1;
}



/* end of brocher slide */


  /* end of middle panel general style  */


/* footer sytle start */

.footer {
   background-color: #2c3e50;
  
 }
.footercontent {
   padding: 20px;
   color: white;
   display: flex;
   justify-content: space-around;
  
} 
.footersocial {
  display: flex;
  flex-direction: column;
  justify-content: space-around;
 
}
.usefulLinks h4,
 .contactInfo h4{
   margin-bottom: 30px;
 }
 .usefulLinks,
 .contactInfo {
   text-align: left;
 }
 
 .usefulLinks ul {
   list-style: none;
   padding: 0;
 }
 
 .usefulLinks li {
   margin-bottom: 10px;
 }
 
 .usefulLinks a,
 .contactInfo a {
   color: white;
   text-decoration: none;
   transition: color 0.3s; /* Smooth color transition */
 }
 
 .usefulLinks a:hover,
 .usefulLinks a:focus,
 .contactInfo a:hover,
 .contactInfo a:focus {
   color: #007bff;
   outline: none;
   box-shadow: 0 0 5px rgba(0, 123, 255, 0.5); /* Shadow for focus */
 }
 .contactInfo p{
   padding: 5px;
 }
 .copyright {
   text-align: center;
  color: white;
  font-size: small;

 
}
.copyright i {
   border-top: 1px solid white;
   padding-top: 13px;

}
/* end of footer sytle  */
/* media query for mobile screen */
@media (max-width: 768px) {
  .header
  {
    display: flex;
    background-color: #0088cc;
   justify-content: center;
   /* gap: 35px; */
    padding-top: 5px;
    padding-bottom: 3px;
   
  }
 .logo{
 display: none;
 }
 .logomobile {
 display: block;

 }

 .title {

  color: white;
  padding-top: 0;
  margin-left: 0%;

 }

 .titleam
 {
    font-size: 8px;
    padding: 5px;
   padding-bottom: 0px;
   

 }
 .titleen {
    font-size: 6px;
    text-align: center;
 }
.search {
  display: none;

 }
 .socialmediapanel {
   
 display: none;
 
  
}

.lan {
 display: none;
 
}
.lanmobile {
  display: block;
  position: relative;
  left: 20%;

}
.lanmobile select {
  background-color: #0088cc;
  color: white;
  border: none;
  font-size: 8px;
 

}

 /* menu mobile start */
 .menucontainer {
  height: 15px;
  font-family: " Times new roman", sans-serif;
 
}
.menucontainer ul{
 
   justify-content: space-around;
   gap: 15px;
   font-size: 8px;
 
 }
 .menucontainer ul a {       /*for menu without dropdown a */
  
   font-size: 8px;
 }

 .dropdown-content {
 
   min-width: 160px;
 
  
 }
 .menucontainer div a {     /*for menu with dropdown a */

  padding-top: 15px;
  padding-left: 38px;
  padding-bottom: 5px;
}
.slider {
  width: 360px;  /* orginal photo width*/
  height: 200px; /* Keep the height to 550px as desired */
 background-size: cover;
 margin-top: 5px;
 
}

.slide-track {
  display: flex;
  transition: transform 0.5s ease;
  width: calc(360px * 12); /* 6 originals + 6 duplicates */
 
}

.slide {
  width: 360px;
  height: 200px;
  background-size: cover;

}
.caption {

  font-size: 10px;
 
}
.arrow {

  font-size: 20px;
 
}
.contenttitle {
   
  color: #0088cc;
  font-size: 20px;
 
}
.hirepurchasecontentonhome .each_subtitle,
.financialleasecontentonhome .each_subtitle,
.requirementcontentonhome .each_subtitle
 {
  font-size: 20px;
  color: #0088cc;
 
 
 }
 .dflex {
  display: block;
}

.iconsubtitle {
  display: inline-block;
  font-size: 13px;
}
.mission i,
.vision i,
.values i
{
  font-size: 30px;
  color: #0088cc;
  margin-top: 20px;
 
}
.missiontext,
.contactusconetent,
.hirepurchasecontent,
.aboutuscontent,
.financialleasecontent,
.reportcontent,
.plancontent,
.requirementcontent,
.stakeholderscontent,
.faqcontent,
.traningcontent,
.consultancycontent,
.newscontent,
.leasefinancecontent,
.announcementcontent,
.hirepurchasecontentonhome,
.financialleasecontentonhome,
.requirementcontentonhome

{
 margin: 40px 40px;
}
.valuecontent i,
.stackholderscontent i,
.hirepurchasecontent i,
.financialleasecontent i,
.plancontent i,
.financialleasecontentonhome i  {
 
    font-size: 14px;
    color: #0088cc;
   
  }
  .bold {
    font-weight: bold;
  }
.missiontext p{
    font-size: 10px;
    font-weight: bold;
    line-height: 16px;

  }

 
  .missiontitle,
  .visiontitle,
  .valuestitle
  {
    
    font-size:20px ;
  }
  .values {
    width: auto;
  
   }
   .traningtopimagecon {
    background-image: url("../image/traningleasetwo.jpg");
    width: auto;
    height:150px ;
    background-size: cover;
    background-repeat: no-repeat;
  

   }
   .trainingimagecontainer {
   
    height: 210px;
    width: auto;
    background-size: cover;
    background-repeat: no-repeat;
    margin-top: 30px;
    
   }
    .nocontent {
   
    font-size: 15px;
   
  }
  .requirementcontent .contenttitle {
    font-size: 16px;
  }
  .contactusconetent .faqquestions div {
    margin-left: 0px;
  }
  .faqquestions div {
    margin-left: 20px;
  }
  .faqquestions i {
    font-size: 14px;
    color: #0088cc;
   
  }
 .faqquestions p {
    font-size: 12px;
   
  }
  .faqcontent .contenttitle {
    font-size: 16px;
  }
  .branchcontacttitle {
    margin-top: 20px;
    margin-bottom: 5px;
  }
  .footercontent {
    padding: 20px;
    color: white;
    display: flex;
    flex-direction: column;
    gap: 30px;
   
   
   
 } 
 .usefulLinks {
  order: 2;
 }
 .footersocial {
  order: 3;
  display: flex;
  flex-direction: row;
  justify-content: flex-end;
  gap: 30px;
  
 
 }
 .contactInfo p{
  padding: 0px;
}
.usefulLinks h4,
 .contactInfo h4{
   margin-bottom: 15px;
 }
  .copyright {
   
   font-size: 8px;
 
  
 }
}
/* media query for tablet screen */
@media (min-width: 768px) and (max-width: 1024px) {
  /* Tablet-specific styles */
  .search {
    display: none;
  
   }
   .title {
    margin-left: 0%;
  
   }
   .slider {
    width: 600px;  /* orginal photo width*/
    height: 400px; /* Keep the height to 550px as desired */
   background-size: cover;
   margin-top: 5px;
   
  }
  
  .slide-track {
    display: flex;
    transition: transform 0.5s ease;
    width: calc(600px * 12); /* 6 originals + 6 duplicates */
   
  }
  
  .slide {
    width: 600px;
    height: 400px;
    background-size: cover;
  
  }
  .caption {
  
    font-size: 15px;
   
  }
  .arrow {
  
    font-size: 25px;
   
  }
  .traningtopimagecon {
    background-image: url("../image/traningleasetwo.jpg");
    width: auto;
    height:400px ;
    background-size: cover;
    background-repeat: no-repeat;
   }
   
}