@charset "utf-8";

/* CSS Document */





@import url('https://fonts.googleapis.com/css2?family=Montserrat:ital,wght@0,100..900;1,100..900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,500;0,600;0,700;0,800;0,900;1,100;1,200;1,300;1,400;1,500;1,600;1,700;1,800;1,900&family=Quicksand:wght@300..700&family=Roboto:ital,wght@0,100;0,300;0,400;0,500;0,700;0,900;1,100;1,300;1,400;1,500;1,700;1,900&display=swap');

*::before,

*::after {

  -webkit-box-sizing: border-box;

  box-sizing: border-box; }

:root {

  

  --bs-white: #fff;

  --bs-gray: #6c757d;

  --bs-gray-dark: #343a40;

  --bs-primary: #00adef;

  --bs-secondary: #0f495f;

  }



*,

@media (prefers-reduced-motion: no-preference) {

  :root {

    scroll-behavior: smooth; } }



body {

  margin: 0;

font-family: "Quicksand", sans-serif;

  font-size: 17px;

  font-weight: 400;

  line-height: 1.5;

  color: #212529;

	

  background-color: #fff;
  background-color: #fff;

  -webkit-text-size-adjust: 100%;

  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);

  overflow-x: hidden;

  width: 100%;

   }



.section-padding{

	padding-top: 100px;

	padding-bottom: 0px !important;

}

h1,h2,h3,h4,h5,h6{

	/*font-family: "Poppins", serif;*/
	
font-family: "Quicksand", sans-serif;
}

a{

	text-decoration: none;

}

header{

	position: absolute;

	top: 0;

	z-index: 33;

	width: 100%;



}



.btn-default{

	position: relative;

	display: inline-block;

    /*background-image: linear-gradient(to right,rgba(0,173,239,1) 0%, rgba(7,92,152,1) 0%, rgba(0,173,239,1) 50%);*/
    background-image: linear-gradient(to right, rgb(76 63 152) 0%, rgb(71 44 112) 0%, rgb(107 84 165) 50%);

    background-size: 200% auto;

    border-radius: 100px;

    color: #fff;

    font-size: 16px;

    font-weight: 600;

	line-height: 1em;

    text-transform: capitalize;

    border: none;

    padding: 17px 54px 17px 20px;

    transition: all 0.4s ease-in-out;

	overflow: hidden;

	z-index: 0;

}



.btn-default:hover{

	background-position: right center;

}



.btn-default::before{

	content: '';

	position: absolute;

	top: -1px;

	bottom: 0;

	right: 0;

	width: 24px;

	height: 24px;

	background: url('../images/arrow-white.svg');

	background-repeat: no-repeat;

	background-position: center center;

	background-size: cover;

	transform: translate(-20px, 50%);

	transition: all 0.4s ease-in-out;

}



.btn-default:hover::before{

	transform: translate(-20px, 50%) rotate(45deg);

}

.tiltle-main{

	font-size:38px;

	margin-bottom: 20px;

}

.navbar{
    padding: 0px;
    padding-bottom: 10px;
}

/* Hamburger Icon Styling */

.navbar-toggler {

    border: none;

}



.navbar-toggler-icon {

    background-image: none; 

    position: relative;

    width: 24px;

    height: 2px;

    background-color: #c43f56; 

    transition: all 0.3s ease-in-out;

}



.navbar-toggler-icon::before,

.navbar-toggler-icon::after {

    content: '';

    position: absolute;

    width: 24px;

    height: 2px;

    background-color: #fff;

    transition: all 0.3s ease-in-out;

}



.navbar-toggler-icon::before {

    top: -8px;

}



.navbar-toggler-icon::after {

    top: 8px;

}



/* Active (Close) State */

.navbar-toggler.collapsed .navbar-toggler-icon {

    background-color: transparent;

}



.navbar-toggler.collapsed .navbar-toggler-icon::before {

    transform: rotate(45deg);

    top: 0;

}



.navbar-toggler.collapsed .navbar-toggler-icon::after {

    transform: rotate(-45deg);

    top: 0;

}

        .navbar ul .nav-item{

        margin-left: 40px;
      font-weight: 500;
           

        }

        .navbar-brand {

            font-size: 1.5rem;

            font-weight: bold;

            color: white;
			width: 40%;
        }



        .nav-link {



            color: #632020 !important;

            transition: color 0.3s ease;

        }

        .nav-link:hover, .dropdown-item:hover {

            /*color: var(--bs-primary) !important;*/
			color: #c64d58 !important;

        }

        .dropdown-menu {

            background-color: #fff;

            padding: 10px 20px;

            min-width: 200px;

        }

        .dropdown-menu li{

        	padding-bottom: 10px;

        	border-bottom: 1px solid #eee;color: #131157;

        }

        .dropdown-menu li a{

            color: #333;

        }

        .dropdown-item a{

            color: white !important;

        }

        .navbar-toggler {

            border-color: white;

        }

        .navbar-toggler-icon {

            background-image: url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' fill='%23FFFFFF' viewBox='0 0 30 30'%3E%3Cpath stroke='rgba%28255, 255, 255, 0.7%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3E%3C/svg%3E");

        }

/* Make dropdown menus appear on hover */

.navbar-nav .dropdown:hover .dropdown-menu {

    display: block;

    margin-top: 0; /* Adjust this value if necessary to position the menu correctly */
color:#632020 !important;
}



/* Add a smooth transition for better visuals */

.navbar-nav .dropdown .dropdown-menu {

    transition: all 0.3s ease;

}



 .nav-link.active {

    /*color: var(--bs-primary) !important;*/
	 color: #381d60 !important;
  

}



    .banner-section {

  position: relative;

  width: 100%;

  color: #fff;

}



.banner-section .swiper-slide {

  position: relative;

  height:60vh;

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat;

  display: flex;

  align-items: center;

  justify-content: flex-start;

}



.banner-section .overlay {

  position: absolute;

  top: 0;

  left: 0;

  width: 100%;

  height: 100%;

  background: linear-gradient(60deg, black, transparent); 

  z-index: 1;

}



.banner-section .content-wrapper {

  position: relative;

  z-index: 2;

  width: 50%; 

  padding-top: 100px;

  padding-left: 10%;

}



.banner-section .content-wrapper {

  color: #fff;

  text-align: left;

}



.banner-section .content-wrapper h2 {

  font-size: 45px !important;

  margin-bottom: 20px;



  opacity: 0;

  transform: translateY(30px);

  transition: all 0.8s ease;

}



.banner-section .content-wrapper p {

  font-size: 20px;

  opacity: 0;

  transform: translateY(30px);

  transition: all 0.8s ease;



}



/* Animate active slide content */

.banner-section .swiper-slide-active .content-box h2,

.banner-section .swiper-slide-active .content-box p {

  opacity: 1;

  transform: translateY(0);

}





.banner-section .swiper-button-next,

.banner-section .swiper-button-prev {

  color: #fff;

}





.banner-section .content-wrapper h2,

.banner-section .content-wrapper p {

  opacity: 0;

  transform: translateY(30px);

  transition: all 0.8s ease;

}





.banner-section .swiper-slide-active .content-wrapper h2,

.banner-section .swiper-slide-active .content-wrapper p {

  opacity: 1;

  transform: translateY(0);

}

.banner-section .swiper-button-next, .banner-section .swiper-button-prev{

display: none;





}

.banner-section:hover .swiper-button-next, .banner-section:hover .swiper-button-prev{

display:flex;

width: 50px;  

  height: 50px; 

  background: rgba(0, 0, 0, .4);

  border-radius: 50%;

  align-items: center;





}

.banner-section .swiper-button-next:hover, .banner-section .swiper-button-prev:hover {

  background-size: cover;

  background-image: inherit;

  background-repeat: no-repeat;

  background-position: center;

  width: 50px;  

  height: 50px; 

  transition: background-image 0.3s ease;

  border-radius: 50%;

  

}



/* Optional hover effect */

.banner-section .swiper-button-next:hover, .banner-section .swiper-button-prev:hover {

  transform: scale(1.1);

}

.banner-section .swiper-button-next:hover:after, .banner-section .swiper-button-prev:hover:after{

	display: none;



	transition: background-image 0.3s ease;



}

.banner-section .swiper-button-next:after, .banner-section .swiper-button-prev:after{

	font-size:20px;

}

    .top-header{

    	background: rgba(0, 173, 239, 0);

    	padding: 0px;

    	text-align: right;

    	 display: flex;

    	 justify-content: end;

    	 color: #fff;

    }

    .top-header  a{

    	position: relative;

    	color: var(--bs-white);

    	font-size: 18px;

    	line-height: 0;

    	/*background: rgba(0, 173, 239, .5);

    	padding: 3px 10px;

    	

    	border-radius: 20px;*/

    	padding:0px 18px;

    	

    	

    }

    .top-header-content{

      background: rgba(0, 173, 239, .3);

      width: fit-content;

      padding: 5px 25px 5px 25px;

      clip-path: polygon(0 0, 100% 0%, 95% 100%, 5% 100%);

      backdrop-filter: blur(10px);



    }

    

    

    .feature-col {

    position: relative;

    padding: 20px 20px 40px 20px;

    border-radius: 10px;

    overflow: hidden;

    

     

    transition: transform 0.3s ease; 

}







.feature-col:hover {

    transform: translateY(-20px); 

    z-index: 2; 

    

}



.feature-col-content {

	

    position: relative;

    z-index: 2; 

}



    .feature-col-color-1{

    	background: #eee;

    	

    	



    }



    .feature-col-color-2{

    	background: #f8f9fa;

    	



    }

    .feature-col .img-col{

    	width: 100%;

    	display: flex;

    	justify-content: space-between;

    	position: relative;

    	align-items: center;

    	margin-bottom: 20px;



    }

    .feature-col .icon{

       width: 60px;

       height: auto;

       display: inline-block;

       

    }

    .feature-col .icon-img{

       width: 140px;

       height: auto;

       float: right;

       border-radius: 80px 0px 0px 80px;



      

    }



    .feature-col .description{

    	width: 100%;

    	display: inline-block;

    }

    .feature-col p{

    	margin-bottom: 35px;

    	font-size: 16px;

    }

  .feature-col h4{

    

    	font-weight: 600;

    	font-size: 22px;

    }

    .feature-col hr{

    	width: 40%;

    	background: linear-gradient(90deg, rgba(0, 0, 0, 1) 0%, rgba(0, 0, 0, 1) 28%, rgba(0, 173, 239, 1) 100%);

    	border: 0px;

    	height: 1px;

    }

  

    .products-section {

  background: rgb(0, 173, 239);

   background: linear-gradient(90deg, rgba(0, 0, 0, .9) 0%, rgba(0, 0, 0, .8) 28%, rgba(0, 173, 239, .99) 100%),

   url('../images/slider/slider-5.jpg');

  position: relative;

  background-size: cover;

  display: flex;

  color: #fff;

  height: auto; 

}



.products-section .swiper {

   height: 400px; 

}



.products-section .swiper-slide {

  display:inline-grid;

  

  align-items: center;

 





  

}

.products-section .swiper-slide:last-child{

	border: 0px;

}

.products-section .image-box, .products-section .content-box {



  display: flex;

 

}



.products-section .image-box img {

  width: 100%;

  background: rgba(255, 255, 255, .2);

  backdrop-filter: blur(10px);

  border-radius: 10px;

}



.products-section .content-box {

  display: flex;

  flex-direction: column;

  justify-content: center;

  padding: 0 20px;

}



.products-section h2 {

  margin-bottom: 10px;

  font-size: 20px;

}



.products-section p {

  

  font-size: 14px;

}





.products-section .swiper-button-next, .products-section .swiper-button-prev {

  z-index: 10; 

}



/* Vertical Progress Bar Styling */

.products-section .swiper-pagination-progress {

  position: absolute;

  top: 0;

  right: 10px;

  width: 2px; 

  height: 100%; 

  background: rgba(255, 255, 255, .8); 

}



.products-section .swiper-pagination-bar {

  width: 100%; 

  height: 0%; 

  background: #00adef; 

  transition: height 0.1s ease-in-out; 

}

.ab-1, .ab-2 {

    position: relative;

    border-radius: 10px;

    float: left;

    transition: transform 0.1s ease-out, opacity 0.3s ease-out; 

    opacity: 0; /* Initially hidden */

    transform: scale(1) rotate(0deg); 

}



.ab-1 {

    width: 50%;

    margin-right: 10px;

}



.ab-2 {

    width: 40%;

    margin-top: 20%;

}





footer{

	background: #091721;

	padding: 100px 0px 0px 0px;

	color: #fff;

	font-size: 15px;

	font-weight: 200;

}

footer ul{

	list-style: none;

}

footer ul li{

	margin-bottom: 10px;

}

footer a{

	font-size: 15px;

	font-weight: 200;

	color: #fff;

	text-decoration: none;



}

.copy-right{

	background: rgba(0, 173, 239, .1);

	

	padding:10px 20px;

	clip-path: polygon(4% 0, 96% 0, 100% 100%, 0% 100%);



}

.client-sec{

	padding: 50px 0px;

}



.client-sec img{

	padding: 10px;



}

.footer-widget-address p{

	display: flex;

}

.footer-widget-address p span{

	margin-right: 10px;

}

.social-footer a{

	padding: 8px;

	font-size: 20px;



}

.social-footer a:hover i{

	color: var(--bs-primary);

	transform: rotateY(360deg);

	transition: transform 1s ease, color 0.3s ease;

}

@media (max-width:991px){

	.navbar-collapse{

	/*background: var(--bs-primary) !important;*/
		background: #f3f3f3 !important;

}

.navbar-toggler.collapsed .navbar-toggler-icon{

	background-image: none !important;

}

.nav-link:hover, .dropdown-item:hover{

	color: #fff !important;



}

.dropdown-menu{

	background: transparent;

	border: 0px;

}

.dropdown-menu li a{

	color: #fff;

}

.dropdown-menu li{

	border: 0px;

}

.top-header-content {

    text-align: center;

    width: 100%;

  }

.products-section .swiper{

	height: 450px;

	margin-top: 30px;

}

.products-section .image-box img{

	width: 90%;

	margin-bottom: 20px;



}



.about-sec{

	padding-bottom: 0px;

}

.ab-content{

	padding-bottom: 50px;

	padding-left: 50px;

}

.banner-section .content-wrapper{

	width: 100%;

}

}



.bread-crumbs{background-size: cover !important;
padding: 180px 0px 80px 0px;
 color: #fff;
 /*   padding: 160px 0px 120px;

   
background-color: #c0bcbc;
background-color: #555252;*/

   background: linear-gradient(to right, #c0bcbc, #ccc, #fff);

    position: relative;

}
.bread-crumbs:before{
    content: '';
    position: absolute;
    width: 100%;
    height: 100%;
    left: 0;
    top: 0;
    /*background: rgba(0, 0, 0, .6);*/
	background: linear-gradient(to right, #c0bcbc, #ccc, #fff, .6);
}
.bread-crumbs a{
    color: #fff;
}
.bread-crumbs a.active{
    color: rgba(200, 80, 10, 1);
}
.bread-content{
    position: relative;
    z-index: 1;
}



.inner-products img{

    width: 100%;



}



.inner-product-sec ul li{

    

    margin-bottom: 10px;

}

.inner-product-sec ul li::marker {

  color: var(--bs-primary);



}

.contact-address p{

    display: flex;

}

.contact-address p span{

    margin-right: 10px;

    /*color: var(--bs-primary);*/
	color: #3f2475 !important;

}



.inner-client  img{

width: 100%;

padding: 10px 0px;

border: 1px solid #eee;

}

.inner-principal  img{

width: 100%;

padding: 10px 0px;

border: 1px solid #eee;

}

.career-form label{

    font-size: 15px;

   padding-bottom: 10px;





}

.group-company{



}

.group-company img{

    width: 100%;

    padding: 20px;







}

.col-grp{

    position: relative;

     border: 1px solid #eee;



    

}

.group-location{

    padding:40px 20px 20px 20px;

    background: #eee;



   text-align: center;

 position: relative;

 overflow:visible;

 margin-top: 30px;



}



.group-location  span{

    position: absolute;

    top: -30px;

    left: 50%;

    transform: translateX(-50%);

    color: var(--bs-primary);

    font-size: 40px;

    z-index: 88;

}
.single-about {
    position: relative;
    z-index: 1;
}