* { 
    /* font-family: "Poppins", sans-serif;  */
    font-family: 'Outfit', sans-serif;
    /* font-family: 'Manrope', sans-serif; */
    /* font-family: 'Inter', sans-serif; */
    /* font-family: "Urbanist", sans-serif; */
    /* font-family: "Bricolage Grotesque", sans-serif;  */
    list-style: none;}
    h1, h2, h3 {
/* font-family: 'Syne', sans-serif; */
/* font-family: 'Space Grotesk', sans-serif; */
/* font-family: "Jost", sans-serif; */
 font-family: "Mozilla Headline", sans-serif;
  font-weight: 700;
  letter-spacing: -0.5px;
}
p{font-family: 'Outfit', sans-serif;}
/* .btns{overflow: hidden;} */
a.showbtn{text-decoration: none; color: #fff; background-color: #052944; padding: .5rem 1.5rem;  position:relative;border:none; overflow: hidden !important; display: inline-block; transition: 1s ease-in-out;}
a.showbtn:hover{background-color: #fff; color: #052944; transition: 1s ease-in-out;}
a.showbtn:before{
  content:'';
  position:absolute;
  top:0;
  left:-100%;
  width:100%;
  height:4px;
  background-color:#052944;
  transition:all 1s;
}
a.showbtn:after{
  content:'';
  position:absolute;
  bottom:0;
  right:-100%;
  width:100%;
  height:4px;
  background-color:#052944;
  transition:all 1s;
}
a.showbtn:hover:before {
  left:0;
}
a.showbtn:hover:after{
  right:0;
}
a.showbtn span:before{
  content:'';
  position:absolute;
  top:-100%;
  right:0%;
  width:4px;
  height:100%;
  background-color:#052944;
  transition:all 1s;
}
a.showbtn:hover span:before{
  top:0;
}
a.showbtn span:after{
  content:'';
  position:absolute;
  bottom:-100%;
  left:0%;
  width:4px;
  height:100%;
  background-color:#052944;
  transition:all 1s;
}
a.showbtn:hover span:after{ bottom:0;}
a.showbtn, a.showbtn span { box-sizing: border-box;}





/* a.showbtn:hover span{display: block;} */
/* a.showbtn span{padding-left: .4rem; } */
a.showbtn span{font-size: 18px; letter-spacing: 1px;}
a.showbtn span i{rotate: 50deg; padding-left: .4rem;}
.top-header{background-color: #39bef4; padding: .5rem 0;position: fixed; top: 0; z-index: 3;}
.top-header .container{display: flex; justify-content: flex-end; align-items: center;}
.details{display: flex;}
.details a{text-decoration: none; color: #fff; font-weight: 600; padding: 0 1rem; border-right:  2px solid #85d5f5; font-size: .9rem;}
.details ul{padding-left: 0 !important; margin-bottom: 0 !important; display: flex;}


#particles-js { position: absolute; width: 100%; height: 500px; top: 0rem; left: 0; background-color: #040d19; z-index: 1;}
.particles canvas { position: absolute; top: 0; left: 0;}
canvas { display: inline-block; vertical-align: baseline;}

.Homebanner{background-color: #040d19;}
.Homebanner .container{display: flex; justify-content: space-between; align-items: center;}
.Homebanner .container .bannercontent{width: 50%;}
.Homebanner .bannercontent a{text-decoration: none; color: #fff;}
.Homebanner .bannercontent h1{
    /* -webkit-text-stroke: 1px #fff;  */
    color: #fff;font-size: 50px; font-weight: 600; margin: 0 0 10px;}
#wave{margin-top: -3rem;}
.it-banner-image { position: relative; z-index: 2;}
.newfeaturex .scroll-container { height: 500px; overflow: hidden; position: relative;}
.newfeaturex .scroll-up { animation: scroll-up 10s linear infinite;}
.newfeaturex .scroll-content { display: flex; flex-direction: column;}
@keyframes scroll-up{
    0% {transform: translateY(0%);}
    100% {transform: translateY(-50%);}
}
.newfeaturex .company-features { padding: 10px; border: 1px solid #ddd; margin: 5px 10px; background-color: transparent !important;}
.company-features .icon { width: 100%;}
.newfeaturex .icon img { width: 100%; height: 180px; margin-bottom: 10px;}
.company-features p { font-size: 1em !important; color: #fff !important; margin-bottom: 0 !important; width: 100%;}
.newfeaturex .scroll-down { animation: scroll-down 10s linear infinite;}
@keyframes scroll-down{
    0% {transform: translateY(-50%);}
    100% {transform: translateY(0%);}
}



.banner{padding: 10rem 0 0;}
.banner #particles-js{background-color: #052944; height: 335px;}
#waves{margin-top: 0.6rem;}
.banner .bannercontent a{text-decoration: none; color: #fff;}
.banner .bannercontent h1{font-size: 50px;margin: 0 0 10px; color: #fff;}


/* .bannersec{position: relative; margin: 3rem 0;
    padding: 150px 0 60px; z-index: 1;
    overflow: hidden; } */
/* .bannersec::before{position: absolute; content: ""; clip-path: polygon(0 0, 0 0,100% 0%, 100% 60%, 50% 100%, 20% 93%, 0% 60%, 0 0%);  background-image: linear-gradient(120deg, #89f7fe 0%, #66a6ff 100%); width: 100%; height: 100%; top: 0; left: 0; } */

/* .bannersec .container{display: flex; justify-content: space-between; align-items: center; position: relative;} */
/* .bannercontent{width: 100%; margin: 0 auto;} */
/* .bannersec .bannerimg{width: 50%; z-index: 3;} */




/* .boxes{margin: 3rem auto; width: 80%; height: 450px; background-color: #1d4076;    */
    /* clip-path: path("M0,0 H100% V60% C100% 60%, 40% 100%, 20% 100% C0% 100%, 0% 60%, 0 0 Z"); */
    /* clip-path: path(0 0, 0 0,100% 0%, 100% 60%, 40% 100%, 20% 100%, 0% 40%, 0 0%); */
    /* clip-path: polygon(0 0, 0 0,100% 0%, 100% 60%, 40% 100%, 20% 100%, 0% 40%, 0 0%); */
/* } */


/* header */



.header { position: fixed; top: 0rem; width: 100% !important; z-index: 10; padding: 0 !important; background-color: #fff !important; box-shadow: 0px 5px 5px 0px rgba(0, 0, 0, 0.15);}

/* navigation  */
.navigation{ padding: 1rem 2rem; background: #fff; }
.navigation .nav { display: flex; justify-content: space-between; align-items: center;}
.navigation .nav .logo{width: 16%;}
.navigation .nav .menu { display: flex; align-items: center;}
.navigation .nav .menu ul { display: flex; align-items: center; justify-content: start; flex-wrap: nowrap; list-style: none; margin-bottom: 0px !important; padding-left: 0px !important;}

.navigation .nav .menu ul li a {
    text-decoration: none;
    color: #052944;
   font-size: .96rem;
    font-weight: 700;
    margin-right: 1.5rem;
    font-family: "Urbanist", sans-serif;
    position: relative;
    display: block;
    transition: all 0.3s ease-in-out;
}
.navigation .nav .menu ul li a:hover{color: green; font-weight: 700;}
/* a.active{color: green; font-weight: 700; transition: all 0.3s ease;} */

.navigation .nav .menu ul li a::before {
    content: "";
    width: 0px;
    height: 2px;
    background: #1d4076;
    position: absolute;
    bottom: 0;
    left: 50%;
    transition: all 0.3s ease 0s;
}

.navigation .nav .menu ul li a:hover::before {
    width: 100%;
    left: 0;
}
.navigation .nav .menu ul li a i#arrow{transition: all .3s ease-in-out;}
.navigation .nav .menu ul li:hover a i#arrow{rotate: 180deg; transition: all .3s ease-in-out;}

/* .menu li.mobile-btn {
    display: none;
}

.menubtn li.mobile-btn {
    display: block;
    margin-right: 1rem;
} */

.navigation .nav .menu ul li.dropdown ul {
    display: block;
}
.menubtn{display: flex; align-items: center;}
.menubar {
    width: 2.5rem;
    padding: .5rem;
    display: none;
}

.menubar .bar {
    width: 1.5rem;
    height: 3px;
    background-color: #000;
    margin-bottom: .3rem;
    transition: all .3s ease-in-out;
}

.menubar .bar2 {
    width: 1rem;
    height: 3px;
    background-color: #000;
    margin-bottom: .3rem;
    transition: all .3s ease-in-out;
}

.menubar:hover .bar {
    width: 1rem;
    transition: all .3s ease-in-out;
}

.menubar:hover .bar2 {
    width: 1.5rem;
    transition: all .3s ease-in-out;
}



.menu li.dropdowns {
    position: relative;
}

.menu li.dropdowns .dropdowns-menu .list {
    display: flex;
    justify-content: space-between;
    align-items: start;
}

.menu li.dropdowns .dropdowns-menu .list .list1 ul,
.menu li.dropdowns .dropdowns-menu .list .list2 ul {
    display: block;
}

.menu li.dropdowns .dropdowns-menu li {
    white-space: nowrap;
} 


/* .dropdowns-menu {
    display: none;
    position: absolute;
    background-color: #fff;
    padding: 1rem;
    box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
    z-index: 1000;
    border-radius: 1rem;
}

.menu li.dropdowns .dropdowns-menu .list li {
    padding: .5rem 0;

} */




/* Core dropdown styles */
.dropdowns-menu {
  position: absolute;
  top: 100%;
  left: 0;
  background: #fff;
  min-width: 260px;
  z-index: 99;
  opacity: 0;
  visibility: hidden;
  transform: translateY(10px);
  transition: all 0.3s ease;
  border-radius: 6px;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);
}

/* Hover on parent shows dropdown */
.dropdowns:hover > .dropdowns-menu {
  opacity: 1;
  visibility: visible;
  transform: translateY(0);
}

/* Style the submenu links */
.dropdowns-menu ul li a {
  display: block;
  padding: 10px 15px 15px;
  color: #333;
  text-decoration: none;
  /* transition: background 0.3s ease; */
}

.dropdowns-menu ul li a:hover {
  /* background-color: #f5f5f5; */
  color: #000;
}

/* Ensure the dropdowns are positioned relative */
.dropdowns {
  position: relative;
}

/* Nested dropdown menu (3rd level) positioning */
.dropdowns-menu .dropdowns {
  position: relative;
}

.dropdowns-menu .dropdowns .dropdowns-menu {
  top: 0;
  left: 100%;
  margin-left: 1px;
}

.navigation .nav .menu ul li.dropdowns .list1 a::before {
    content: "";
    width: 0px;
    height: 2px;
    background: #fff !important;
    position: absolute;
    bottom: 0;
    left: 50%;
    transition: all 0.3s ease 0s;
}

.navigation .nav .menu ul li.dropdowns .list1 a:hover::before {
    width: 100%;
    left: 0;
}



.mobile-btn a.btnss{text-decoration: none; color: #fff; background-color: #052944; padding: .8rem 1.5rem;  position:relative;border:none; overflow: hidden !important; display: inline-block; transition: 1s ease-in-out; font-size: 18px; letter-spacing: 1px;}

.mobile-btn a.btnss:hover{background-color: #fff; color: #052944; transition: 1s ease-in-out;}
.mobile-btn a.btnss:before{ content:''; position:absolute; top:0; left:-100%; width:100%; height:4px; background-color:#052944; transition:all 1s;}
.mobile-btn a.btnss:after{ content:''; position:absolute; bottom:0; right:-100%; width:100%; height:4px; background-color:#052944; transition:all 1s;}
.mobile-btn a.btnss:hover:before { left:0;}
.mobile-btn a.btnss:hover:after{ right:0;}
.mobile-btn a.btnss span:before{ content:''; position:absolute; top:-100%; right:0%; width:4px; height:100%; background-color:#052944; transition:all 1s;}
.mobile-btn a.btnss:hover span:before{ top:0;}
.mobile-btn a.btnss span:after{ content:''; position:absolute; bottom:-100%; left:0%; width:4px; height:100%; background-color:#052944; transition:all 1s;}
.mobile-btn a.btnss:hover span:after{ bottom:0;}
.mobile-btn a.btnss, a.btnss span { box-sizing: border-box;}




.mobilenavigation{width: 40%; height: 30rem; background-color: #000; position: absolute; top: 0; left: 0; display: none;}  




/* 
.menu li.dropdowns .dropdowns-menu .list .list1,
.menu li.dropdowns .dropdowns-menu .list .list2 {
    margin-right: 1rem;
}

.menu li.dropdowns .dropdowns-menu .list li a {
    text-transform: capitalize;
    font-size: .9rem;
}

.menu li.dropdowns .dropdowns-menu .list li a i {
    margin-right: 1rem;
    background-color: #1d40762e;
    padding: .6rem;
    color: #1d4076;
    font-size: .8rem;
    border-radius: 50px;
}

.navigation .nav .menu ul li.dropdowns .dropdowns-menu .list li a::before {
    background-color: #fff;
}

.navigation .nav .menu ul li.dropdowns .dropdowns-menu .list .list3 {
    text-align: center;
}

.navigation .nav .menu ul li.dropdowns .dropdowns-menu .list .list3 p {
    font-weight: 700;
    margin-bottom: 0 !important;
}

.navigation .nav .menu ul li.dropdowns .dropdowns-menu .list .list3 span {
    font-size: .8rem;
} */
/* 
.navigation .nav .menu ul li.dropdowns .dropdowns-menu .list .list3 a.demobtn {
    background-color: #193f77;
    padding: .5rem;
    border-radius: 10px;
    color: #fff;
    text-decoration: none;
}

.navigation .nav .menu ul li.dropdowns .dropdowns-menu .list .list3 a.demobtn:hover {
    background-color: #fff;
    padding: .5rem;
    border-radius: 10px;
    color: #193f77;
    border: 1px solid #193f77;
}


.navigation .nav .menu ul li.dropdowns .dropdowns-menu .list .list3 a::before {
    background-color: #fff;
}

.dropdowns {
    position: relative;
}


.menubtn ul {
    list-style: none;
    padding-left: 0 !important;
    display: flex;
    justify-content: start;
    align-items: center;
    margin-bottom: 0 !important;
}

.menubtn a.demobtn {
    position: relative;
    display: inline-block;
    overflow: hidden;
    background-color: #193f77;
    padding: 0.5rem 1rem;
    border-radius: 10px !important;
    color: #fff;
    text-decoration: none;
    z-index: 1;
    transition: color 0.3s ease-in-out;
}

.menubtn a.demobtn::before {
    content: "";
    position: absolute;
    left: 0;
    top: 0;
    width: 0%;
    height: 100%;
    background-color: #39bef4;
    transition: width 0.4s ease-in-out;
    z-index: -1;
}

.menubtn a.demobtn:hover::before {
    width: 100%;
}

.menubtn a.demobtn:hover {
    color: #fff;
} */




/* about section */
.aboutsec{padding: 3rem 0; margin-bottom: 5rem;}
.aboutsec .container{display: flex; justify-content: space-between; align-items: start;}
/* .aboutimg{display: flex; justify-content: space-between; align-items: start; width: 30%; border-left: 5px solid #052944; padding-left: .5rem; position: relative; height: auto;} */
/* .aboutimg img.secimg{position: absolute; width: 80%; height: auto; right: -6rem; bottom: 1rem;} */
/* .aboutimg .firstimgsec{width: 50%;} */
/* .aboutimg .secondimgsec{width: 48%; padding: .5rem 0; border-top: 5px solid #052944;} */
/* .aboutimg .firstimgsec img{margin: .5rem 0;} */

.about-four__left { position: relative; display: block; margin-right: 145px; margin-top: 40px;}
.slideInLeft { animation-name: slideInLeft;}
.animated { animation-duration: 1s; animation-fill-mode: both;}
@keyframes slideInLeft{
    0% { transform: translate3d(-100%, 0, 0); visibility: visible;}
    100% { transform: translate3d(0, 0, 0);}
}
.about-four__img-box { position: relative; display: block;}
.about-four__img { position: relative; display:block; width: 85%;}
.about-four__img img { width: 100%; border-radius: 40px;}
.about-four__img-2 { position: absolute; right: -100px; bottom: -65px; max-width: 308px; width: 100%;}
.about-four__img-2 img { width: auto; border: 2px solid #B5B7BB; border-radius: 40px;}
.about-four__experience { position: absolute; display: flex; align-items: center; justify-content: center; top: 90px; right: -15px; width: 140px; height: 140px; background: linear-gradient(270deg, rgba(5, 41, 68, 0.23) 0%, rgba(96, 101, 213, 0.4) 100%); border-radius: 100px;}
.about-four__experience-inner { position: absolute; display: flex; align-items: center; justify-content: center; width: 120px; height: 120px; background: linear-gradient(270deg, #052944 0%, #6065D4 100%); border-radius: 100px; flex-direction: column; text-align: center;}
.about-four__experience-count-box,.about-four_survey-count-box  { position: relative; display: block;}
.about-four__experience-count-box h3, .about-four_survey-count-box h3 { font-size: 40px; font-weight: 700; line-height: 48px !important; color: #ffffff;}
.about-four__experience-count-text, .about-four_survey-count-text  { font-size: 13px; font-weight: 500; line-height: 17px; color: #ffffff; top: -3px; position: relative;}
.about-four_survey { position: absolute; display: flex; align-items: center; justify-content: center; bottom: -60px; left: -85px; width: 180px; height: 180px; background: linear-gradient(270deg, rgba(5, 41, 68, 0.23) 0%, rgba(96, 101, 213, 0.4) 100%); border-radius: 100px;}
.about-four_survey-inner { position: absolute; display: flex; align-items: center; justify-content: center; width: 155px; height: 155px; background: linear-gradient(270deg, #052944 0%, #6065D4 100%); border-radius: 100px; flex-direction: column; text-align: center;}


.about-content{width: 50%;}
span.heading{color: #041d31; text-transform: uppercase; position: relative; padding-left: 7rem;}
span.heading::before{content: ""; position: absolute; width: 5rem; height: 2px; background-color: #1380ab; top: 8px; left: 0; animation: 2.5s linear infinite spinleft; transition: .3s ease-in-out;}
span.heading::after{content: ""; position: absolute; width: 5rem; height: 2px; background-color: #1380ab; top: 12px; left: 12px;  transition: .3s ease-in-out; animation: 2.5s linear infinite spinright;}

@keyframes spinleft{
    0%, 100% {left: 0;}
    50% {left: 10px;}
}

@keyframes spinright{
    0%, 100% { left: 12px;}
    50% { left: -10px;}
}

.about-content h2{color: #052944; font-weight: 700; margin: .8rem 0;}
.about-content p{margin-bottom: 1rem;}
.about-content ul{padding-left: 0 !important;}
.about-content ul li{padding: .5rem; display: flex; align-items: center;}
.about-content ul li i{color: #1380ab; font-size: 1.2rem; margin-right: 1rem;}
.aboutsec .container .experience{display: flex; justify-content: space-around; align-items: start; padding: 3rem 0; text-align: center; width: 100%;}

.about-content.servicespage{width: 50%;}
.about-content.servicespage ul li{display: flex; align-items: start;}
.about-content.servicespage ul li i{margin-top: .5rem;}

/* .experiencesec{background-color: #0529440d; padding: 1rem 4rem; text-align: center; margin-bottom: 1rem; border-radius: 1rem; box-shadow: 0px 0px 12px 0px rgba(0,0,0,.13); transition: all .3s ease-in-out;}
.experiencesec:hover{box-shadow: inset 0px 0px 12px 0px rgba(0,0,0,.13); transition: all .3s ease-in-out;}
.experiencesec span{font-size: 3.5rem; font-weight: 600; color: #052499;}
.experiencesec p{margin-bottom: 0 !important;} */





/* work process section */

.working-process-one {
    position: relative;
    display: block;
    background: #f1f5f9;
    padding: 120px 0px 90px;
    z-index: 1;
    overflow: hidden;
}
.working-process-one .shape2 {
    position: absolute;
    top: 0;
    left: 0;
    opacity: 0.05;
    z-index: -1;
}
.float-bob-y {
    /* -webkit-animation-name: float-bob-y; */
    animation-name: float-bob-y;
    /* -webkit-animation-duration: 2s; */
    animation-duration: 2s;
    /* -webkit-animation-iteration-count: infinite; */
    animation-iteration-count: infinite;
    /* -webkit-animation-timing-function: linear; */
    animation-timing-function: linear;
}

@keyframes float-bob-y{
    0% {
    transform: translateY(-20px);
}
50% {
    transform: translateY(-10px);
}
100% {
    transform: translateY(-20px);
}
}
.working-process-one .shape3 {
    position: absolute;
    bottom: 0px;
    right: -70px;
    opacity: 0.15;
    z-index: -1;
}
.float-bob-x {
    -webkit-animation-name: float-bob-x;
    animation-name: float-bob-x;
    -webkit-animation-duration: 2s;
    animation-duration: 2s;
    -webkit-animation-iteration-count: infinite;
    animation-iteration-count: infinite;
    -webkit-animation-timing-function: linear;
    animation-timing-function: linear;
}
@keyframes float-bob-x{
    0% {
    transform: translateX(-30px);
}

50% {
    transform: translateX(-10px);
}
100% {
    transform: translateX(-30px);
}
}

.sec-title {
    position: relative;
    display: block;
    margin-top: -5px;
    padding-bottom: 47px;
    z-index: 1;
}
.sec-title h3 {
    font-size: 48px;
    line-height: 58px;
    font-weight: 700;
    text-transform: none; margin-bottom: 3rem;
    /* font-family: var(--cleanin-font-two); */
}
.working-process-one .shape1 {
    position: absolute;
    top: 210px;
    left: 150px;
    right: 150px;
    border-top: 1px dashed #606060;
    z-index: -1;
}
.working-process-one .shape11 {
    position: absolute;
    bottom: 295px;
    left: 150px;
    right: 150px;
    border-top: 1px dashed #606060;
    z-index: -1;
}
.working-process-one__single {
    position: relative;
    display: block;
    padding: 0px 15px 0px;
    margin-bottom: 50px;
    z-index: 1;
}
.working-process-one__single .icon { position: relative; display: flex; align-items: center; justify-content: center; width: 150px; height: 150px; border-radius: 50%; background: #fff; -webkit-box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.06); box-shadow: 0px 0px 35px 0px rgba(0, 0, 0, 0.06); margin: 0 auto 24px;}
.working-process-one__single .icon::before { position: absolute; top: 20px; right: 20px; bottom: 20px; left: 20px; border: 1px dashed #606060; border-radius: 50%; content: "";}
.working-process-one__single .icon .count-box{ position: absolute; top: 0; right: 0; display: flex; align-items: center; justify-content: center; width: 35px; height: 35px; background: #004a94; color: #fff; font-size: 14px; line-height: 24px; font-weight: 700; border-radius: 50%;}
.working-process-one__single .icon span { position: relative; display: inline-block; color: #004a94; font-size: 40px; line-height: 50px;}
.working-process-one__single .content-box { position: relative; display: block;}
.working-process-one__single .content-box h4 { font-size: 22px; line-height: 27px; font-weight: 700; text-transform: capitalize; margin-bottom: 14px;}
.working-process-one__single .content-box p { margin: 0; font-size: .9rem;}





.servicespage{padding: 5rem 0; width: 80%; margin: 0 auto;}
.servicespage h2{font-size: 2.5rem; color: #052944; font-weight: 700;}

.tablesec{padding: 2rem 0;}
.tablesec h3{ font-weight: 600; color: #052944; margin-bottom: 2rem;}

.typeservices{padding: 3rem 0;}
.typeservices h3{font-weight: 600; color: #052944; margin-bottom: 2rem;}
.typeservices .container{display: flex; justify-content: space-evenly; flex-wrap: wrap; }
.typeservices .container .servicestype{display: flex; justify-content: start; border: 2px solid #1d407617; margin: 1rem;
    padding: 1rem; width: 30%; border-radius: 10px; transition: all .5s ease-in-out}
.typeservices .container .servicestype:hover{border: 2px solid #fff; box-shadow: 0px 0px 16px 0px rgba(0, 0, 0, 0.15); transition: all .5s ease-in-out}
.typeservices .container .servicestype i{margin-right: 1rem; font-size: 1.5rem; margin-top: .3rem;}
.typeservices .container .servicestype h5{color: #052944;}

.servicesdivs{padding: 3rem 0;}
.servicesdivs .bposervice{display: flex; justify-content: space-evenly; align-items: start; margin: 1rem 0 2rem;}
.servicesdivs h3{font-weight: 600; color: #052944; margin-bottom: 2rem;}
.servicesdivs .bposervice .service img{width: 25%;}
.servicesdivs .bposervice .service{padding: 1rem; box-shadow: 0px 0px 12px 0px rgba(0,0,0,.15); margin:1rem}
.servicesdivs .bposervice .service h4{font-size: 1rem; color: #052944;}

.whychoosebox{display: flex; justify-content: space-evenly; align-items: center; flex-wrap: wrap; }
.whychoosebox .whychoose{width: 40%; clip-path: polygon(0% 0%, 100% 10%, 100% 100%, 0% 90%); padding: 3rem; background-color: #1380ab2e;}
.whychoosebox .whychoose:hover{transform: scale(1.03);}
.whychoosebox .whychoose h4{color: #052944;}

.services-reasons{padding: 3rem 0;}
.services-reasons h3{font-weight: 600; color: #052944;}
.cardBranding { display: flex; flex-direction: column; align-items: center; text-align: center; padding: 15px; border-radius: 10px; margin-top: 20px; height: 350px; box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px; position: relative; background-color: #96b59a45;}
.cardBranding h5{color: #052944; font-weight: 600;}
#container {height: 70vh; width: 93vw; margin: 0; padding: 0; display: grid ; place-items: center; }
#slider-container { height: 550px; width: 90vw; max-width: 1400px; position: relative; overflow: hidden; padding: 20px 0px;}
#slider-container .btn11 { position: absolute; height: 30px; width: 30px; border-radius: 50%;  bottom: 4rem; padding: .2rem;}
#slider-container .btn11 i{ color: #052944;}
#slider-container .btn11:hover {transform: scale(1.2);}
#slider-container .btn11.inactive { border-color: rgb(153, 121, 126)} 
#slider-container .btn11:first-of-type { right: 5rem;}
#slider-container .btn11:last-of-type { right: 2rem;  }
#slider-container #sliders {display: flex; width: 995%; height: max-content;  transition: all .5s;}
#slider-container #sliders .slides { height: 100%; margin: auto 10px; transition: all .5s ease-in-out;}
#slider-container #sliders .slides:hover{ transform: scale(1.05); transition: all .5s ease-in-out;}

@media only screen and (min-width: 1100px) {
    #slider-container #sliders .slides { width: calc(2.5% - 20px); }
}
@media only screen and (max-width: 1100px) {
    #slider-container #sliders .slides { width: calc(4.5% - 20px); }
}
@media only screen and (max-width: 900px) {
    #slider-container #slider .slide { width: calc(5% - 20px); }
}
@media only screen and (max-width: 650px) {
    #slider-container #sliders .slides { width: calc(10% - 20px); }
}

/* footer */



 
.helpbtn {
    position: fixed;
    bottom: 15px;
    left: 20px;
    padding: 12px 15px 12px 12px;
    background: #193f77;
    color: #ffff;
    border-radius: 50px;
    z-index: 1111;
    display: flex;
    align-items: center;
}

.helpbtn a {
    color: #fff;
    text-decoration: none;
    font-weight: 700;
    margin-left: .5rem;
}

.helpbtn a i {
    font-size: 1.3rem;
    transition: all .3s;
    animation: jump 0.3s infinite;
}


.whatsapp-button {
    position: fixed;
    bottom: 15px;
    right: 20px;
    padding: 12px 12px 12px 50px;
    background: #5eb300;
    color: #ffff;
    border-radius: 50px;
    z-index: 1111;
}

.whatsapp-button a {
    color: #fff;
    text-decoration: none;
    font-weight: 700;
}

.wa-widget-send-button .wh-svg-icon {
    fill: #ffffff;
    width: 55px;
}

.whatsapp-button .wa-widget-send-button {
    position: fixed;
    z-index: 16000160;
    bottom: 19px;
    height: 40px;
    width: 40px;
    border-radius: 50%;
    background-color: #5eb300;
    right: 75px;
    cursor: pointer;
    display: flex;
    align-items: center;
    justify-content: center;
    transition: all .3s;
    animation: jump 0.3s infinite;
}

@keyframes jump {
    0% {
        transform: rotate(0deg);
    }

    25% {
        transform: rotate(7deg);
    }

    50% {
        transform: rotate(0deg);
    }

    75% {
        transform: rotate(-7deg);
    }

    100% {
        transform: rotate(0deg);
    }
}

.btn-box a.showbtn{text-decoration: none; color: #fff; background-color: #052944; padding: 1rem 2rem;  position:relative; font-weight: 600; border:2px solid #fff; overflow: hidden !important; display: inline-block; transition: 1s ease-in-out; text-transform: uppercase;}
.btn-box a.showbtn:hover{background-color: #fff; color: #052944; transition: 1s ease-in-out;}




.enquirysec {background: #11561a70; clip-path: polygon(1.5% 0, 70% 3%, 70% 13%, 97% 9%, 97.5% 89%, 40% 100%, 39.9% 90%, 1% 88%);}
.enquirysec .container{display: flex; justify-content: space-between;  padding: 7rem 0;}
.enquirysec .enquiryforms{width: 35%;}
.enquirysec .enquiryforms .careerForm {
    /* width: 60%; */
    /* margin: 0 auto; */
    padding: 50px 25px; 
    background: #f6f6f6;
    border-radius: 10px;
}
.enquirysec .enquiryforms .careerForm h3 {
    margin: 1rem 0;
}
.enquirysec .enquirycontent{width: 60%;}
.enquirysec .enquirycontent .detailsbox{display: flex; justify-content: space-between; align-items: start;}
.enquirysec .enquirycontent .detailsbox .boxsection{box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.15); width: 50%; margin: 0 1rem; padding: 1rem; height: 14rem; background-color: #ffffffc7; border-radius: .5rem;}
.enquirysec .enquirycontent .detailsbox .boxsection span i{font-size: 1.1rem;  color: #052944; padding: .8rem; border-radius: 50px;  box-shadow: 0px 0px 4px rgba(0, 0, 0, 0.14);}
.enquirysec .enquirycontent .detailsbox .boxsection h5{margin: .8rem 0;}
.enquirysec .enquirycontent h3{font-size: 2.6rem; font-weight: 600; color: #fff;}

.enquirysec .enquirycontent h3 span{color: #052944;}



/* testimonial section  */
.testimonial{padding: 4rem 0; }
.testimonial .container{display: flex; justify-content: center; align-items: center; }
.testimonial main { width: 800px; margin: 1rem 0;}
.testimonial .slide-row { display: flex; width: 3200px; transition: 0.5s;}
.testimonial .slide-col { position: relative; width: 800px; height: 400px;}
.testimonial .hero { position: absolute; top: 0; right: 0; height: 100%;}
.testimonial .hero img { height: 100%; border-radius: 10px; width: 320px; object-fit: cover; pointer-events: none; user-select: none;}
.testimonial .content { position: absolute; left: 0; top: 50%; transform: translateY(-50%); width: 520px; height: 270px; color: #4d4352; background: rgba(255, 255, 255, 0.7); box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); backdrop-filter: blur(4.5px); -webkit-backdrop-filter: blur(4.5px); border-radius: 10px; padding: 45px; z-index: 2; user-select: none;}
.testimonial .content p { font-size: 1.25rem; font-weight: 400; line-height: 1.3;}
.testimonial .content h4 { font-size: 1.5rem; font-weight: 600; margin-top: 35px; color: #4d4352;}
.testimonial .indicator { display: flex; justify-content: center; margin-top: 4rem;}
.testimonial .indicator .btn { display: inline-block; height: 15px; width: 15px; margin: 4px; border-radius: 15px; background: #0529444d; cursor: pointer; transition: all 0.5s ease-in-out;}
.testimonial .btn.active { width: 30px; background-color: #052944;}
.testimonial .slider { width: 100%; overflow: hidden;}
.testimonial .logo { position: fixed; right: -20px; bottom: -30px; z-index: 10;}
.testimonial .logo img { width: 120px;}

@media (max-width: 890px) {
    .testimonial .logo { right: -10px; bottom: -20px;}
    .testimonial .logo img { width: 80px;}
}

@media (max-width: 850px) {
    main { width: 500px;}
    .testimonial .slide-row { width: 2000px;}
    .testimonial .slide-col { width: 500px; height: 250px;}
    .testimonial .hero img { width: 200px;}
    .testimonial .content { width: 320px; height: 200px; padding: 20px;}
    .testimonial .content p { font-size: 0.9rem;}
    .content h2 { font-size: 1.2rem; margin-top: 20px;}
}

@media (max-width: 550px) {
    main { width: 300px;}
    .testimonial .slide-row { width: 1200px;}
    .testimonial .slide-col { width: 500px; height: 300px;}
    .testimonial .hero { top: 60%; height: 100px; z-index: 5;}
    .testimonial .hero img { width: 100px;}
    .testimonial .content { width: 300px;}
}





/* blog section */
/* .blog{padding: 4rem 0; position: relative;}
.blog a{text-decoration: none; color: #052944;}
.blog .heading{position: relative; width: 100%;}
.blog p{position: absolute; right: 2rem; bottom: 0;}
.blog .container{display: flex; justify-content: space-between; align-items: center; }
.blog h3{font-size: 40px; color: #052944; margin-bottom: 2rem;}
.blog .blogsec{margin: .5rem; padding: .8rem; background-color: #fff; box-shadow: 0px 0px 8px rgba(0,0,0,0.14); border-radius: 10px; text-align: center; width: 25%; height: 23rem; position: relative;}
.blog .blogsec .blogimg{margin-bottom: 1rem; overflow: hidden; transition: transform 0.3s;}
.blog .blogsec .blogimg img{  transition: transform 0.3s; }
.blog .blogsec .blogimg img:hover{  transform: scale(1.05);}
.blog .blogsec h4{font-size: 1.3rem;}
.readbtn{position: absolute; bottom: 1rem; left: 5.5rem;}
.blog .blogsec a.showbtn{padding: .5rem 1rem; font-size: .95rem; color: #fff;}
.blog .blogsec a.showbtn:hover{color: #052944;} */


    .blogsection{padding: 4rem 0;}
    .blogsection .headerside{display: flex; justify-content: space-between; align-items: center;}
    .blogsection .headerside .blogheading h3{margin: 1rem 0; font-size: 2rem;}
    .blogsection .latestblogs{display: flex; justify-content: space-between; align-items: start; margin: 3rem 0;}
    .blogsection .latestblogs .blogsdiv{width: 40%;}
    .blogsection .latestblogs .blogsdiv a{text-decoration: none;}
    .sideblog{display: flex; justify-content: space-between; align-items: center; border-bottom: 1px solid #05294436; padding: .8rem;}
    .blogsection .latestblogs .blogsdiv .blogcontent{width: 60%;}
    .blogsection .latestblogs .blogsdiv .blogcontent span{color: #1380ab; font-weight: 600;}
    .blogsection .latestblogs .blogsdiv .blogcontent span i{margin-right: .5rem;}
    .sideblog .img{width: 50%;padding: .2rem;box-shadow: 0px 0px 12px 0px rgb(0 0 0 / 31%); margin-right: 2rem;}
    .blogcontent h5{margin: .5rem 0; font-size: 1rem; color: #052944; font-weight: 600;}
    .blogsection .latestblogs .blogsdivs{width: 55%;}
    .blogsection .latestblogs .blogsdivs .firstblog{display: flex; justify-content: space-between; margin-bottom: 5rem; }
    .blogsection .latestblogs .blogsdivs .firstblog a{text-decoration: none;}
    .blogsection .latestblogs .blogsdivs .bigimg{padding: .5rem;box-shadow: 0px 0px 12px 0px rgb(0 0 0 / 31%); margin-right: 2rem;}
    .blogsection .latestblogs .blogsdivs .content h5{ color: #052944; font-weight: 600; margin: .5rem 0;}
    .blogsection .latestblogs .blogsdivs .content span.date{color: #1380ab; font-weight: 600;}
    .blogsection .latestblogs .blogsdivs .content span.date i{margin-right: .5rem;}
    .blogsection .latestblogs .blogsdivs .content p{color: #000;}




/* blog page section */

.allblogs{padding: 4rem 0;}
.allblogs .list{margin: 2rem auto; width: 80%;}
.allblogs .list ul{padding-left: 0 !important; display: flex; justify-content: space-between; align-items: center;}
.allblogs .list ul li{background-color: #05294433;  border-radius: 50px; padding: .5rem .8rem; transition: all .4s ease-in-out; }
.allblogs .list ul li a{text-decoration: none;color: #052944;}
/* .allblogs .list ul li a{text-decoration: none; } */
.allblogs .list ul li:hover{background-color: #052944; transition: all .4s ease-in-out;}
.allblogs .list ul li:hover a{color: #fff;}
.allbloglist{display: flex; justify-content: space-evenly; align-items: center; flex-wrap: wrap;}
.allbloglist .blogsdiv{box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.14); padding: .8rem; margin: 1rem; border-radius: .8rem; height: 510px; width: 30%; position: relative;}
/* .blogsdiv.show{} */
.allbloglist .blogsdiv .blogimg{box-shadow: 0px 0px 12px 0px rgba(0, 0, 0, 0.14); border-radius: .8rem; margin-bottom: .8rem;}
.allbloglist .blogsdiv img{border-radius: .8rem; }
.allbloglist .blogsdiv span.date{color: #1380ab; font-weight: 600;}
.allbloglist .blogsdiv span.date i{margin-right: .5rem;}
.allbloglist .blogsdiv h5{margin: 1rem 0;}
.allbloglist .blogsdiv h5 a{text-decoration: none; color: #052944;}
.allbloglist .blogsdiv .blogbtn{position: absolute; bottom: 1.8rem; }
.allbloglist .blogsdiv .blogbtn a{text-decoration: none; background-color: #052944; color: #fff; padding: .8rem 1.3rem; border-radius: 2rem; transition: all .3s ease-in-out; border: 2px solid #052944;}
.allbloglist .blogsdiv .blogbtn a i{padding-left: .5rem;}
.allbloglist .blogsdiv .blogbtn:hover a{transition: all .3s ease-in-out; border: 2px solid #052944; background-color: #fff; color: #052944;}


.blogpage{padding: 3rem 0;}
.blogpage .container{display: flex; justify-content: space-between; align-items: start; width: 80%;}
.blogpage .blogsec{width: 65%;}

.blogimgs{width: 100%; height: 450px; box-shadow: 0px 0px 10px 0px rgba(0, 0, 0, 0.15);}
.blogsec h2{margin: 1rem 0; font-size: 1.9rem; color: #1380ab; font-weight: 600;
  /* background: -webkit-linear-gradient( #530bbc, #052944); */
  /* -webkit-background-clip: text; */
  /* -webkit-text-fill-color: transparent; */
}
.blogsec a{text-decoration: none; color: #1380ab;}
.blogsec h3{color: #052944;}
.blogsec h4{color: #052944; font-size: 1.3rem;}
.blogsec h5{color: #1380ab; font-size: 1.2rem; font-weight: 600; text-decoration: underline;}
.blogsec ul{padding-left: 1.5rem !important;}
.blogsec ul li{position: relative;}
.blogsec ul li::before{content: ""; position: absolute; width: .6rem; height: .6rem; background-color: #1380ab; border-radius: 50%; top: 7px; left: -20px;}

#interviewdiv{padding:1rem 0!important}
#interviewdiv .interviews{box-shadow:0 0 12px 0 rgb(0 0 0 / .12);margin:1rem 0;padding:2rem;border-radius:1rem}
#tables{padding:0rem}#tables h3{padding-bottom:2rem}
/* @media (max-width:567.99px){.blogsec{width:100% !important}.blogslider.swiper-container{width:100%!important;height:350px!important}.blogslider .swiper-slide h3{padding-top:3rem;font-size:1.5rem}#interviewdiv .interviews{margin:1rem!important}} */

.blogpage .sidesection{width: 30%;}
.blogpage .sidesection .categories{background-color: #05284317; padding: 1rem 1.4rem; border-radius: 1rem; margin-bottom: 2rem;}
.blogpage .sidesection .categories h3{background-color: #052944; color: #fff;padding: 1rem; border-radius: 1rem;}
.blogpage .sidesection .categories ul{padding-left: 0 !important;}
.blogpage .sidesection .categories ul li{padding: .5rem 1rem; position: relative; background-color: #fff; margin-bottom: .5rem; cursor: pointer;}
.blogpage .sidesection .categories ul a{text-decoration: none; color: #052944;}
.blogpage .sidesection .categories ul li span{position: absolute; right: 12px;top: 8px;}
.blogpage .sidesection .categories ul li:hover{transform: scale(1.03); background-color: #1380ab;}
.blogpage .sidesection .categories ul a li:hover{color: #fff;}

.blogpage .sidesection .recentpost h3{background-color: #052944; color: #fff;padding: 1rem; border-radius: 1rem;}
.blogpage .sidesection .posting{display: flex; justify-content: flex-start; align-items: center; flex-wrap: wrap;}
.blogpage .sidesection .posting .postsec{width: 45%; margin-right: 1rem;}
.blogpage .sidesection .posting .postsec img{border-radius: 1rem; height: 120px;}
.blogpage .sidesection .posting .postsec a{text-decoration: none; color: #1380ab;}
.blogpage .sidesection .posting .postsec h6{padding: 1rem 0;}

/* --------------------- accordion start -------------------------- */
.faqsection { padding: 5rem 0; position: relative;}
.faqsection h3 { position: relative; font-weight: 700; color: #052944; margin-bottom: 2rem;}
.accord { width: 100%; height: max-content; margin: 0.5rem 0; cursor: pointer; position: relative; border: 1px solid rgba(0, 0, 0, .125); transition: all .3s ease-in-out; background-color: rgba(0, 0, 0, .03); border-radius: 10px;}
.accord .accordHead { border-bottom: 1px solid rgba(0, 0, 0, .125); padding: .5rem 1rem;}
.accord.closes .accordContent { display: none; transition: all .3s ease-in-out;}
.accord .accordContent p { padding: 1.25rem 1.25rem 0rem !important; font-size: 14px !important;}
.accord .accordContent ul li{font-size: 14px; padding: 0rem 1.25rem !important;}
.accord .accordContent ul li::before{left: 0px; width: .5rem; height: .5rem;}
.accord .accordHead h6 { font-size: 1.1rem; color: #222222;}
.accord.open .accordHead h6 { color: #052944; font-size: 1.1rem; transition: all .3s ease-in-out;}
.accord .accordHead h6 i { padding-right: .6rem;}
.accord .accordHead .up-arrow,
.accord .accordHead .down-arrow { position: absolute; right: 0; top: 10px;}
.accord.closes .accordHead .up-arrow { display: none;}
.accord.closes .accordHead .down-arrow { display: block;}
.accord.open .accordHead .up-arrow { display: block;}
.accord.open .accordHead .down-arrow { display: none;}



/* services page */

.servicespage{padding: 3rem 0;}
.servicespage h2{font-size: 2rem;}
.servicespage .container{display: flex; justify-content: space-between; }
.servicespage .container .content{width: 80%;}
.servicespage .container .img{width: 60%;}
.splide__slide img { display: block; max-width: 100%; height: 250px; object-fit: cover; image-rendering: -webkit-optimize-contrast; image-rendering: -moz-crisp-edges; image-rendering: crisp-edges;}

#worksteps { padding: 3rem 0;}
#worksteps .detailstep { display: flex; justify-content: space-between; margin: 2rem 0; padding: 2rem;}
#worksteps .boxes { text-align: center; width: 28%; border: 2px solid #1d407617; padding: 2rem; border-radius: 2rem; transition: all .3s ease-in-out;}
#worksteps .boxes:hover{ box-shadow: 0px 0px 11px rgba(0, 0, 0, .15);}
#worksteps .boxes span i{font-size: 3rem;  background: linear-gradient(#0646a745, #052944); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
#worksteps .boxes h5 { font-size: 2rem; background: linear-gradient(#0646a745, #052944); -webkit-background-clip: text; -webkit-text-fill-color: transparent; margin: 1rem 0;}
#worksteps .boxes h3 { margin: .8rem 0; font-size: 1.4rem; color: #1d4076; font-weight: 700;}
#worksteps .boxes a { text-decoration: none; color: #1d4076; background-color: #1d40761c; border-radius: 1rem; padding: 1rem; font-weight: 700;}


/* services page project */

.project-area{padding: 3rem 0;}
.project-slider { position: relative;display: flex; justify-content: space-evenly; align-items: center; flex-wrap: wrap;}
.project-item{ position: relative; z-index: 1; padding-bottom: 30px; overflow: hidden; margin: 20px;}
.project-item a { display: block;}
.project-item a img{border-radius: 20px 20px 10px 10px;}
.project-item:hover .content { height: 180px;}
.project-item .content { position: absolute; z-index: 1; bottom: 10px; left: 0; right: 0; width: 90%; height: 65px; margin: 0 auto; background-color: #fff; padding: 20px; box-shadow: 0 0 15px rgba(0, 0, 0, 0.07); border-radius: 5px; transition: .5s;}
.project-item:hover .content::before { height: 100%; opacity: 1;}
.project-item .content::before { content: ""; position: absolute; z-index: -1; bottom: 0; left: 0; right: 0; width: 100%; height: 0%; background-color: #052944; transition: .5s; opacity: 0; border-radius: 5px;}
.project-item:hover .content h3 a{color: #fff;}
.project-item .content h3 { margin-bottom: 10px; text-align: center; font-weight: 600; transition: .5;}
.project-item .content h3 a {color: #1380ab; transition: .5s; text-decoration: none;}
.project-item .content h3{font-size: 20px;}
.project-item .content p { color: #fff; text-align: center; margin-bottom: 1rem; transition: .5s;}
.project-item .content a.project-btn{color: #052944; font-weight: 600; text-decoration: none; background: #fff; border-radius: 10px; width: max-content; margin: 0 auto; padding: .5rem 1rem;}

.services{padding: 2rem 0;}
.services .container{display: flex; justify-content: space-between; align-items: center;}
.choose-img-three { position: relative; z-index: 1; margin-right: 30px; margin-bottom: 30px; width: 50%;}
.choose-img-three::before { content: ""; right: 0; position: absolute; background-color: #f9f7f7; height: 10%; top: -5px; transform: skewY(-175deg); width: 100%; z-index: 1;}
.choose-img-three::after { content: ""; right: 0; position: absolute; background-color: #f9f7f7; height: 16%; bottom: -30px; transform: skewY(175deg); width: 100%; z-index: 1;}
.service-content{width: 40%;}
.service-content .applyBtn a{ background-color: #052944; color: #fff; border: 1px solid #052944; transition: all .3s ease-in-out;}
.service-content .applyBtn a:hover{background-color: #fff; color: #052944; border: 1px solid #052944; transition: all .3s ease-in-out;}
.servicebox{display: flex; justify-content: start; align-items: start;}
.servicebox .serviceBoxes{width: 24%; border: 2px solid #1d407617; padding: 2rem 1rem; margin: 2rem 1rem; border-radius: 1.5rem; text-align: center;}
.servicebox .serviceBoxes:hover{box-shadow: 0px 0px 15px 0px rgba(0,0,0,.14);}
.servicebox .serviceBoxes img{width: 25%; }
.servicebox .serviceBoxes h5{font-weight: 700; color: #052944; padding: 1rem 0 .5rem;}
.servicebox .serviceBoxes .applyBtn a{background-color: #052944; border: 1px solid #052944; color: #fff; transition: all .3s ease-in-out;}
.servicebox .serviceBoxes .applyBtn a:hover{background-color: #fff; color: #052944; transition: all .3s ease-in-out;}



/* .bg-img{background: url("../img/images.jfif"); background-repeat: no-repeat; background-size: cover;} */
.bg-img{background-color: #052944; padding: 1rem 0; display: flex; justify-content: center; align-items: center;}
.bg-img .content{margin-right: 1rem !important;}
.bg-img .content p{color: #fff; margin-bottom: 0 !important;}


#workstep { padding: 2rem 0;}
#workstep .detailstep{ display: flex; justify-content: space-between; align-items: center; padding: 2rem;}
#workstep .boxes { width: 25%; text-align: center; transition: all .3s ease-in-out;}
#workstep .boxes img{width: 25%;}
#workstep .boxes h5 { font-size: 5rem; margin-left: 8rem; background: linear-gradient(#0646a72e, #ffffff); -webkit-background-clip: text; -webkit-text-fill-color: transparent;}
#workstep .boxes h3 { margin: .8rem 0; font-size: 1.5rem; color: #1d4076; font-weight: 700;}
#workstep .firstarrow { rotate: 305deg;}
#workstep .secondnum { display: none;}
#workstep .secondnumber { display: block;}
#workstep .secondarrow { rotate: 53deg;}



.projcard-container { margin: 50px 0;}
.projcard-container,
.projcard-container * { box-sizing: border-box;}
.projcard-container { display: flex; justify-content: space-between; align-items: center; flex-wrap: wrap;}
.projcard { position: relative; width: 49%; height: 300px; margin-bottom: 40px; border-radius: 10px; background-color: #fff; border: 2px solid #ddd; font-size: 18px; overflow: hidden; cursor: pointer; box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .66); transition: box-shadow 0.2s ease, transform 0.2s ease;}
.projcard:hover { box-shadow: 0 34px 32px -33px rgba(0, 0, 0, .18); transform: translate(0px, -3px);}
.projcard::before { content: ""; position: absolute; top: 0; right: 0; bottom: 0; left: 0; background-image: linear-gradient(-70deg, #424242, transparent 50%); opacity: 0.07;}
.projcard:nth-child(2n)::before { background-image: linear-gradient(-250deg, #424242, transparent 50%);}
.projcard-innerbox { position: absolute; top: 0; right: 0; bottom: 0; left: 0;}
.projcard-img { position: absolute; height: 300px; width: 400px; top: 0; left: 0; transition: transform 0.2s ease;}
.projcard:nth-child(2n) .projcard-img { left: initial; right: 0;}
.projcard:hover .projcard-img { transform: scale(1.05) rotate(1deg);}
.projcard:hover .projcard-bar { width: 70px;}
.projcard-textbox { position: absolute; top: 7%; bottom: 7%; left: 425px; width: calc(100% - 445px); font-size: 17px;}
.projcard:nth-child(2n) .projcard-textbox { left: initial; right: 430px;}
.projcard-textbox::before,
.projcard-textbox::after { content: ""; position: absolute; display: block; background: #ff0000bb; background: #fff; top: -20%; left: -55px; height: 140%; width: 60px; transform: rotate(8deg);}
.projcard:nth-child(2n) .projcard-textbox::before { display: none;}
.projcard-textbox::after { display: none; left: initial; right: -55px;}
.projcard:nth-child(2n) .projcard-textbox::after { display: block;}
.projcard-textbox * { position: relative;}
.projcard-title { font-family: 'Voces', 'Open Sans', arial, sans-serif; font-size: 20px;}
.projcard-subtitle { font-family: 'Voces', 'Open Sans', arial, sans-serif; color: #888;}
.projcard-bar { left: -2px; width: 50px; height: 5px; margin: 10px 0; border-radius: 5px; background-color: #424242; transition: width 0.2s ease;}
.projcard-blue .projcard-bar { background-color: #0088FF;}
.projcard-blue::before { background-image: linear-gradient(-70deg, #0088FF, transparent 50%);}
.projcard-blue:nth-child(2n)::before { background-image: linear-gradient(-250deg, #0088FF, transparent 50%);}
.projcard-red .projcard-bar { background-color: #D62F1F;}
.projcard-red::before { background-image: linear-gradient(-70deg, #D62F1F, transparent 50%);}
.projcard-red:nth-child(2n)::before { background-image: linear-gradient(-250deg, #D62F1F, transparent 50%);}
.projcard-green .projcard-bar { background-color: #40BD00;}
.projcard-green::before { background-image: linear-gradient(-70deg, #40BD00, transparent 50%);}
.projcard-green:nth-child(2n)::before { background-image: linear-gradient(-250deg, #40BD00, transparent 50%);}
.projcard-yellow .projcard-bar { background-color: #F5AF41;}
.projcard-yellow::before { background-image: linear-gradient(-70deg, #F5AF41, transparent 50%);}
.projcard-yellow:nth-child(2n)::before { background-image: linear-gradient(-250deg, #F5AF41, transparent 50%);}
.projcard-orange .projcard-bar { background-color: #FF5722;}
.projcard-orange::before { background-image: linear-gradient(-70deg, #FF5722, transparent 50%);}
.projcard-orange:nth-child(2n)::before { background-image: linear-gradient(-250deg, #FF5722, transparent 50%);}
.projcard-brown .projcard-bar { background-color: #C49863;}
.projcard-brown::before { background-image: linear-gradient(-70deg, #C49863, transparent 50%);}
.projcard-brown:nth-child(2n)::before { background-image: linear-gradient(-250deg, #C49863, transparent 50%);}
.projcard-grey .projcard-bar { background-color: #424242;}
.projcard-grey::before { background-image: linear-gradient(-70deg, #424242, transparent 50%);}
.projcard-grey:nth-child(2n)::before { background-image: linear-gradient(-250deg, #424242, transparent 50%);}
.projcard-customcolor .projcard-bar { background-color: #F5AF41;}
.projcard-customcolor::before { background-image: linear-gradient(-70deg, #F5AF41, transparent 50%);}
.projcard-customcolor:nth-child(2n)::before { background-image: linear-gradient(-250deg, #F5AF41, transparent 50%);}
.projcard-description { z-index: 9; font-size: 14px; color: #424242; height: auto; overflow: hidden; text-overflow: ellipsis; margin-bottom: 1rem;}
.projcard-tagbox button { bottom: 3%; font-size: 25px; cursor: default; user-select: none; padding: 10px 20px; border-radius: 25px; text-decoration: none; border: none; outline: none; background: purple; box-shadow: 0 4px 21px -12px rgba(0, 0, 0, .66); transition: box-shadow 0.2s ease, transform 0.2s ease;}
.projcard-tagbox a{ text-decoration: none; color: #ddd;}
a.readbtn{background-color: #000; padding: .6rem .8rem; text-decoration: none; color: #fff; border-radius: .6rem;}
a.readbtn span i { rotate: 50deg; padding-left: .4rem;}

.bposervice-swiper .service { text-align: center; padding: 20px; background: #f9f9f9; border-radius: 8p}
.bposervice-swiper img { width: 80px; height: auto; margin-bottom: 10px;}
.bposervice-swiper h4 { font-size: 1rem; color: #333;}



/* footer section page */

.footer { position: relative; display: block; background: #052944; border-bottom: 1px solid rgba(255, 255, 255, 0.2); padding: 81px 0px 78px; z-index: 1;}
.footer .shape1{ position: absolute; top: -40px; left: 680px; border-bottom: 40px solid #03376b; border-left: 20px solid transparent; border-right: 20px solid transparent; content: "";}
.footer__bg { position: absolute; top: -40px; left: 0; bottom: 0; width: 700px; background-attachment: scroll; background-repeat: no-repeat; background-size: cover; background-position: center center; clip-path: polygon(0 0, 100% 0, 80% 100%, 0% 100%); z-index: -1;}
.footer__bg::before { position: absolute; top: 0; left: 0; bottom: 0; right: 0; background: #052944; content: ""; opacity: 0.75;}
.footer__inner { position: relative; display: block;}
.footer__content { position: relative; display: flex; align-items: center; justify-content: space-between; max-width: 650px; width: 100%; float: right;}
.footer__content .text-box { position: relative; display: block;}
.footer__content .text-box p { color: #fff; letter-spacing: 0.2em;}
.footer__content .text-box h2 { color: #fff; font-size: 40px; line-height: 50px; font-weight: 600; text-transform: capitalize; margin-top: 4px;}
.footer__content .btn-box { position: relative; display: block; line-height: 0;}
.thm-btn { position: relative; display: inline-block; color: #fff; font-size: 14px; line-height: 55px; font-weight: 600; background: #004a94; border-radius: 5px; padding: 0px 35px 0px; overflow: hidden; text-transform: uppercase; -webkit-transition: all 0.3s linear; -o-transition: all 0.3s linear; transition: all 0.3s linear; z-index: 1;}




.site-footer { position: relative; display: block; background-color: #052944; padding: 120px 0px 0px; overflow: hidden; z-index: 1;}
.site-footer .shape1 { position: absolute; top: 30px; left: 0; opacity: 0.5; z-index: -1;}
.float-bob-x { -webkit-animation-name: float-bob-x; animation-name: float-bob-x; -webkit-animation-duration: 2s; animation-duration: 2s; -webkit-animation-iteration-count: infinite; animation-iteration-count: infinite; -webkit-animation-timing-function: linear; animation-timing-function: linear;}

@keyframes float-bob-x{
    0% { transform: translateX(-30px);}
    50% { transform: translateX(-10px);}
    100% { transform: translateX(-30px);}
}

.site-footer .shape2 { position: absolute; top: 30px; right: 20px; opacity: 0.15; z-index: -1;}
.scale { animation: scale 2s alternate infinite; -webkit-animation: scale 2s alternate infinite;}
.site-footer .shape3 { position: absolute; bottom: 90px; right: 140px; opacity: 0.15; z-index: -1;}
.site-footer__top { position: relative; display: block; margin-bottom: 112px;}
.footer-widget__single { position: relative; display: block;}
.footer-widget__about { position: relative; display: block; z-index: 1;}
.footer-widget__about::before { position: absolute; top: -120px; left: -99999px; bottom: -999999px; right: -40px; background: rgba(255, 255, 255, 0.05); content: ""; z-index: -1;}
.site-footer__logo { position: relative; display: block;}
.site-footer__logo a { position: relative; display: inline-block;}
.footer-widget__about-text { position: relative; display: block; margin-top: 30px;}
.footer-widget__about-text p { color: #fff;}
.footer-widget__about-social-links { position: relative; display: block; margin-top: 27px;}
.footer-widget__about-social-links ul { position: relative; display: flex; align-items: center;}
.footer-widget__about-social-links ul li { position: relative; display: block; margin-right: .5rem;}
.footer-widget__about-social-links ul li a { text-decoration: none; position: relative; display: flex; align-items: center; justify-content: center; width: 35px; height: 35px; background: #fff; color: #052944; border-radius: 50%; overflow: hidden;}
.footer-widget__about-social-links ul li a::before { position: absolute; content: ""; top: 0; left: 0; right: 0; height: 100%; background-color: #004a94; -webkit-transition-delay: .1s; transition-delay: .1s; -webkit-transition-timing-function: ease-in-out; transition-timing-function: ease-in-out; -webkit-transition-duration: .4s; transition-duration: .4s; -webkit-transition-property: all; transition-property: all; opacity: 1; -webkit-transform-origin: top; transform-origin: top; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: scaleY(0); transform: scaleY(0); border-radius: 50%; z-index: -1;}

.footer-widget__about-social-links ul li a span { position: relative; display: inline-block; font-size: 15px;}
.footer-widget__about-social-links ul li a:hover { color: #fff; background-color: #004a94;}
.footer-widget__single .title-box { position: relative; display: block; margin-top: -7px; margin-bottom: 29px;}
.footer-widget__single .title-box h2 { color: #fff; font-size: 24px; line-height: 34px; font-weight: 600; text-transform: capitalize; margin-bottom: 6px;}
.footer-widget__single .title-box .line { position: relative; display: block; height: 2px; width: 105px; background: rgba(255, 255, 255, 0.25);}
.footer-widget__single .title-box .line::before { position: absolute; top: 0; right: -25px; width: 20px; height: 2px; background: rgba(255, 255, 255, 0.25); content: "";}
.footer-widget__single.footer-widget__services{padding-left: 3rem;}
.footer-widget__services-list { position: relative; display: block; padding-left: 0rem !important; margin-bottom: 0 !important;}
.footer-widget__services-list li { position: relative; display: block; margin-bottom: 11px;}
.footer-widget__services-list li a { color: #fff; font-size: 16px; line-height: 26px; font-weight: 400; text-decoration: none;}
.footer-widget__services-list li a span { position: relative; display: inline-block; font-size: 15px; line-height: 15px; top: 1px;}
.icon-right-chevron:before { content: "\e90e";}
.footer-widget__contact-list { position: relative; display: block; padding-left: 0 !important;}
.footer-widget__contact-list li { position: relative; display: flex; align-items: flex-start; margin-bottom: 21px;}

.footer-widget__contact-list li .icon-box { position: relative; display: flex; align-items: center; justify-content: center; width: 30px; height: 30px; background: rgba(255,255,255, 0.25); border-radius: 0px; top: 6px; padding: .5rem; margin-right: 1rem;}
.footer-widget__contact-list li .icon-box span { position: relative; display: inline-block; color: #fff; font-size: 15px; line-height: 15px;}
.footer-widget__contact-list li .text-box p { color: #fff; margin-bottom: 0 !important;}
.footer-widget__contact-list li .text-box p a{ color: #fff; text-decoration: none; margin-bottom: 0 !important;}
.footer-widget__newsletter { position: relative; display: block;}
.footer-widget__newsletter-text { position: relative; display: block;}
.footer-widget__newsletter-text p { color: #fff;}
.footer-one__subscribe-form { position: relative; display: block; margin-top: 22px;}
.footer-one__subscribe-form .subscribe-form { position: relative; display: block;}
.footer-one__subscribe-form .subscribe-form input[type="email"] { position: relative; display: block; width: 100%; height: 50px; padding: 0 20px; background: rgba(255, 255, 255, 1.0); border: none; color: var(--cleanin-gray); font-size: 16px; font-weight: 400; font-style: normal; border-radius: 5px; transition: all 500ms ease; font-family: var(--cleanin-font); text-transform: none; outline: none;}
.footer-one__subscribe-form .subscribe-form button { position: relative; margin-top: 15px;}
.footer-one__subscribe-form .subscribe-form button i{rotate: 50deg; margin-left: .5rem;}
/* .thm-btn {
    position: relative;
    display: inline-block;
    color: #fff;
    font-size: 14px;
    line-height: 55px;
    font-weight: 600;
    background: var(--cleanin-base);
    border-radius: 5px;
    padding: 0px 35px 0px;
    overflow: hidden;
    font-family: var(--cleanin-font);
    text-transform: uppercase;
    -webkit-transition: all 0.3s linear;
    -o-transition: all 0.3s linear;
    transition: all 0.3s linear;
    z-index: 1;
} */
.site-footer__bottom{ position: relative; display: block; background: #041d31; z-index: 5;}
.site-footer__bottom-inner { position: relative; display: flex; align-items: center; justify-content: space-between; padding: 24px 0px 22px;}
.site-footer__copyright { position: relative; display: block;}
.site-footer__copyright p { color: #fff;}
.site-footer__copyright p a { color: #fff;}
.site-footer__bottom-menu { position: relative; display: flex; align-items: center; }
.site-footer__bottom-menu li:first-child { padding-left: 0px;}
.site-footer__bottom-menu li { position: relative; display: block; padding-left: 25px; padding-right: 30px; list-style-type: none;}
.site-footer__bottom-menu li a{text-decoration: none; color: #fff;}