@import url('https://fonts.googleapis.com/css2?family=Plus+Jakarta+Sans:ital,wght@0,200..800;1,200..800&display=swap');
* {
  box-sizing: border-box;
  font-family: "Plus Jakarta Sans", sans-serif;
  scroll-behavior: smooth;
}

h1,
h2,
h3,
h4,
h5,
h6 {
  font-family: "Plus Jakarta Sans", sans-serif !important;
}

body {
  overflow-x: hidden;
}

/* Banner part starts here */

.banner-part {
  width: 100%;
}


.flex-system {
  display: flex;
}

.top-slider .container {
  max-width: 1350px;
  height: 85vh;
  display: flex;
  justify-content: start;
  align-items: center;

}



.top-slider .container .text {
  width: 60%;

}


/* Text part starts here */

.text h2 {
  font-style: normal;
  font-size: 40px;
  color: rgb(255, 253, 253);
  margin: 20px 0;
  text-align: left;
  width: 100%;
  font-family: "Montserrat", sans-serif;
  text-shadow: 3px 3px #000000;
  letter-spacing: 0.06em;
  text-transform: none;
  font-weight: bolder;
}



.text h2 span {

  font-style: normal;

  font-size: 1.5em;

}



.text p {

  font-size: 1.7em;

  color: #ffcbcb;

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

  width: 80%;

}



/* Text part ends here */



/* Button part starts here */

.text button {

  padding: 10px 16px;

  border-radius: 28px;

  background-color: #ff0b0b;

  border: none;

  text-transform: uppercase;

  text-decoration: none;

  font-size: 12px;

  color: white;

  font-weight: bold;

  letter-spacing: 0.1em;

}



.text button:hover {

  background-color: #d40303;

  color: white;

  transition: all 0.2s ease-in-out;

}



.button-design a {

  padding: 2px 12px;

  color: white;

  font-size: 70px;

}

.choose-us-box {

  box-shadow: 0px 9px 30px rgba(255, 149, 5, 0.1) !important;

  transition: box-shadow 0.4s ease-in-out;

}

.choose-us-box:hover {

  transition: all 0.8s ease-in-out;

  /* box-shadow: 0 0 0 2px rgba(218,102,123,1), 8px 8px 0 0 rgba(218,102,123,1) !important; */

  box-shadow: 0 20px 25px -5px rgba(0, 0, 0, 0.1), 0 8px 10px -6px rgba(0, 0, 0, 0.1) !important;

}

.yellow-shadow {

  box-shadow: 0px 9px 30px #ff95051a !important;

}



/*=================+ SEO part start  here +================= */

.seo-text {

  color: #716f7a;

  font-size: 18px !important;

  line-height: 30px;

  text-align: justify;

  padding-top: 25px;

  padding-right: 20px;

  font-family: "Plus Jakarta Sans", sans-serif;

}

.seo-text-pro {

  color: #716f7a;

  font-size: 18px !important;

  line-height: 30px;

  text-align: justify;

  padding-top: 10px;

  padding-right: 20px;

  font-family: "Plus Jakarta Sans", sans-serif;

}


.our-strength {

  display: flex;

}

.strength-card-system {

  padding: 18px 25px;

  margin: 10px;

  box-shadow: rgba(0, 0, 0, 0.1) 0px 0px 5px 0px, rgba(0, 0, 0, 0.1) 0px 0px 1px 0px;

  border-radius: 10px;

  display: flex;

  justify-content: center;

  max-width: 400px;

  transition: 0.5s;

}



.strength-card-system:hover {

  box-shadow: 0 10px 20px 0 rgba(95, 26, 137, 0.4);

}

.strength-card-contents h4 {

  font-weight: 600;

  font-size: 24px;

  color: #333333;

  margin-top: 10px;

  font-family: "Plus Jakarta Sans", sans-serif;

}



.strength-card-contents {

  color: #716f7a;

  padding: 8px 0;

  text-align: center;

  font-size: 18px !important;

}



@media only screen and (max-width: 600px) {



  .our-strength {

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    margin: 5px;

  }



}





/*=================+ SEO part ends  here +================= */







@media only screen and (max-width: 1050px) {

  .nav ul li {

    padding: 17px 8px !important;

  }

  #title {

    font-size: 38px !important;

  }

  #sub-title {

    font-size: 18px !important;

  }



}

.bg-image img {

  /* padding: 10px; */

  /* padding-left: 180px; */

}



.left-side-width {

  width: 65px;

}



.right-side-width {

  width: 65px;

}



/* Button part ends here */



/* Responsive part starts here */



@media screen and (max-width: 768px) {

  .top-slider .container {

    display: flex;

    flex-direction: column;

    justify-content: start;

    align-items: center;

    height: 100% !important;

    width: 100%;

    margin-top: 30px;

  }



  .bg-image img {

    width: 100% !important;

    height: 200px !important;

    padding-left: 0px;

  }



  .text h2 {

    font-size: 21px;

  }



  .text p {

    font-size: 17px;

    text-align: justify;

  }



  .button-design a {

    padding: 2px 12px;

    color: #9d9191;

    font-size: 32px;

  }



  .text button {

    padding: 6px 10px;

    font-size: 12px;

    margin-bottom: 9px;

  }



  .carousel-indicators {

    position: absolute;

    bottom: -22px;

  }



  /* .left-side-width {

    left: -17px;

  }

  .right-side-width{  

    right: 1px;

  } */

}



/* Responsive part ends here */



/* Banner part ends here */



/* Service page start here */

.box-flex {

  display: flex;

  justify-content: center;

  margin: 0 auto;

}



.dFlex {

  display: flex;

  justify-content: space-around;

}



.textColor {

  color: whitesmoke;

}



.bgGray {

  background-color: #2f3640;

}



.img-fit img {

  width: 100%;

  height: 80px;

}



.border-outside {

  border: 2px solid gray;

  text-align: center;

  border-radius: 5px;

}



.margin-top {

  margin-top: 50px;

}



.font-etc {

  font-size: 40px;

  font-weight: 600;

}



.services img {

  height: 170px;

  margin: 0 auto;

  margin-top: 50px;

  display: block;

  border-radius: 50%;

}



.card-text p {

  text-align: justify;

}



.before-hover p {

  font-size: 12px;

  padding: 5px 18px;

  border: 1px solid black;

  border-radius: 25px;

  color: black;

}



.active-bgBlue {

  background-color: #db3637;

}



.active-bgBlue,

.active-bgBlue p,

.active-bgBlue a {

  color: #f1f3f4;

  text-align: justify;

}



.active-bgBlue .button {

  font-size: 12px;

  padding: 5px 18px;

  border: 1px solid white;

  border-radius: 25px;

}



.shadowEffect {

  box-shadow: rgba(0, 0, 0, 0.35) 0px 5px 15px;

  border-radius: 30px;

}



.bradiusTLTB {

  border-top-left-radius: 30px 30px;

  border-bottom-left-radius: 30px 30px;

}



.bradiusTRBR {

  border-top-right-radius: 30px 30px;

  border-bottom-right-radius: 30px 30px;

}



.bgImage {

  height: 560px;

}



.img-size {

  height: 100%;

}



.text1 h2 {

  font-size: 40px;

  font-weight: 700;

}



.text1 span.year {

  color: #db3637;

  font-size: 160px;

  font-weight: bolder;

  text-shadow: 4px 4px 4px rgb(69, 61, 61);

}



.text1 p {

  font-size: 18px;

  font-weight: 700;

  font-style: italic;

}



.margin-top1 {

  margin-top: 65px;

  padding: 10px;

}



.paragraph {

  display: flex;

  flex-direction: row-reverse;

}



.t-color {

  color: #656565;

  font-weight: bold;

}



.fs {

  font-size: 17px;

}



.clear-both {

  clear: both;

}



.position-absoluate {

  position: absolute;

  text-align: center;

  top: 50%;

  left: 50%;

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

}



.position-absoluate h2 {

  font-style: italic;

}



.position-absoluate h1 {

  font-size: 50px;

  font-weight: bolder;

}



.position-absoluate img {

  width: 100px;

  height: 115px;

}



.button button {

  color: white;

  padding: 14px 40px;

  margin-top: 40px;

  border-radius: 6px;

  background-color: #b83c47;

  border: 2px solid white;

}



.button a {

  color: white;

}



.button a:hover {

  text-shadow: 2px 2px 4px #000000;

}



.banner_section h1 {

  font-size: 50px;

}



.text {

  color: white;

}



.padding-left-right {

  padding: 0px 10px;

}



/* Service page start here */

/* Service page responsive starts here */

@media screen and (max-width: 768px) {

  .font-etc {

    font-size: 22px !important;

  }



  .fs {

    font-size: 15px !important;

  }



  .t-color {

    font-weight: 400 !important;

  }



  .card-text p {

    text-align: justify !important;

    font-size: 14px;

  }



  .services img {

    /* width: 100%; */

    height: 140px !important;

  }

}



/* Service page responsive ends here 





/* Business banner responsive part start here */

.banner_section {

  display: flex;

  justify-content: space-around;

  align-items: center;

  /* background-color: #09D8DE; */

  width: 100%;

  /* height: 630px; */

}





@media screen and (max-width: 768px) {

  .business-banner {

    width: 100% !important;

  }



  .position-absoluate h2 {

    font-size: 18px;

  }



  .position-absoluate h1 {

    font-size: 25px;

  }



  .button button {

    padding: 7px 13px;

    font-size: 14px;

  }



  .box-flex {

    display: flex;

    flex-direction: column;

  }



  .padding-left-right {

    padding: 0px 16px;

  }

}



/* Business banner responsive part end here */

/* Client testimmonial part starts here */



.clients-testimonials h2 {

  font-size: 40px !important;

  text-align: center;

  margin-top: 40px;

  font-weight: bolder;

}



.clients-testimonials h5 {

  font-size: 20px;

  color: #434343;

  text-align: center;

  font-weight: bold;

}



.marketing {

  width: 580px;

  height: 340px;

  margin: 15px;

  background-color: #f6f9ff;

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);

}



.marketing h2 {

  font-size: 25px;

  margin-top: 40px;

  margin-left: 60px;

  font-weight: bolder;

}



.marketing p {

  font-size: 15px;

  color: #808993;

  margin-left: 60px;

  margin-top: 10px;

}



.marketing h6 {

  font-size: 15px;

  margin-left: 30px;

  margin-top: 20px;

}



.marketing .mText {

  font-size: 15px;

  margin-left: 30px;

  margin-top: 50px;

  font-weight: bold;

}



.ceo {

  width: 580px;

  height: 340px;

  margin: 15px;

  background-color: #f6f9ff;

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);

}



.ceo h2 {

  font-size: 25px;

  margin-top: 40px;

  margin-left: 60px;

  font-weight: bolder;

}



.ceo h6 {

  font-size: 15px;

  margin-left: 30px;

  margin-top: 20px;

}



.ceo .mText {

  font-size: 15px;

  margin-left: 30px;

  margin-top: 50px;

  font-weight: bold;

}



.ceo p {

  font-size: 15px;

  color: #808993;

  margin-left: 60px;

  margin-top: 10px;

}



.heading {

  text-align: center;

  padding: 55px;

}



.heading h1 {

  font-size: 45px;

  font-weight: 600;

}



.heading h5 {

  color: #656565;

}



/* Client testimmonial part ends here */

/* Client testimmonial responsive  part starts here */

@media screen and (max-width: 768px) {

  .carousel .carousel-item {

    height: 100%;

    width: 100%;

  }



  .clients-testimonials h1 {

    font-size: 22px;

  }



  .clients-testimonials h5 {

    font-size: 15px;

  }



  .testimonial p {

    font-size: 14px !important;

  }

}



/* Client testimmonial responsive  part ends here */



@import url("https://fonts.googleapis.com/css2?family=Comfortaa&display=swap");



/*===========================+ Navbar starts here +======================== */

.navbar-bgGradiant {

  /* background: linear-gradient(to right, #e8ebcd, #d5e9f3); */

  background-color: white;

}



.position-sticky {

  position: sticky;

  top: 0;

  z-index: 1000;

  background-color: white;

}



.top-bar {

  height: 40px;

  display: flex;

  justify-content: space-between;

  align-items: center;

  max-width: 1320px;

  font-size: 14px;

  margin: 0 auto;

}



.top-menu-bar {

  background-color: #2f3640;

}



.top-bar-content {

  max-width: 1320px;

  padding: 5px 30px;

  display: flex;

  justify-content: space-between;

}



.top-bar a {

  text-decoration: none;

  color: white;

  margin-right: 10px;

}



.top-bar i {

  color: white;

  margin: 0 3px;

}



.top-bar-icon {

  font-size: 18px;

}



.topmenu-align {

  padding-right: 368px;

}



.nav-part {

  margin: 0 auto;

}



nav ul li {

  /*padding: 25px 12px;*/

  font-weight: bold;

}


.nav-link:hover {

  color: #0275d8;

  transition: all 0.8s ease-in-out;

}

.nav-item {

  transition: 0.4s all ease-in;

}

.navbar .nav-item:hover a {

  /*color: #db3637;*/

}

.navbar .nav-item a {
  color: black;
  /*font-size: 14px;*/
}


.navbar .nav-item:hover a {
  /*color: #fff;*/
}


/*.navbar .dropdown a {*/

/*  color: black;*/

/*  font-size: 14px;*/

/*  background-color: transparent;*/

/*  margin-left: 0 !important;*/

/*  width: 100% !important;*/

/*  text-transform: capitalize;*/

/*}*/

/*.navbar .dropdown .down-menu li {*/

/*  padding: 5px 10px;*/

/*  border-bottom: 1px solid white;*/

/*}*/

.navbar .dropdown .down-menu li a {

  color: white;

}


@media only screen and (max-width: 768px) {

  .top-bar {

    display: none;

  }



  /*.navbar .nav-item {*/

  /*  padding: 10px 0px !important;*/

  /*}*/



  /*.navbar .nav-item:hover {*/

  /*  background-color: #fff;*/

  /*}*/



  /*.navbar .nav-item:hover a {*/

  /*  color: black;*/

  /*}*/



  /*.navbar .nav-item a:hover {*/

  /*  padding-bottom: 0px;*/

  /*  transition: ease-in -0.5s;*/

  /*}*/



  /*.navbar-brand img {*/

  /*  width: 105px !important;*/

  /*  height: 100%;*/

  /*}*/

}



/* phone size nav icon responsive starts */

@media (max-width: 768px) {

  /*.navmenu-left-right {*/

  /*  padding: 0 20px;*/

  /*}*/



  /*.navbar {*/

  /*  padding: 12px 0 !important;*/

  /*}*/

}



/* phone size nav icon responsive ends */

/*===========================+ Navbar ends here +======================== */

/* Banner starts here */

.margin-left {

  margin-left: 50px;

  margin-bottom: 40px;

}



.margin-left p {

  font-size: 20px;

}



.service-center button {

  background-color: #09d8de;

  color: white;

  padding: 12px 25px;

  margin-top: 15px;

  border: 3px solid white;

  border-radius: 5px;

}



.mp-fit {

  margin-right: 20px;

}



/* <!-- =================================+work experience starts here+===============================--> */

.flex-part {

  display: flex;

  flex-wrap: wrap;

}



.containerHead {

  align-items: left;

  justify-content: left;

  display: flex;

  flex-wrap: wrap;

  width: 100%;

  background-color: #f5f5f5;

  justify-content: left;

}



.image-fit img {

  height: 100%;



}



.margin-all {

  margin: 8px;

  border-radius: 5px;

}



.card {
  box-sizing: border-box;
  margin-top: 10px;
  margin-bottom: 10px;
  background-color: #fff;
}



.position-rel {

  position: relative;

}



.overlay {

  position: absolute;

  bottom: 0;

  /* background-color: rgba(0, 0, 0, 0.475); */

  background-size: cover;

  overflow: hidden;

  width: 100%;

  height: 0;

  transition: 0.6s ease-in-out;

  /* From https://css.glass */

  background: rgba(0, 0, 0, 0.2);

  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

  backdrop-filter: blur(10px);

  -webkit-backdrop-filter: blur(10px);

  border: 1px solid rgba(255, 255, 255, 0.3);

  border-top: 2px solid rgb(255, 255, 255);

  background-color: rgba(0, 0, 0, 0.475);

  /* background-image: url(../../assets/images/business-banner-background.jpg); */



}



.latest-work:hover .overlay {

  bottom: 0;

  height: fit-content;

  padding-bottom: 35px;

}



.text-style h3 {

  color: #ffffff;

  font-weight: bold;

  font-size: 20px;

  text-transform: capitalize;

  text-align: left;

  padding-left: 20px;

  /* position: absolute;

  top: 22%;

  left: 50%;

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

  text-align: center; */

}



.text-style p {

  color: rgb(255, 255, 255);

  font-size: 15px;

  /* font-weight: bold; */

  /* position: absolute; */

  /* top: 38%; */

  padding: 0px 20px;

  margin-top: 20px;

  text-align: justify;

}



.text-style a {

  margin-left: 20px;

  cursor: pointer;

}



.card>.card-inner {

  padding: 10px;

}



.card .header h2,

h3 {

  margin-bottom: 0px;

  margin-top: 0px;

}



.card .header {

  margin-bottom: 5px;

}



.card img {

  width: 100%;

}



.text-normal span {

  font-size: 18px;

  font-weight: normal;

  padding: 0px 10px;

}



.business-listing {

  display: flex;

}



.list-decorate li {

  color: black;

  font-weight: bold;

  padding: 5px;

  list-style-type: none;

  text-decoration: none;

  font-size: 20px;

}



/* Business responsive part starts here */

/* .business-banner-parent{

  width: 100%;

  background-image: url(../../assets/images/business-banner-background.jpg);

  background-size: cover;

  background-repeat: no-repeat;

  padding: 0;

  margin: 0;

}

.business-banner{

  display: flex;

  align-items: start !important;

  padding: 40px 0;

}

.business-banner h2{

  font-size: 16px;

    font-weight: 600;

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

    text-transform: uppercase;

}

.business-banner ul{

  padding: 30px;

}

.business-banner ul li{

  list-style-type: none;

  padding-bottom: 30px;

}

.business-banner ul li span{

  font-size: 20px;

  font-weight: bold;

  display: block;

}

@media (max-width: 768px) {

  .business-banner-parent{

  padding: 20px 0;

  }

  .responsive {

    display: flex;

    flex-direction: column;

  }

  .img-size {

    width: 100%;

    height: 350px;

  }

  .text1 h2 {

    font-size: 20px;

  }

  .text1 span.year {

    font-size: 77px;

  }

  .text-normal p {

    padding-top: 10px;

    text-align: justify;

  }

  .business-banner {

    width: 100%;

  }

  .banner-res {

    width: 100%;

    height: 150px;

  }

  .text-normal h6 {

    text-align: justify !important;

  }

  .business-listing li {

    font-size: 14px;

    padding: 3px;

  }

  .list-decorate i {

    font-size: 14px !important;

  }

  .list-decorate {

    padding: 0px;

  }

} */



/* Business responsive part ends here */



/* <!-- =================================+work experience ends here+===============================--> */

/* work experience responsive part starts here */

@media screen and (max-width: 768px) {

  .heading h1 {

    font-size: 26px;

  }



  .heading h5 {

    font-size: 14px;

  }



  .text-style h3 {

    font-size: 22px !important;

    top: 28%;

  }



  .text-style p {

    font-size: 15px;

  }



  .card img {

    width: 100%;

  }



  .image-fit img {

    width: 100% !important;

  }



  .flex-part {

    display: flex !important;

    flex-direction: column !important;

    flex-wrap: nowrap;

  }



  .margin-all {

    margin: 8px 0px !important;

  }

}



/* work experience responsive part ends here */



/* <!-- ======================+ Swing counter starts here+======================================== --> */

.container1 {

  display: flex;

  flex-wrap: wrap;

  width: 100%;

  margin-top: 60px;

  padding: 100px;

  /* background-color: #f5f5f5; */

  background-image: url(../../assets/images/stripe.jpg);

  background-size: cover;

  justify-content: center;



}



.row {

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0 auto;

}



.card-design {

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;

  width: 250px;

  height: 100%;

  margin: 10px;

  padding: 21px 0px;



  /* From https://css.glass */

  background: rgba(255, 255, 255, 0.2);

  /* border-radius: 16px; */

  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

  backdrop-filter: blur(5px);

  -webkit-backdrop-filter: blur(5px);

  border: 1px solid rgba(255, 255, 255, 0.3);

  /* border-top: 4px solid #FA8A2E; */

  /* background-image: url(../../assets/images/graph.png); */

}



.card-design:hover {

  /* background-color: #FA8A2E; */

  /* background-color: #019CDE; */

  background-color: white;

  /* color: rgb(0, 0, 0); */

  /* box-shadow: 0 4px 30px rgb(255, 255, 255); */

  backdrop-filter: blur(0);

  -webkit-backdrop-filter: blur(0);

  transition: all 0.2s ease-in;

  transform: scale(1.03);

}



.card-design img {

  width: 45px;

  height: 45px;

}



.card-design span {

  /* font-family: 'Kanit', sans-serif; */

  font-family: 'Concert One', sans-serif;

  font-size: 50px;

  color: #ff8e4e;

  padding: 10px;

  /* text-shadow: 1px 1px 0 #000000, 1px -1px 0 #000000, -1px 1px 0 #000000, -1px -1px 0 #000000, 1px 0px 0 #000000, 0px 1px 0 #000000, -1px 0px 0 #000000, 0px -1px 0 #000000; */



}



.card-design h5 {

  font-weight: 600;

}



/* Swing responsive starts here */

@media screen and (max-width: 768px) {

  .card-design {

    width: 100%;

    height: 100%;

    margin: 13px auto !important;

  }



  .container1 {

    padding: 0px;

  }

}



/* Swing responsive ends here */



/* <!-- ======================+ Swing counter ends here+======================================== --> */

/* Carousel starts here */

.container-xl {

  height: 100%;

}



h2 {

  font-size: 26px;

  font-weight: 300;

  text-align: center;

  text-transform: uppercase;

  position: relative;

  /* margin: 30px 0 70px; */

}



h2::after {

  content: "";

  width: 100px;

  position: absolute;

  margin: 0 auto;

  height: 4px;

  border-radius: 1px;

  /* background: #1c47e3; */

  left: 0;

  right: 0;

  bottom: -20px;

}



.carousel .carousel-item {

  color: #999;

  overflow: hidden;

  /* min-height: 120px; */

  font-size: 13px;

}



.carousel .media img {

  width: 100px;

  height: 100px;

  display: block;

  border-radius: 50%;

}



.carousel .testimonial {

  padding: 0 15px 0 45px;

  position: relative;

  min-height: 250px;

  color: black;

}





















/* .carousel .testimonial::before {

  content: "\201C";

  color: #d8d8d8;

  font-weight: bold;

  font-size: 80px;

  line-height: 50px;

  position: absolute;

  left: 50%;

  top: 0px;

  padding-top: -5px;

} */

/* .carousel-control-prev-icon,.carousel-control-next-icon{

  border-radius: 50%;

  background-color: antiquewhite;

} */

.carousel-control-next-icon i {

  background-color: red;

}



.carousel .overview b {

  text-transform: uppercase;

  color: black;

}



.carousel-indicators li,

.carousel-indicators li.active {

  width: 20px;

  height: 20px;

  border-radius: 50%;

  margin: 1px 3px;

  box-sizing: border-box;

}



.carousel-indicators li {

  /* background: #F5F7FC;

  border: 4px solid #fff; */

  background: #ffc1c141;

  border: 4px solid #F3F6FC;

}



.carousel-indicators li.active {

  color: #F5F7FC;

  background: #ed3106;

  border: 8px double;

}



.testimonial p {

  font-size: 17px;

}



/* Carousel ends here */

/* Main Footer */

.footer-container {

  background-color: #2E3C49;

  /* box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1); */

  backdrop-filter: blur(1px);

  -webkit-backdrop-filter: blur(5px);

  color: #dddddd;

}



.f-container {

  /* background-image: url(../../assets/images/footer.webp);

  background-size: cover;

  background-position: center;

  background-repeat: no-repeat; */



}



footer ul {

  padding-left: 0;

  list-style: none;

}



.follow ul,

li,

a {

  text-decoration: none;

  /* color: #000; */

}

footer a {

  color: #dddddd;

}

footer a:hover {

  color: #ffffff;

}

footer hr {

  border: 2px dotted #b8b8b8;

}

.follow ul li {

  padding: 2px;

  width: 40px;

  height: 40px;

  display: flex;

  align-items: center;

  justify-content: center;

  border-radius: 10px;

  background-color: #f5f7fc15;

  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;

  backdrop-filter: blur(7.9px);

  -webkit-backdrop-filter: blur(7.9px);

}



.follow ul li:hover .fa-facebook-f {

  color: white;

}



.follow ul li:hover.facebook {

  background-color: #3b59ff;

}



.follow ul li:hover .fa-twitter {

  color: white;

}



.follow ul li:hover.twitter {

  background-color: #5db3ff;

}



.follow ul li:hover .fa-youtube {

  color: white;

}



.follow ul li:hover.youtube {

  background-color: #e41212;

}



.follow ul li:hover .fa-instagram {

  color: white;

}



.follow ul li:hover.instagram {

  background: radial-gradient(circle at 33% 100%, #fed373 4%, #f15245 30%, #d92e7f 62%, #9b36b7 85%, #515ecf);

}



.follow ul li:hover .fa-linkedin {

  color: white;

}



.follow ul li:hover.linkedin {

  background-color: #0a66c2;

}



.list-padding h6 {

  display: block;

  /* margin-top: 5px; */

}



.useful-link li:hover {

  transition: all 0.4s ease-in-out;

  margin-left: 5px;

}



/* .follow ul,

li,

a i {

  color: white;

} */

.list-padding ul li {

  padding: 6px;

}



.list-padding ul {

  /* margin-top: 60px; */

}



.padding-fit p {

  /* padding: 15px; */

}



.margin-fit {

  /* margin-top: 27px; */

}



/* footer responsive part starts here */

@media screen and (max-width: 768px) {

  .link-res {

    /* margin-left: 66px; */

    text-align: left;

  }



  .list-padding {

    padding-top: 5px;

  }



  .list-padding ul {

    margin-top: 0px !important;

  }



  .imageE h3 {

    /* text-align: center !important; */

  }



  .list-padding ul li {

    margin-left: 0px;

  }

}



/* footer responsive part ends here */

/* CUSTOMIZE THE CAROUSEL

-------------------------------------------------- */



/* Carousel base class */

.carousel {

  /* margin-bottom: 4rem; */

}



/* Since positioning the image, we need to help out the caption */

.carousel-caption {

  bottom: 3rem;

  z-index: 10;

  position: unset !important;

}



/* Declare heights because of positioning of img element */

.carousel-item {

  /* height: 32rem; */

  /* height: 85vh; */

  /* width: 60%; */

  /* margin: 0 auto; */

  /* border: 3px solid red; */

}



.carousel-item-banner {}



/* MARKETING CONTENT

-------------------------------------------------- */



/* Center align the text within the three columns below the carousel */

.marketing .col-lg-4 {

  margin-bottom: 1.5rem;

  text-align: center;

}



/* rtl:begin:ignore */

.marketing .col-lg-4 p {

  margin-right: 0.75rem;

  margin-left: 0.75rem;

}



/* rtl:end:ignore */



/* Featurettes

------------------------- */



.featurette-divider {

  margin: 5rem 0;

  /* Space out the Bootstrap <hr> more */

}



/* Thin out the marketing headings */

/* rtl:begin:remove */

.featurette-heading {

  letter-spacing: -0.05rem;

}



/* rtl:end:remove */



/* RESPONSIVE CSS

-------------------------------------------------- */



@media (min-width: 40em) {



  /* Bump up size of carousel content */

  .carousel-caption p {

    margin-bottom: 1.25rem;

    font-size: 1.25rem;

    line-height: 1.4;

  }



  .featurette-heading {

    font-size: 50px;

  }

}



@media (min-width: 62em) {

  .featurette-heading {

    margin-top: 7rem;

  }

}



.bd-placeholder-img {

  font-size: 1.125rem;

  text-anchor: middle;

  -webkit-user-select: none;

  -moz-user-select: none;

  user-select: none;

}



@media (min-width: 768px) {

  .bd-placeholder-img-lg {

    font-size: 3.5rem;

  }

}



.b-example-divider {

  width: 100%;

  height: 3rem;

  background-color: rgba(0, 0, 0, 0.1);

  border: solid rgba(0, 0, 0, 0.15);

  border-width: 1px 0;

  box-shadow: inset 0 0.5em 1.5em rgba(0, 0, 0, 0.1),

    inset 0 0.125em 0.5em rgba(0, 0, 0, 0.15);

}



.b-example-vr {

  flex-shrink: 0;

  width: 1.5rem;

  height: 100vh;

}



.bi {

  vertical-align: -0.125em;

  fill: currentColor;

}



.nav-scroller {

  position: relative;

  z-index: 2;

  height: 2.75rem;

  overflow-y: hidden;

}



.nav-scroller .nav {

  display: flex;

  flex-wrap: nowrap;

  padding-bottom: 1rem;

  margin-top: -1px;

  overflow-x: auto;

  text-align: center;

  white-space: nowrap;

  -webkit-overflow-scrolling: touch;

}



.btn-bd-primary {

  --bd-violet-bg: #712cf9;

  --bd-violet-rgb: 112.520718, 44.062154, 249.437846;



  --bs-btn-font-weight: 600;

  --bs-btn-color: var(--bs-white);

  --bs-btn-bg: var(--bd-violet-bg);

  --bs-btn-border-color: var(--bd-violet-bg);

  --bs-btn-hover-color: var(--bs-white);

  --bs-btn-hover-bg: #6528e0;

  --bs-btn-hover-border-color: #6528e0;

  --bs-btn-focus-shadow-rgb: var(--bd-violet-rgb);

  --bs-btn-active-color: var(--bs-btn-hover-color);

  --bs-btn-active-bg: #5a23c8;

  --bs-btn-active-border-color: #5a23c8;

}



.bd-mode-toggle {

  z-index: 1500;

}



a:link,

a:visited,

a:hover,

a:active {

  text-decoration: none !important;

}



/* #### Carousel Previous/Next button #### */



/* .carousel-control-prev-icon,

.carousel-control-next-icon {

  height: 100px;

  width: 100px;

  background-size: 100%, 100%;

} */



/* .carousel-control-next-icon:after {

  content: "";

  font-size: 20px;

  color: rgb(70, 70, 70);

  margin-right: -100px;

  padding: 10px;

  background: url(../images/chevron-right-solid.svg);

  background-repeat: no-repeat;

  background-size: cover;

}







.carousel-control-prev-icon:after {

  content: "";

  font-size: 20px;

  color: rgb(70, 70, 70);

  margin-left: -120px;

  padding: 10px;

  background: url(../images/chevron-left-solid.svg);

  background-repeat: no-repeat;

  background-size: cover;

} */

.carousel-control-next {

  right: 0;

}



.carousel-control-prev {

  left: 0;

}



.carousel-control-next,

.carousel-control-prev {

  position: absolute;

  top: 0;

  bottom: 0;

  z-index: 1;

  display: flex;

  align-items: center;

  justify-content: center;

  width: 15%;

  padding: 0;

  color: #000000 !important;

  text-align: center;

  background: 0 0;

  border: 0;

  opacity: .8;

  transition: opacity .15s ease;



}



.carousel-control-next-icon,

.carousel-control-prev-icon {

  display: inline-block;

  width: 2rem;

  height: 2rem;

  background-repeat: no-repeat;

  background-position: 50%;

  background-size: 100% 100%;

}



.navbar {

  /* border-bottom: 1px solid #bcbdbd; */

  padding: 0;

  margin: 0;

}



.bannGrad {

  background-image: linear-gradient(rgb(255, 255, 255), rgb(236, 236, 234));

}



/*==================breadcrumb=================*/



.breadcrumbs {

  list-style: none;

  padding: 10px 0 !important;

  margin: 0;

}



.breadcrumbs_item {

  /* font-family: Oswald, Arial, Helvetica, sans-serif !important; */

  font-size: 15px !important;

  position: relative;

  display: inline-block;

}



.breadcrumbs_item:before {

  content: "\203A";

  display: inline-block;

  border-radius: 50%;

  margin: 0 10px;

  color: black !important;

}



.breadcrumbs_item a {

  color: black !important;

}



.breadcrumbs_item a:hover {

  color: #bc2029;

}



.breadcrumbs_item:first-child:before {

  display: none;

}



.separator {

  margin: 0 auto 20px auto;

  width: 100%;

  height: 20px;

  background: url(../images/divider-36082.png) center center no-repeat;

}



/*================Contact Us====================*/



.reserve-box {

  position: relative;

  margin-bottom: 30px;

}



.reserve-box .inner-box {

  position: relative;

  padding: 30px 0px;

}



.reserve-box .inner-box .content {

  position: relative;

  padding-left: 90px;

  padding-right: 15px;

}



.reserve-box .inner-box:before {

  position: absolute;

  content: "";

  left: 30px;

  top: 0px;

  right: 0px;

  bottom: 0px;

  border: 1px dashed #414141;

  background: white;

  -webkit-transition: all 600ms ease;

  -ms-transition: all 600ms ease;

  -o-transition: all 600ms ease;

  -moz-transition: all 600ms ease;

  transition: all 600ms ease;

}



.reserve-box .inner-box:hover::before {

  border-style: solid;

}



.reserve-box .inner-box .content .icon {

  position: absolute;

  left: 0px;

  top: 6px;

  width: 60px;

  height: 60px;

  text-align: center;

  line-height: 63px;

  font-size: 26px;

  display: inline-block;

  -webkit-transition: all 300ms ease;

  -ms-transition: all 300ms ease;

  -o-transition: all 300ms ease;

  -moz-transition: all 300ms ease;

  transition: all 300ms ease;

  background: url(../images/icons/cap-1.png) no-repeat;

}



.reserve-box .inner-box .content .icon:after {

  position: absolute;

  content: "";

  left: 0px;

  top: 0px;

  width: 60px;

  height: 60px;

  opacity: 0;

  -webkit-transition: all 300ms ease;

  -ms-transition: all 300ms ease;

  -o-transition: all 300ms ease;

  -moz-transition: all 300ms ease;

  transition: all 300ms ease;

  background: url(../images/icons/cap-2.png) no-repeat;

}



.reserve-box .inner-box:hover .content .icon:after {

  opacity: 1;

}



.inner-box .icon .fa {

  font-size: 30px;

  color: #116e46;

  padding: 15px 0 0 10px;

}



.reserve-box .inner-box:hover .content .icon {

  color: #fff;

}



.reserve-box .inner-box .content h4 {

  position: relative;

  margin-bottom: 10px;

}



.reserve-box .inner-box .content ul {

  position: relative;

  margin: 0;

  padding: 0;

}



.reserve-box .inner-box .content ul li {

  position: relative;

  margin-bottom: 0px;

}



.reserve-box .inner-box .content ul li a {

  position: relative;

  color: #fff;

  font-size: 90%;

}



.reservation-booking-form {

  position: relative;

  padding: 25px 25px 10px;

  border: 1px dashed #414141;

}



.reservation-booking-form .image-column {

  position: relative;

}



.reservation-booking-form .image-column .inner-column {

  position: relative;

}



.reservation-booking-form .image-column .image {

  position: relative;

}



.reservation-booking-form .image-column .image img {

  position: relative;

  width: 100%;

  display: block;

}



.reservation-booking-form .form-column {

  position: relative;

}



.reservation-booking-form .form-column .inner-column {

  position: relative;

}



.default-form .form-group input[type="text"],

.default-form .form-group input[type="email"],

.default-form .form-group input[type="tel"],

.default-form .form-group input[type="url"],

.default-form .form-group input[type="file"],

.default-form .form-group textarea,

.default-form .form-group select {

  position: relative;

  display: block;

  width: 100%;

  line-height: 20px;

  color: #555555;

  font-weight: 400;

  padding: 14px 24px;

  z-index: 1;

  background-color: #ffffff;

  border: 1px dashed #2d5ea1;

  -webkit-transition: all 300ms ease;

  -ms-transition: all 300ms ease;

  -o-transition: all 300ms ease;

  -moz-transition: all 300ms ease;

  transition: all 300ms ease;

}



.btn-style-three {

  position: relative;

  display: inline-block;

  line-height: 30px;

  color: #000;

  padding: 12px 40px;

  font-weight: 700;

  overflow: hidden;

  border-radius: 0px;

  overflow: hidden;

  padding: 15px 38px;

  background-color: #fff;

  text-transform: capitalize;

  cursor: pointer;

}



.btn-style-three:before {

  position: absolute;

  content: "";

  left: 100%;

  top: 0px;

  width: 100%;

  height: 100%;

  z-index: 1;

  /* opacity: 1; */

  color: black;

  /* background-color: #047918; */

  -webkit-transition: all 0.4s;

  -moz-transition: all 0.4s;

  -o-transition: all 0.4s;

  transition: all 0.4s;

}



.btn-style-three .txt {

  position: relative;

  z-index: 1;

}



.btn-style-three:hover::before {

  left: 0%;

  -webkit-transform: scale(1, 1);

  transform: scale(1, 1);

}



.btn-style-three:hover {

  color: #000000;

}



/* popup */

#popup {

  position: fixed;

  inset: 0;

  z-index: 10000;

  background-color: rgba(228, 228, 228, 0.8);

}



#popupDialog {

  position: absolute;

  top: 50%;

  left: 50%;

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

  min-width: 400px;

  width: fit-content;

  max-width: 90vw;

  max-height: 80vh;

  background-color: white;

  color: black;

  /* font-family: initial; */

  font-size: 1rem;

  overflow-y: auto;

}



#popupDialog::-webkit-scrollbar {

  width: 0px;

}



#popupDialog header {

  position: sticky;

  top: 0;

  background: rgb(221, 221, 221);

  background: linear-gradient(140deg,

      rgba(221, 221, 221, 1) 0%,

      rgba(236, 236, 236, 1) 100%);

  display: flex;

  justify-content: space-between;

  border-bottom: 1px solid lightgray;

  box-shadow: 0 0 10px lightgrey;

  font-weight: bolder;

}



#popupDialog header h4 {

  font-weight: bold;

  padding: 5px 15px;

}



#popupDialog header #closeBtn {

  display: flex;

  align-items: center;

  justify-content: center;

  font-weight: bold;

  padding: 0 20px;

  border: none;

  font-size: 20px;

  /* font-family: monospace; */

  cursor: pointer;

  background-color: lightgray;

}



#error_ChoiceMore {

  position: sticky;

  top: 48px;

  background: white;

  border-bottom: 1px solid lightgray;

  margin: 0;

  color: red;

  text-align: center;

  box-shadow: 0 0 10px lightgrey;

}



#error_ChoiceMore.hide {

  visibility: hidden;

}



#popupDialog #popupContent {

  padding: 5px 20px 0 20px;

  overflow-y: auto;

}



#popupDialog footer {

  position: sticky;

  bottom: 0;

  width: 100%;

  margin: 0;

}



#popupDialog footer #scrollDownIndicator {

  box-shadow: 0 0 10px lightgrey;

  background: white;

  display: flex;

  justify-content: flex-end;

  gap: 10px;

  border-top: 1px solid lightgray;

  font-size: 13px;

  padding-right: 10px;

}



#popupDialog footer #scrollDownIndicator i {

  animation: scrolldownArrow 2s linear infinite;

}



@keyframes scrolldownArrow {

  0% {

    transform: translateY(5px);

  }



  50% {

    transform: translateY(15px);

  }



  100% {

    transform: translateY(5px);

  }

}



#popupDialog footer #checkoutBtn {

  font-size: 20px;

  display: flex;

  justify-content: space-around;

  padding: 5px 10px;

  background: #f08b18;

  box-shadow: 0 5px 0px #f08b18;

  cursor: pointer;

  transition: 0.5s;

  color: white;

  font-weight: bolder;

}



#popupDialog footer #checkoutBtn:hover {

  background: #c9700a;

}



.insideAboutUs {

  background: linear-gradient(180deg,

      rgba(0, 0, 0, 0.3),

      rgba(200, 255, 255, 0.3)),

    url(../images/about-us.png) no-repeat fixed bottom;

  padding-bottom: 30px;

  color: rgb(0, 0, 0) !important;

}



/* MARKETING CONTENT

-------------------------------------------------- */



/* Center align the text within the three columns below the carousel */

.marketing .col-lg-4 {

  margin-bottom: 1.5rem;

  text-align: center;

}



/* rtl:begin:ignore */

.marketing .col-lg-4 p {

  margin-right: 0.75rem;

  margin-left: 0.75rem;

}



/* rtl:end:ignore */



/* Featurettes

------------------------- */



.featurette-divider {

  margin: 5rem 0;

  /* Space out the Bootstrap <hr> more */

}



/* Thin out the marketing headings */

/* rtl:begin:remove */

.featurette-heading {

  letter-spacing: -0.05rem;

}



/* RESPONSIVE CSS

-------------------------------------------------- */



@media (min-width: 40em) {



  /* Bump up size of carousel content */

  .carousel-caption p {

    margin-bottom: 1.25rem;

    font-size: 1.25rem;

    line-height: 1.4;

  }



  .featurette-heading {

    font-size: 50px;

  }

}



@media (min-width: 62em) {

  .featurette-heading {

    margin-top: 7rem;

  }

}



.featurette-heading-new {

  /* font-family: -apple-system, BlinkMacSystemFont, "Segoe UI", Roboto,

    "Helvetica Neue", Arial, sans-serif, "Apple Color Emoji", "Segoe UI Emoji",

    "Segoe UI Symbol"; */

  font-size: 1.8rem;

  line-height: 1;

  letter-spacing: -0.05rem;

  color: #5a5a5a;

}



/*===== CONTACT BOX STYLE =====*/

.contact-box {

  /* padding-top: 70px; */

  padding-bottom: 90px;

  /* background-color: #f4f6f7; */

}



.single-contact-box {

  /* background-color: #f4f6f7; */

  background-image: linear-gradient(174.2deg,

      rgba(255, 244, 228, 1) 7.1%,

      rgba(240, 246, 238, 1) 67.4%);

  border-radius: 8px;

  padding: 24px 35px;

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);

}



@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .single-contact-box {

    padding: 24px 30px;

  }

}



@media (max-width: 767px) {

  .single-contact-box {

    padding: 24px 20px;

    margin-top: 18px;

  }

}



.single-contact-box .box-icon {

  position: relative;

  display: inline-block;

}



.single-contact-box .box-icon i {

  font-size: 88px;

  position: relative;

  z-index: 5;

  color: #0067f4;

}



.single-contact-box .box-icon .shape {

  position: absolute;

  top: 0;

  left: 0;

}



/* .single-contact-box .box-content {

  margin-top: 24px;

} */



.single-contact-box .box-content .box-title {

  font-size: 28px;

  line-height: 35px;

  color: #121212;

  padding-top: 16px;

}



.single-contact-box .box-content .text {

  font-size: 14px;

  line-height: 20px;

  color: #121212;

  margin-top: 12px;

}



/*===== CONTACT TWO STYLE =====*/

.contact-area-two {

  background-color: #f4f6f7;

}



.contact-two .contact-title {

  font-size: 20px;

  font-weight: 600;

  color: #121212;

}



.contact-two .text {

  font-size: 16px;

  line-height: 24px;

  margin-top: 8px;

  color: #6c6c6c;

}



.contact-two .contact-info {

  margin-top: 40px;

}



.contact-two .contact-info li {

  color: #6c6c6c;

  margin-top: 8px;

  font-size: 16px;

}



.contact-two .contact-info li i {

  margin-right: 5px;

  color: #121212;

}



/*===== CONTACT THREE STYLE =====*/

.contact-area-three {

  background-color: #f4f6f7;

}



.contact-area-three .contact-map .gmap_canvas iframe {

  width: 100%;

  height: 400px;

}



/*===== CONTACT FOUR STYLE =====*/

.contact-area-four {

  background-color: #f4f6f7;

  padding-top: 120px;

  padding-bottom: 120px;

}



.contact-map-four iframe {

  width: 100%;

  height: 550px;

}



@media (max-width: 767px) {

  .contact-map-four iframe {

    height: 350px;

  }

}



.contact-info-four .single-contact-info .contact-info-icon i {

  width: 50px;

  height: 50px;

  line-height: 50px;

  text-align: center;

  font-size: 24px;

  color: #fff;

  border-radius: 50%;

}



.contact-info-four .single-contact-info .contact-info-content {

  padding-left: 20px;

}



.contact-info-four .single-contact-info .contact-info-content .text {

  color: #121212;

}



.contact-info-four .single-contact-info.contact-color-1 .contact-info-icon i {

  background-color: #121212;

}



.contact-info-four .single-contact-info.contact-color-2 .contact-info-icon i {

  background-color: #fc3832;

}



.contact-info-four .single-contact-info.contact-color-3 .contact-info-icon i {

  background-color: #005ad5;

}



.contact-wrapper-form .contact-title {

  font-size: 32px;

  font-weight: 700;

  color: #000;

}



@media (max-width: 767px) {

  .contact-wrapper-form .contact-title {

    font-size: 26px;

  }

}



.contact-wrapper-form .contact-title i {

  color: #121212;

  margin-right: 8px;

}



.contact-wrapper-form .contact-title span {

  font-weight: 400;

}



/* Contact us ends here */



/* New Contact page starts here */

.container {

  max-width: 1320px;

}



.contact-area-three {

  background-color: #f4f6f7;

}



.pb-105 {

  padding-bottom: 105px;

}



.pt-25 {

  padding-top: 25px;

}



.mt-15 {

  margin-top: 15px;

}



.mt-40 {

  margin-top: 40px;

}



.container {

  max-width: 1320px;

}



.contact-area-three {

  background-color: #f4f6f7;

}



.pb-105 {

  padding-bottom: 105px;

}



.pt-25 {

  padding-top: 25px;

}



.mt-15 {

  margin-top: 15px;

}



.mt-40 {

  margin-top: 40px;

}



/* form part start here */

.form-input .input-items {

  position: relative;

}



.form-input label {

  font-size: 12px;

  line-height: 18px;

  color: #6c6c6c;

  margin-bottom: 8px;

  display: inline-block;

}



.form-input .input-items.default input,

.form-input .input-items.default textarea {

  border-color: #a4a4a4;

  color: #6c6c6c;

}



.form-input .input-items input,

.form-input .input-items textarea {

  width: 445px;

  border: 2px solid;

  padding-left: 44px !important;

}



.form-input .input-items.default input,

.form-input .input-items.default textarea {

  border-color: #a4a4a4;

  color: #6c6c6c;

}



.form-input .input-items input,

.form-input .input-items textarea {

  width: 445px;

  border: 2px solid;

  padding-left: 44px !important;

  padding: 4px 0px;

  /* padding-right: 12px; */

  position: relative;

  font-size: 16px;

  border-radius: 5px;

}



.form-input .input-items.default i {

  color: #6c6c6c;

}



.form-input .input-items i {

  position: absolute;

  top: 7px;

  left: 13px;

  font-size: 20px;

  z-index: 9;

}



/* Button part */

.standard-buttons .standard-two {

  color: #fff;

  background-color: #d50000;

  border-color: #d50000;

  border-radius: 5px;

}



.main-btn {

  display: inline-block;

  font-weight: 700;

  text-align: center;

  white-space: nowrap;

  vertical-align: middle;

  user-select: none;

  border: 2px solid transparent;

  padding: 0 30px;

  font-size: 14px;

  line-height: 45px;

  color: #0067f4;

  cursor: pointer;

  z-index: 5;

  transition: all 0.4s ease-out 0s;

  position: relative;

  text-transform: uppercase;

  margin-bottom: 18px;

}



.mt-20 {

  margin-top: 20px;

}



.main-btn:hover {

  background-color: white;

  color: #d50000;

}



.form-input .input-items textarea {

  padding: 10px 0px;

}



.margin {

  margin: 0px 40px;

}



.auto {

  max-width: 1300px;

}



.max-width {

  max-width: 1300px;

  height: 600px;

  border: 2px solid gray;

}



/* .flex-system{height: 300px; margin: 0 auto;} */

.flex-method {

  display: flex;

  justify-content: center;

  align-items: center;

}



.pd-height {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 100%;

}



.card-edit {

  width: 100%;

}



.box-shadow {

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);

}



.card-bg-color {

  background-color: #f4f6f7;

}



.edit-map {

  width: 100%;

  height: 355px;

  padding: 15px;

}



.e-title {

  margin-top: 19px;

}



.title-part,

h3 {

  text-transform: uppercase;

  text-align: center;

  padding-top: 15px;

}



.contact-area .section-title-2 .title {

  font-size: 30px;

  text-transform: uppercase;

  line-height: 55px;

  font-weight: 500;

  color: #000;

}



.margin {

  margin: 0px 40px;

}



.auto {

  max-width: 1300px;

}



.max-width {

  max-width: 1300px;

  height: 600px;

  border: 2px solid gray;

}



/* .flex-system{height: 300px; margin: 0 auto;} */

.flex-method {

  display: flex;

  justify-content: center;

  align-items: center;

}



.pd-height {

  display: flex;

  justify-content: center;

  align-items: center;

  width: 100%;

}



.card-edit {

  width: 100%;

}



.box-shadow {

  box-shadow: 0 1px 3px rgba(0, 0, 0, 0.12), 0 1px 2px rgba(0, 0, 0, 0.24);

}



.bg-color {

  background-color: #f4f6f7;

}



.edit-map {

  width: 100%;

  height: 355px;

  padding: 15px;

}



.e-title {

  margin-top: 19px;

}



.title-part,

h3 {

  text-transform: uppercase;

  text-align: center;

  padding-top: 15px;

}



.contact-area .section-title-2 .title {

  font-size: 30px;

  text-transform: uppercase;

  line-height: 55px;

  font-weight: 500;

  color: #000;

}



@media (max-width: 768px) {

  .contact-area .section-title-2 .title {

    font-size: 24px;

    line-height: 35px;

  }



  .form-input .input-items input,

  .form-input .input-items textarea {

    width: 100%;

  }



  .card-edit {

    width: 100%;

  }



  .padding-left-right0 {

    padding-left: 0;

    padding-right: 0;

  }

}



/* New Contact page ends here */



/* About part-01 starts here */



.aboutus-section {

  padding: 30px 0;

}



.aboutus-title {

  font-size: 30px;

  letter-spacing: 0;

  line-height: 32px;

  margin: 0 0 20px;

  padding: 0 0 11px;

  position: relative;

  text-transform: uppercase;

  color: #000;

}



.aboutus-title::after {

  background: #fdb801 none repeat scroll 0 0;

  bottom: 0;

  content: "";

  height: 2px;

  left: 0;

  position: absolute;

  width: 54px;

}



.aboutus-text {

  color: #606060;

  font-size: 13px;

  line-height: 22px;

  margin: 0 0 35px;

}



.aboutus-more {

  border: 1px solid #fdb801;

  border-radius: 25px;

  color: #fdb801;

  display: inline-block;

  font-size: 14px;

  font-weight: 700;

  letter-spacing: 0;

  padding: 7px 20px;

  text-transform: uppercase;

}



.feature .feature-box .iconset {

  background: #fff none repeat scroll 0 0;

  float: left;

  position: relative;

  width: 18%;

}



.feature .feature-box .iconset::after {

  background: #fdb801 none repeat scroll 0 0;

  content: "";

  height: 150%;

  left: 43%;

  position: absolute;

  top: 100%;

  width: 1px;

}



.feature .feature-box .feature-content h4 {

  color: #0f0f0f;

  font-size: 18px;

  letter-spacing: 0;

  line-height: 22px;

  margin: 0 0 5px;

}



.feature .feature-box .feature-content {

  float: left;

  padding-left: 28px;

  width: 78%;

}



.feature .feature-box .feature-content h4 {

  color: #0f0f0f;

  font-size: 18px;

  letter-spacing: 0;

  line-height: 22px;

  margin: 0 0 5px;

}



.feature .feature-box .feature-content p {

  color: #606060;

  font-size: 13px;

  line-height: 22px;

}



.icon {

  color: #f4b841;

  padding: 0px;

  font-size: 40px;

  border: 1px solid #fdb801;

  border-radius: 100px;

  color: #fdb801;

  font-size: 28px;

  height: 70px;

  line-height: 70px;

  text-align: center;

  width: 70px;

}



/* About part-01 ends here */



.body {

  font-weight: normal;

  font-style: normal;

  color: #121212;

}



img,

svg {

  vertical-align: middle;

  max-width: 100%;

}



.items-title h4 {

  font-size: 18px;

  line-height: 25px;

  color: #0f0f0f;



  letter-spacing: 0;

}



/*===== ABOUT THREE =====*/

.about-three {

  background-color: #f4f6f7;

  padding: 50px 0;

}



.about-feature-three .about-feature-image img {

  max-width: 100%;

}



.about-feature-three .about-feature-content {

  margin-top: 48px;

}



.about-feature-three .about-feature-content .feature-title {

  font-size: 30px;

  line-height: 55px;

  color: #000;

}



@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .about-feature-three .about-feature-content .feature-title {

    font-size: 38px;

    line-height: 45px;

  }

}



@media (max-width: 767px) {

  .about-feature-three .about-feature-content .feature-title {

    font-size: 30px;

    line-height: 35px;

  }

}



.feature-items-content .text {

  color: #606060;

  font-size: 13px;

  line-height: 22px;

  margin-top: 8px;

  text-align: justify;

}



@media only screen and (min-width: 992px) and (max-width: 1199px) {

  .about-feature-three .about-feature-content .text {

    font-size: 18px;

  }

}



@media (max-width: 767px) {

  .about-feature-three .about-feature-content .text {

    font-size: 18px;

  }

}



.about-feature-items-three .feature-items-icon {

  max-width: 120px;

  width: 100%;

}



@media (max-width: 767px) {

  .about-feature-items-three .feature-items-icon {

    max-width: 90px;

  }

}



@media only screen and (min-width: 576px) and (max-width: 767px) {

  .about-feature-items-three .feature-items-icon {

    max-width: 120px;

  }

}



.about-feature-items-three .feature-items-content {

  padding-left: 30px;

}



@media (max-width: 767px) {

  .about-feature-items-three .feature-items-content {

    padding-left: 0;

    padding-top: 25px;

  }

}



@media only screen and (min-width: 576px) and (max-width: 767px) {

  .about-feature-items-three .feature-items-content {

    padding-left: 30px;

    padding-top: 0;

  }

}



.about-feature-items-three .feature-items-content .items-title {

  font-size: 18px;

  line-height: 22px;

  color: #0f0f0f;

}



@media (max-width: 767px) {

  .about-feature-items-three .feature-items-content .items-title {

    font-size: 18px;

  }

}



.about-feature-items-three .feature-items-content .text {

  color: #606060;

  font-size: 13px;

  line-height: 24px;

  margin-top: 16px;

}



@media (max-width: 767px) {

  .about-feature-items-three .feature-items-content .text {

    font-size: 14px;

  }

}



/*===== ABOUT THREE ENDS HERE =====*/



/* Products page CSS Start  */



.title-with-line {

  font-size: 24px;

  /* Adjust the font size as needed */

  font-weight: bold;

  /* Adjust the font weight as needed */

  position: relative;

  display: inline-block;

  /* padding-bottom:8px; */

  margin-bottom: 10px;

  text-align: left;

}



.title-with-line::after {

  /* content: '';

  display: block;

  width: 100%;

  height: 2px; 

  background-color: #007bff; 

  position: absolute;

  bottom: -5px; 

  left: 0; */

}



.project-box {

  margin: 50px 0;

  background-image: linear-gradient(to top, #1e3c72 0%, #1e3c72 1%, #2a5298 100%);

  /* padding: 50px 20px; */

  color: white !important;

  transition: all 0.6s ease-in-out;

  box-shadow: rgba(0, 0, 0, 0.05) 0px 6px 24px 0px, rgba(0, 0, 0, 0.08) 0px 0px 0px 1px;

}



.project-box:hover {

  background-image: linear-gradient(-20deg, #2b5876 0%, #4e4376 100%);

  transition: all 0.3s ease-out;

}



.project-box a {

  background: hsla(0, 0%, 100%, .16);

  color: white !important;

  border-bottom: 2px solid white;

}



.project-box a:hover {

  border-bottom: 2px solid rgb(243, 239, 22);

}



.img-section {

  margin: 0;

  padding: 0;

  display: flex;

  justify-content: center;

  align-items: center;

  overflow: hidden;

}



.box-2 .img-section img {

  margin-bottom: -120px;

  margin-right: -235px;

  width: 100%;

  padding-top: 50px;

}



.box-1 .img-section img {

  margin-bottom: -120px;

  margin-left: -235px;

  width: 100%;

  padding-top: 50px;

}



.box-1:hover .img-section img,

.box-2:hover .img-section img {

  transition: 0.3s all ease-in-out;

  box-shadow: rgba(99, 99, 99, 0.2) 0px 2px 8px 0px;

  transform: scale(1.01);

}



.product-content {

  padding: 30px;

  font-size: 18px;


}



hr {

  border: 2px dotted black;

}





.product-content a {

  text-decoration: none;

}



.product-content button:hover {

  border-bottom: 2px solid #db3637;

}



@media only screen and (max-width: 768px) {

  .product {

    padding: 25px 5px;

    width: 100%;

    margin: 15px auto;

  }



  .project-box {

    margin: 25px 5px;

    display: flex;

    flex-direction: column-reverse !important;

    overflow: hidden;

  }



  .product-content {

    padding: 5px 6px;

    margin: 10px auto;

  }



  .box-2 {

    display: flex;

    flex-direction: column !important;

  }



  .box-2 .img-section img {

    margin: 10px 2px;

    width: 100%;

    margin-bottom: -50px;

    margin-right: -160px;

    transform: scale(1.25);

  }



  .box-1 .img-section img {

    margin: 10px 2px;

    width: 100%;

    margin-bottom: -50px;

    margin-left: -160px;

    transform: scale(1.25);

  }

}



.product-details-section {

  max-width: 1320px;

  margin: 0 auto;

}


/* Pricing Plan CSS Start */

.plan {
  border-radius: 16px;
  box-shadow: rgba(0, 0, 0, 0.08) 0px 4px 12px;
  padding: 15px;
  background-color: #fff;
  color: #697e91;
  max-width: 380px;
  border: 1px solid rgb(235, 235, 235);
  transition: all 0.4s ease-out;
}

.plan:hover {
  transition: all 0.1s ease-in;
  /*transform: scale(1.05);*/
  box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;
}

.plan strong {
  font-weight: 600;
  color: #2f394e;
}

.plan .text-secondary {
  font-weight: 300 !important;
  color: #acacac !important;
}

.plan .inner {
  align-items: center;
  padding: 20px;
  padding-top: 40px;
  background-color: #fff5f39e;
  border-radius: 12px;
  position: relative;
}

.plan .pricing {
  position: absolute;
  top: 0;
  right: 0;
  background-color: #ed3106;
  border-radius: 99em 0 0 99em;
  display: flex;
  align-items: center;
  padding: 0.625em 0.75em;
  font-size: 1.10rem;
  font-weight: 600;
  color: #fff;
}

.plan .pricing small {
  color: #fff;
  font-size: 0.75em;
  margin-left: 0.25em;
}

.plan .title {
  font-weight: 700;
  font-size: 1.50rem;
  color: #425675;
  margin-top: 10px;
  margin-bottom: 0;
}

.plan .title+* {
  margin-top: 0.50rem;
}

.plan .info+* {
  margin-top: 0.2rem;
}

.plan .info {
  font-size: 15px;
  /* line-height: normal; */
  color: dimgrey;
}

.plan .features {
  display: flex;
  flex-direction: column;
  padding: 5px;
}

.plan .features li {
  display: flex;
  align-items: flex-start;
  gap: 0.5rem;
  font-size: 14px;
  color: dimgrey;
  ;
}

.plan .features li+* {
  margin-top: 0.25rem;
}

.plan .features .icon i {
  font-size: 14px;
}


.plan .features+* {
  margin-top: 1.25rem;
}



/* Pricing Plan CSS End  */



/*POS Testimonials Start*/

.media-29101 {
  text-align: center;
  background-color: aliceblue;
  padding: 20px;
  border-radius: 25px;
}

.media-29101 img {
  margin-bottom: 20px;
  border-radius: 50%;
  width: 80px !important;
  margin: 0 auto 40px auto;
}

.media-29101 h3 {
  font-size: 16px;
  font-weight: 700 !important;
  color: #6c757d;
  padding-top: 5px;
  text-transform: capitalize;
}

.media-29101 i {
  color: rgb(110 110 110);
}

.media-29101 .ratings {
  color: rgb(230, 195, 43);
  font-size: 12px;
}

.media-29101 p {
  font-size: 13px;
  font-style: italic;
  color: rgb(83, 83, 83);
}

.owl-2-style .owl-nav {
  display: none;
}

.owl-2-style .owl-dots {
  text-align: center;
  position: relative;
  bottom: -30px;
}

.owl-2-style .owl-dots .owl-dot {
  display: inline-block;
}

.owl-2-style .owl-dots .owl-dot span {
  display: inline-block;
  width: 10px;
  height: 10px;
  border-radius: 0px;
  background: #cccccc;
  -webkit-transition: 0.3s all cubic-bezier(0.32, 0.71, 0.53, 0.53);
  -o-transition: 0.3s all cubic-bezier(0.32, 0.71, 0.53, 0.53);
  transition: 0.3s all cubic-bezier(0.32, 0.71, 0.53, 0.53);
  margin: 3px;
  border-radius: 50%;
}

.owl-2-style .owl-dots .owl-dot.active span {
  background: #ff3c00;
}

.owl-2-style .owl-dots .owl-dot:active,
.owl-2-style .owl-dots .owl-dot:focus {
  outline: none;
}


/*POS Testimonials End*/





















a:hover,
a:focus {

  text-decoration: none;

  outline: none;

}

#accordion .panel {

  border: none;

  border-radius: 0;

  box-shadow: none;

  margin-bottom: 15px;

  position: relative;

}

#accordion .panel:before {

  content: "";

  display: block;

  width: 1px;

  height: 100%;

  border: 1px dashed #6e8898;

  position: absolute;

  top: 25px;

  left: 18px;

}

#accordion .panel:last-child:before {
  display: none;
}

#accordion .panel-heading {

  padding: 0;

  border: none;

  border-radius: 0;

  position: relative;

}

#accordion .panel-title a {

  display: block;

  padding: 10px 30px 10px 60px;

  margin: 0;

  font-size: 18px;

  font-weight: 700;

  letter-spacing: 1px;

  color: #1d3557;

  border-radius: 0;

  position: relative;

  background: #ffffff88;

  backdrop-filter: blur(10px);

  -webkit-backdrop-filter: blur(10px);

  border: 1px solid rgba(255, 255, 255, 0.18);

}

#accordion .panel-title a:before,

#accordion .panel-title a.collapsed:before {

  content: "\f107";

  font-family: "Font Awesome 5 Free";

  font-weight: 900;

  width: 40px;

  height: 100%;

  line-height: 40px;

  /*background: #8a8ac3;*/

  background: #ed3106;

  /*border: 1px solid #8a8ac3;*/

  font-size: 17px;

  color: #fff;

  text-align: center;

  position: absolute;

  top: 0;

  left: 0;

  transition: all 0.3s ease 0s;

}

#accordion .panel-title a.collapsed:before {

  content: "\f105";

  background: #fff;

  border: 1px solid #6e8898;

  color: #000;

  transition: all 0.4s ease-in-out;

}

#accordion .panel-body {

  padding: 10px 30px 10px 30px;

  margin-left: 40px;

  border-top: none;

  font-size: 15px;

  color: #6f6f6f;

  line-height: 28px;

  letter-spacing: 1px;

  background: #ffffff88;

  backdrop-filter: blur(10px);

  -webkit-backdrop-filter: blur(10px);

  border: 1px solid rgba(255, 255, 255, 0.18);

}



#accordion .panel-collapse {

  transition: height 0.3s ease-in-out;

}

#coverage-accordion button {

  /* background-color: #ffffff8c; */

}

.accordion-button:focus {

  box-shadow: none !important;

  color: #ff9a44;

  /* background-image: linear-gradient(to top, #dfe9f34d 0%, rgba(255, 255, 255, 0.363) 100%); */

}

.accordion-button:not(:focus) {

  /* background-image: linear-gradient(to top, #dfe9f34d 0%, rgba(255, 255, 255, 0.363) 100%); */

  color: #000;

  box-shadow: none;

}

.city {

  background: rgba(255, 255, 255, 0.5);

  backdrop-filter: blur(6.5px);

  -webkit-backdrop-filter: blur(6.5px);

  border: 1px solid rgba(255, 255, 255, 0.18);

}

.accordion-parent {

  /* background-color: ghostwhite !important; */

  background-color: #ffffff27;

}

.accordion-item {

  background-color: transparent !important;



  background: rgba(255, 255, 255, 0.65);

  backdrop-filter: blur(2px);

  -webkit-backdrop-filter: blur(2px);

}

.accordion-button {

  background-color: transparent !important;

}

.accordion-item:first-of-type {

  border-radius: 0 !important;

}

.accordion-item:last-of-type {

  border-radius: 0 !important;

}



.pos-type {

  background-color: yellowgreen;

  box-shadow: rgba(0, 0, 0, 0.1) 0px 20px 25px -5px, rgba(0, 0, 0, 0.04) 0px 10px 10px -5px;

}

.pos-type a {

  text-decoration: none;

  letter-spacing: 1px;

  text-shadow: -1px -1px 1px #ffffff33,

    1px 1px 1px #0000007a;

}

.pos-type img {

  filter: drop-shadow(2px 2px 2px #5f5f5faf);

}







ul.timeline {

  list-style-type: none;

  position: relative;

}

ul.timeline:before {

  content: ' ';

  background: #d4d9df;

  display: inline-block;

  position: absolute;

  left: 26px;

  width: 2px;

  height: 100%;

  z-index: 400;

}

ul.timeline>li {

  margin: 20px 0;

  padding-left: 20px;

}

ul.timeline>li:before {

  content: ' ';

  background: white;

  display: inline-block;

  position: absolute;

  border-radius: 50%;

  border: 3px solid #ff9a44;

  left: 15px;

  width: 25px;

  height: 25px;

  z-index: 400;

}



.text-animate {

  font-weight: 800;

  background-image: linear-gradient(-225deg, #ff7e5f 0%, #feb47b 29%, #86a8e7 67%, #91eae4 100%);

  background-size: 200% auto;

  color: #86a8e7;

  background-clip: text;

  -webkit-background-clip: text;

  -webkit-text-fill-color: transparent;

  animation: textmishad 6s linear infinite;

  display: inline-block;

}



@keyframes textmishad {

  to {

    background-position: 200% center;

  }

}













.div-animate {

  -webkit-animation: color-change-5x 8s linear infinite alternate both;

  animation: color-change-5x 8s linear infinite alternate both;

}





@-webkit-keyframes color-change-5x {

  0% {

    background: ghostwhite;

  }

  25% {

    background: #f8f4ffa4;

  }

  50% {

    background: rgba(255, 251, 245, 0.623);

  }

  75% {

    background: #fff4f5a9;

  }

  100% {

    background: rgba(255, 249, 239, 0.582);

  }

}

@keyframes color-change-5x {

  0% {

    background: ghostwhite;

  }

  25% {

    background: #f8f4ffa4;

  }

  50% {

    background: rgba(255, 251, 245, 0.623);

  }

  75% {

    background: #fff4f5a9;

  }

  100% {

    background: rgba(255, 249, 239, 0.582);

  }

}



























/* lined tabs */





.nav-tabs .nav-link {

  border-radius: 0 !important;

}

.nav-pills .nav-link.active,
.nav-pills .show>.nav-link {

  /* background-color: #ed3106; */

  background-color: #ff9a44;

  color: white !important;

  transition: all 0.3s ease-in-out !important;

  box-shadow: 0px 9px 30px rgba(255, 149, 5, 0.3);

}

#myTab .nav-link {

  color: #000000;

}

#myTab .nav-item {

  background-color: ghostwhite;

  /* background-image: linear-gradient(to top, #dfe9f3 0%, white 100%); */



}

.fade {

  transition: opacity 0.25s ease-in-out !important;

}











.pos-features .choose-us-box {

  /*min-height: 340px;*/

}

.pos-features p {
  font-size: 14px;
}

.choose-us-box:hover {
  background-color: #FAF6FD !important;
}


/* IT-Service Page Start Here  */

.service-section {

  max-width: 1320px;

  margin: 0 auto;

}



.service-row {

  border-radius: 20px;

  display: flex;

  align-items: center;

  justify-content: center;

  margin: 0 auto;

  border: 1px solid #ebebeb;

}



.service-imgshape {

  display: flex;

  justify-content: center;

  align-items: center;

  text-align: center;

}



.service-content {

  padding: 20px;

  border-radius: 30px;

}



.content-text {

  padding: 20px;

}



.content-text button,

.product_btn {

  padding: 5px 10px;

  border: 1px solid rgb(226, 226, 226);

  border-bottom: 2px solid black;

  background-color: white;

  font-size: 14px;

  margin-top: 15px;

}



.content-text button:hover {

  border-bottom: 2px solid #db3637;

}



.content-text button a {

  text-decoration: none;

  color: black;

}



.product_btn:hover {

  border-bottom: 2px solid #db3637;

}



.content-text h3 {

  font-size: 20px;

  background-color: white;

  display: inline-block;

  padding: 10px 18px;

  color: black;

  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

  border-bottom: 2px solid black;

}



@media only screen and (max-width: 600px) {

  .service-row {

    display: flex;

    flex-direction: column;

    align-items: center;

  }



  .service-box-2 {

    display: flex;

    flex-direction: column-reverse;

  }



  .service-imgshape img {

    width: 100%;

  }



  .service-content {

    margin-top: 0;

    padding: 5px;

  }



  .content-text {

    padding: 5px;

  }



  .content-text h3 {

    font-size: 20px;

  }



  .content-text p {

    text-align: justify;

    padding: 15px 5px;

  }

}



/* IT-Service Page End Here  */



/* IT Service Details Start here */



/*.service-details-section {*/

/*  max-width: 1320px;*/

/*  margin: 0 auto;*/

/*  padding: 50px;*/

/*  border-radius: 30px;*/

/*}*/



.service-details-imgshape {

  display: flex;

  justify-content: center;

  align-items: center;

  text-align: center;

}



.details-content-text {

  /* padding: 40px; */

}



.details-content-text button {

  border-radius: 0px 13px;

  padding: 5px 15px;

  border: 0;

  text-transform: uppercase;

  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

  border-bottom: 2px solid black;

  background-color: white;

  font-size: 12px;

  margin: 8px 0;

}



.details-content-text button a {

  text-decoration: none;

  color: black;

}



.details-content-text button:hover {

  border-bottom: 2px solid #db3637;

}



.details-content-text h3 {

  font-size: 25px;

  text-transform: uppercase;

  background-color: white;

  display: inline-block;

  padding: 10px 18px;

  border-radius: 0px 20px;

  color: black;

  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;

  border-bottom: 2px solid black;

}



.details-content-text p {

  text-align: justify;

  font-size: 15px;

}



@media only screen and (max-width: 600px) {

  ervice-details-imgshape img {

    min-height: 0;

    width: 100%;

    border-radius: 20px;

  }



  .service-details-content {

    margin-top: 0;

    padding: 1px;

    padding-top: 10px;

    border-radius: 30px;

  }



  .details-content-text {

    /* padding: 25px 10px; */

  }



  .details-content-text h3 {

    font-size: 18px;

  }



  .service-details-section {

    margin: 30px 1px;

    padding: 12px 0;

  }

}



/* IT service details end here  */



/* About section first part start here  */



.aboutUs-section {

  margin: 50px auto;

  max-width: 1320px;

}



.about-us {

  display: flex;

  justify-content: center;

  align-items: center;

}



.about-content {

  padding: 30px;

  /* min-width: 380px;

  min-height: 480px; */

  border-radius: 15px;

}



.about-content .content-box {

  padding: 15px;

  display: flex;

  justify-content: center;

  align-items: center;

}



.about-content p {

  text-align: justify;

}



.about-us img {

  width: 100%;

}



.content-box span {

  font-weight: bold;

  font-size: 38px;

  color: #db3637;

}



.our-strength {

  display: flex;

  justify-content: center;

  align-items: center;

  margin: 5px;

}



.strength-card {

  padding: 35px;

  margin: 10px;

  box-shadow: rgba(0, 0, 0, 0.15) 0px 15px 25px,

    rgba(0, 0, 0, 0.05) 0px 5px 10px;

  border-radius: 15px;

  display: flex;

  justify-content: center;

  height: 350px;

  width: 360px;

  transition: 0.5s;

}



.strength-card:hover {

  transform: translateY(-50px);

  box-shadow: 0 10px 40px rgba(0, 0, 0, 0.2);

  background-color: rgb(246, 250, 250);

}



.strength-card-content {

  text-align: center;

}



.strength-card-content p {

  color: #777;

  padding: 20px 0;

}



.strength-card-content i {

  font-size: 22px;

  text-align: center;

  margin-bottom: 15px;

  padding: 9px;

  border-radius: 50%;

  color: #db3637;

  box-shadow: inset 5px 5px 5px rgba(0, 0, 0, 0.05),

    inset -5px -5px 5px rgba(255, 255, 255, 0.5),

    5px 5px 5px rgba(0, 0, 0, 0.05), -5px -5px 5px rgba(255, 255, 255, 0.5);

}



.strength-card-content h3 {

  font-weight: bolder;

  font-size: 24px;

  color: #db3637;

  text-transform: capitalize;

}



.small-text {

  font-size: 14px;

  text-align: center;

}



@media only screen and (max-width: 600px) {

  .aboutUs-section {

    margin: 25px 20px;

  }



  .about-us {

    flex-direction: column;

  }



  .about-content {

    font-size: 14px;

    padding: 5px;

  }



  .our-strength {

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

    margin: 5px;

  }



  .strength-card {

    font-size: 14px;

  }

}



/* About section first part end  */



/* Testimonial page start */



.testimonial-card {

  position: relative;

  padding: 15px;

  border: 0;

  border-radius: 25px;

  background: linear-gradient(145deg, #ffffff, #fbfbfb);

  border: 2px solid rgb(246, 243, 243);

  min-height: 200px;

}



.testimonial-card:hover {

  background: linear-gradient(145deg, #ffffff, #efefef);

  transition: all 0.8s ease-in-out;

}



.testimonial-card footer {

  position: absolute;

  bottom: 5px;

  right: 20px;

  display: flex;

  flex-direction: column;

  justify-content: end;

  text-align: right;

  padding: 8px 0;

  font-size: 50px;

}



@media only screen and (max-width: 600px) {

  .testimonial-card .card-body footer h5 {

    font-size: 15px;

  }



  .m-section-title {

    font-size: 25px !important;

  }

}



/* Our Team section start  */

.aboutpage-title h2 {

  font-size: 30px;

  font-weight: bold;

  text-shadow: 2px 2px rgb(32 29 29 / 40%);

}



.aboutpage-content p {

  font-size: 20px;

  text-align: justify;

  padding-top: 15px;

}



.about-text {

  width: 100%;

  margin: 0 auto;

  padding: 20px;

}



.about-text p {

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

  font-size: 18px;

  text-align: justify;

  padding: 15px 0;

}



.bold-text span {

  font-size: 30px !important;

  font-weight: bold;

  color: #f4836a !important;

}



@media only screen and (max-width: 768px) {

  .about-text p {

    padding: 0;

    margin: 0;

  }



  .about-text {

    padding: 8px 0;

    margin-bottom: 20px;

  }

}



.our-team-section {

  max-width: 1320px;

  margin: 0 auto;

}



:root {

  --clr: #fff;

  --clr2: #f4836a;

}



.md-sir-section {

  position: relative;

  min-height: 500px;

  width: 90%;

  margin: 115px auto;

  border-radius: 30px;

  background-image: url(../images/kamruzzaman_cover.png);

  background-size: cover;

  object-fit: cover;

}



.profile-card-md {

  margin-top: 5px;

  font-size: 0.9em;

  font-weight: bold;

  color: #f4836a;

}



.md-sir-section .box {

  position: absolute;

  padding: 30px;

  bottom: -22%;

  left: 25%;

  border-radius: 20px;

  width: 50%;

  box-shadow: 0 1px 2px 0 rgba(0, 0, 0, 0.1);

  background-color: #ffffff;

}



.md-sir-section .box:hover {

  transition: all 0.3s ease-in;

  box-shadow: 0 10px 20px 0 rgba(95, 26, 137, 0.4);

}



.md-sir-section .box .box-content {

  display: flex;

  align-items: center;

}



.md-sir-section .box .box-content .hr {

  width: 20%;

  height: 3px;

  background-color: var(--clr2);

  border: 1px solid var(--clr2) !important;

  border-radius: 30px;

  margin: 10px 0;

}



.md-sir-section .box img {

  display: flex;

  justify-content: end;

  width: 80%;

  border-radius: 10px;

  border: 1px solid rgb(242, 242, 242);

}



.md-sir-section .img-div {

  width: 30%;

}



.md-sir-section .bio {

  width: 70%;

}



.md-sir-section .bio h1 {

  text-transform: uppercase;

  font-weight: bolder;

  letter-spacing: 0.1em;

  font-size: 1.5em;

}



.md-sir-section .bio .name {

  font-size: 1em;

  text-transform: uppercase;

  font-weight: bolder;

  letter-spacing: 0.1em;

  color: #f4836a;

}



.team-section {

  width: 100%;

  display: flex;

  flex-wrap: wrap;

  justify-content: space-evenly;

  max-width: 1320px;

  margin: 0 auto;

}



.cto {

  margin: 30px auto;

  border: 1px solid rgb(229, 225, 225);

  border-radius: 20px;

}



.manager-section-title {

  /* font-weight: bolder; */

  display: flex;

  justify-content: center;

  align-items: center;

  font-size: 1.7em;

  width: 40%;

  /* letter-spacing: 0.1em; */

  /* text-transform: uppercase; */

}



.manager-section-title .hr {

  border: 3px solid #f4836a;

  border-radius: 50px;

  margin-top: 30px;

  width: 30%;

}



.our-team {

  text-align: center;

  font-size: 3.5em;

  text-transform: uppercase;

  letter-spacing: 0.3em;

}



.profile-card {

  position: relative;

  width: 260px;

  height: 430px;

  margin: 50px;

  display: flex;

  flex-direction: column;

  justify-content: space-between;

  border: 0;

}



.profile-card .box {

  position: relative;

  width: 110%;

  height: 200px;

  border-radius: 15px;

}



.profile-card .box:nth-child(1)::before {

  content: "";

  position: absolute;

  top: 105px;

  left: -1px;

  width: 20px;

  height: 20px;

  background: transparent;

  z-index: 10;

  border-bottom-left-radius: 20px;

  box-shadow: -6px 6px var(--clr);

}



.profile-card .box:nth-child(1)::after {

  content: "";

  position: absolute;

  bottom: 0;

  left: 105px;

  width: 20px;

  height: 20px;

  background: transparent;

  z-index: 10;

  border-bottom-left-radius: 20px;

  box-shadow: -6px 6px var(--clr);

}



.profile-card .box:nth-child(2) {

  background: #fff;

  height: 220px;

  width: 100%;

}



.profile-card .box:nth-child(2)::before {

  content: "";

  position: absolute;

  bottom: 106px;

  left: -1px;

  width: 20px;

  height: 20px;

  background: transparent;

  z-index: 10;

  border-top-left-radius: 20px;

  box-shadow: -6px -6px var(--clr);

}



.profile-card .box:nth-child(2)::after {

  content: "";

  position: absolute;

  top: -1px;

  left: 109px;

  width: 20px;

  height: 20px;

  background: transparent;

  z-index: 10;

  border-top-left-radius: 20px;

  box-shadow: -6px -6px var(--clr);

}



.profile-card .circle {

  position: absolute;

  top: 50%;

  left: -70px;

  transform: translateY(-50%);

  width: 180px;

  height: 180px;

  border-radius: 50%;

  border: 10px solid var(--clr);

}



.profile-card .circle .imgBox {

  position: absolute;

  inset: 0;

  overflow: hidden;

  border-radius: 50%;

}



.profile-card .circle .imgBox img,

.profile-card .box .imgBox img {

  width: 100%;

  height: 100%;

  object-fit: cover;

}



.profile-card .box .imgBox {

  position: absolute;

  inset: 0;

  overflow: hidden;

  border-radius: 15px;

}



.profile-card .box .content {

  position: absolute;

  inset: 0;

  padding: 20px 10px 10px;

  display: flex;

  flex-direction: column;

  align-items: center;

  gap: 18px;

}



.profile-card .box .content .profile-card-title {

  text-align: right;

}



.profile-card .box .content h4 {

  padding-top: 20px;

  padding-left: 90px;

  width: 100%;

  text-transform: uppercase;

  font-size: 1.2em;

  letter-spacing: 0.1em;

}



.profile-card .box .content .profile-card-title hr {

  margin: 10px auto;

  border: 1px solid rgb(237, 236, 236);

}



.profile-card .box .content p {

  width: 100%;

  padding-left: 0px;

  margin-top: 10px;

  text-transform: uppercase;

  font-size: 0.9em;

  letter-spacing: 0.1em;

  font-weight: bold;

  color: #f4836a;

}



.team-section .profile-card .box2 {

  border: 2px solid #f4836a;

  border-radius: 20px;

}



@media only screen and (max-width: 600px) {

  .team-section {

    width: 100%;

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

  }



  .manager-section-title {

    width: 80%;

    font-size: 1.2em;

    margin: 20px auto;

    padding: 0;

  }



  .our-team {

    font-size: 2.5em;

  }



  .md-sir-section {

    background-position: center center;

  }



  .md-sir-section {

    width: 100%;

    margin: 0;

    padding: 0;

    border: 0;

    border-radius: 0;

  }



  .md-sir-section .box {

    left: 5%;

    padding: 10px;

    bottom: -16%;

    width: 90%;

  }



  .md-sir-section .bio h1 {

    font-size: 1.1em;

  }



  .md-sir-section .bio .name {

    font-size: 0.9em;

  }



  .cto {

    margin: 120px auto;

  }



  .aboutpage-title h2 {

    font-size: 20px;

  }



  .aboutpage-content p {

    /* font-size: 17px; */

  }



  .our-service-block {

    /* padding: 50px 0; */

    margin-top: 100px;

    display: flex;

    flex-direction: column;

  }

}



/* Our Team section end  */



.banner1 {

  background-image: url(../../assets/images/banner1.png);



  background-size: cover;

  background-repeat: no-repeat;

  /* overflow: hidden; */

  /* object-fit: cover; */

  width: 100%;

  /* min-height: 85vh; */

  /* filter: grayscale(1); */

  /* mix-blend-mode: difference; */

}



.banner2 {

  background-image: url(../../assets/images/banner2.png);

  background-size: cover;

  background-repeat: no-repeat;

  /* overflow: hidden;

  object-fit: cover; */

  width: 100%;

}



.banner3 {

  background-image: url(../../assets/images/banner3.png);

  background-size: cover;

  background-repeat: no-repeat;

  /* overflow: hidden;

  object-fit: cover; */

  width: 100%;

}







/*================== Service Area Start ======================*/

/* @charset "UTF-8"; */



.service-container {

  max-width: 100% !important;

  margin: 0 auto;

  background-image: url(../images/sr-bg-5-1.jpg);

  background-position: center center;

  background-repeat: no-repeat;

  background-size: cover;

}



@media (min-width: 768px) {

  .service-row-home .col-md-3 {

    flex: 0 0 auto;

    width: 23% !important;

  }

}



@media (max-width: 768px) {

  .service-row-home .col-md-3 {

    flex: 0 0 auto;

    width: 100% !important;

  }

}



.service-title a {

  color: #000000;

  text-decoration: none;

  outline: 0;

  transition: all ease 0.4s;

}



.service-title a:hover {

  color: #1A1A1A;

  ;

}



.service-title a:active,

.service-title a:focus,

.service-title a:hover,

.service-title a:visited {

  text-decoration: none;

  outline: 0;

}



.service-row-home .h1,

.service-row-home h1,

.service-row-home .h2,

.service-row-home h2,

.service-row-home .h3,

.service-row-home h3,

.service-row-home .h4,

.service-row-home h4,

.service-row-home .h5,

.service-row-home h5,

.service-row-home .h6,

.service-row-home h6 {

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

  color: #1A1A1A;

  ;

  text-transform: none;

  font-weight: 700;

  line-height: 1.5;

  margin: 0 0 15px 0;

}



.service-row-home .h1,

h1 {

  font-size: 48px;

}



.service-row-home .h2,

h2 {

  font-size: 40px;

}



.service-row-home .h3,

h3 {

  font-size: 30px;

}



.service-row-home .h4,

h4 {

  font-size: 30px;

}



.service-row-home .h5,

h5 {

  font-size: 24px;

}



.service-row-home .h6,

h6 {

  font-size: 20px;

}



.font-family {

  font-family: "Exo", sans-serif !important;

}



/* Large devices */

@media (max-width: 1199px) {



  .service-row-home .h1,

  .service-row-home h1 {

    font-size: 40px;

  }



  .service-row-home .h2,

  .service-row-home h2 {

    font-size: 36px;

  }



  .service-row-home .h3,

  .service-row-home h3 {

    font-size: 30px;

  }



  .service-row-home .h4,

  .service-row-home h4 {

    font-size: 24px;

  }



  .service-row-home .h5,

  .service-row-home h5 {

    font-size: 20px;

  }



  .service-row-home .h6,

  .service-row-home h6 {

    font-size: 16px;

  }

}



/* Small devices */

@media (max-width: 767px) {



  .service-row-home .h1,

  .service-row-home h1 {

    font-size: 36px;

  }



  .service-row-home .h2,

  .service-row-home h2 {

    font-size: 30px;

  }



  .service-row-home .h3,

  .service-row-home h3 {

    font-size: 26px;

  }



  .service-row-home .h4,

  .service-row-home h4 {

    font-size: 22px;

  }



  .service-row-home .h5,

  .service-row-home h5 {

    font-size: 18px;

  }



  .service-row-home .h6,

  .service-row-home h6 {

    font-size: 16px;

  }

}



.text-inherit,

.footer-layout5 .copyright-text a,

.footer-info-list .info a {

  color: inherit;

}



.text-inherit:hover,

.footer-layout5 .copyright-text a:hover,

.footer-info-list .info a:hover {

  color: #0E5AF2;

}



.service-style6 {

  background-color: #ffffff;

  /* padding: 15px 45px 45px 45px; */

  padding: 20px;

  margin-bottom: 30px;

  border-radius: 13px;

  box-shadow: 1.5px 2.598px 16.74px 1.26px rgba(200, 200, 200, 0.1);

  position: relative;

  transition: all ease 0.4s;

  border-bottom: 3px solid transparent;

}



.service-style6 .service-icon {

  /* margin: 0 0 55px 0; */

}



.service-style6 .service-title {

  font-size: 16px;

  font-weight: 600;

  /* max-width: 200px; */

  margin: 0;

  text-transform: uppercase;

}



.service-style6:hover {

  border-color: #0E5AF2;

}



/* Medium Large devices */

@media (max-width: 1399px) {

  .service-style6 {

    padding: 30px 30px 20px 30px;

  }



  .service-style6 .service-icon {

    margin: 0 0 30px 0;

  }



  .service-style6 .service-title {

    font-size: 16px;

  }

}





/* =============== header ================= */

.service-section {

  margin-top: 0px;

  /* margin-top: 50px; */

  margin-bottom: 30px;

  font-family: "Exo", sans-serif !important;

  display: flex;

  margin-right: auto;

  margin-left: auto;

  position: relative;

}



.service-element {

  width: 100%;

}



.sec-subtitle5 {

  font-size: 16px;

  font-weight: 600;

  color: #000000;

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

  display: block;

  text-transform: uppercase;

  margin: -0.2em 0 15px 0;

}



.sec-title5 {

  font-size: 42px;

  font-weight: 700;

  line-height: 62.4px;

  margin: -0.2em 0 26px 0;

  display: block;

  font-family: "Exo", sans-serif !important;

}



.elementor-widget {

  position: relative;

  display: flex;

  justify-content: space-between;

  width: 100%;

  flex-wrap: wrap;

  align-content: flex-start;

  padding: 0px 15px 0px 15px;

  align-content: flex-end;

  align-items: flex-end;

}



.elementor-widget-button {

  margin-right: 30px;

  /* align-items: flex-end; */

}





.vs-btn {

  font-size: 14px;

  text-transform: uppercase;

  padding: 19px 42px 19px 42px;

}



a:active,

a:focus,

a:hover,

a:visited {

  text-decoration: none;

  outline: 0;

}



.elementor a {

  box-shadow: none;

  text-decoration: none;

}



.vs-btn {

  position: relative;

  display: inline-block;

  border: none;

  text-transform: uppercase;

  text-align: center;

  background-color: #dc3545;

  color: #ffffff;

  font-family: "Fira Sans", sans-serif;

  font-size: 15px;

  font-weight: 500;

  line-height: 1;

  padding: 19px 30.5px;

  border-radius: 5px;

  z-index: 1;

  overflow: hidden;

}



.vs-service a {

  color: #ffffff;

  text-decoration: none;

  font-weight: 600;

  outline: 0;

  transition: all ease 0.4s;

}



.vs-service :after,

:before {

  box-sizing: border-box;

}



user agent stylesheet .vs-service a:-webkit-any-link {

  color: -webkit-link;

  cursor: pointer;

  text-decoration: underline;

}



.fa-phone-alt:before {

  content: "\f879";

}



.header-info_label {

  font-size: 14px;

  color: #55595d;

  display: block;

  margin-bottom: 2px;

}



.d-flex {

  position: relative !important;

  display: flex !important;

  /* justify-content: space-between; */

  /* width: 100%; */

  /* flex-wrap: wrap; */

  align-content: flex-start;

  padding: 0px 35px 0px 15px;

  /* align-content: flex-end; */

  /* align-items: flex-start; */

}



.header-info_icon {

  color: #DC3545;

  font-size: 24px;

  margin-right: 20px;

}



.header-info_link {

  color: #1A1A1A;

  font-size: 16px;

  font-weight: 600;

  margin: 0;

}



.header-info_link a {

  color: inherit;

}



















.about-us-sec a {

  color: #ffffff;

  text-decoration: none;

  font-weight: 600;

  outline: 0;

  transition: all ease 0.4s;

}



.about-us-sec a:hover {

  color: #ffffff;

}



.about-us-sec a:active,

.about-us-sec a:focus,

.about-us-sec a:hover,

.about-us-sec a:visited {

  text-decoration: none;

  outline: 0;

}





.about-us-sec .h1,

.about-us-sec h1,

.about-us-sec .h2,

.about-us-sec h2,

.about-us-sec .h3,

.about-us-sec h3 {

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

  color: #1A1A1A;

  text-transform: none;

  font-weight: 700;

  line-height: 1.5;

  margin: 0 0 15px 0;

  text-align: left !important;

}



.about-us-sec .h1,

.about-us-sec h1 {

  font-size: 48px;

}



.about-us-sec .h2,

.about-us-sec h2 {

  font-size: 40px;

}



.about-us-sec .h3,

.about-us-sec h3 {

  font-size: 36px;

}





/* Large devices */

@media (max-width: 1199px) {



  .about-us-sec .h1,

  .about-us-sec h1 {

    font-size: 40px;

  }



  .about-us-sec .h2,

  .about-us-sec h2 {

    font-size: 36px;

  }



  .about-us-sec .h3,

  .about-us-sec h3 {

    font-size: 30px;

  }

}



/* Small devices */

@media (max-width: 767px) {



  .about-us-sec .h1,

  .about-us-sec h1 {

    font-size: 36px;

  }



  .about-us-sec .h2,

  .about-us-sec h2 {

    font-size: 30px;

  }



  .about-us-sec .h3,

  .about-us-sec h3 {

    font-size: 26px;

  }

}



/*------------------- 3.2. Buttons -------------------*/

.vs-btn {

  position: relative;

  display: inline-block;

  border: none;

  text-transform: uppercase;

  text-align: center;

  background-color: #0E5AF2;

  color: #ffffff;

  font-family: "Fira Sans", sans-serif;

  font-size: 16px;

  font-weight: 500;

  line-height: 1;

  padding: 19px 30.5px;

  border-radius: 5px;

  z-index: 1;

  overflow: hidden;

}



.vs-btn::after,

.vs-btn::before {

  content: "";

  margin: auto;

  position: absolute;

  top: -1px;

  left: -1px;

  width: calc(100% + 4px);

  height: calc(100% + 4px);

  background: #1A1A1A;

  transition: all ease 0.5s;

  z-index: -1;

  border-radius: inherit;

}



.vs-btn:before {

  transform: rotateX(90deg);

}



.vs-btn:after {

  transform: rotateY(90deg);

}



.vs-btn>i {

  margin-left: 8px;

}



.vs-btn:hover {

  color: #ffffff;

}



.vs-btn:hover:before {

  transform: rotateX(0);

}



.vs-btn:hover:after {

  transform: rotateY(0);

}





.play-btn {

  display: inline-block;

  position: relative;

  z-index: 1;

  border: none;

  background-color: transparent;

  padding: 0;

}



.play-btn>i {

  display: inline-block;

  width: var(--icon-size, 124px);

  height: var(--icon-size, 124px);

  line-height: var(--icon-size, 124px);

  font-size: "Font Awesome 5 Pro";

  text-align: center;

  background-color: #0E5AF2;

  color: #ffffff;

  border-radius: 50%;

  z-index: 1;

  transition: all ease 0.4s;

}



.play-btn:after,

.play-btn:before {

  content: "";

  position: absolute;

  left: 0;

  top: 0;

  right: 0;

  bottom: 0;

  background-color: #0E5AF2;

  z-index: -1;

  border-radius: 50%;

  transition: all ease 0.4s;

}



.play-btn:after {

  animation-delay: 2s;

}



.play-btn.style3 i,

.play-btn.style2 i {

  --icon-size: 60px;

  border-radius: 5px;

  --icon-font-size: 18px;

}



.play-btn.style2:after,

.play-btn.style2:before {

  border-radius: 5px;

}



.play-btn:hover:after,

.play-btn:hover::before,

.play-btn:hover i {

  background-color: #1A1A1A;

  color: #ffffff;

}





/*------------------- 3.3. Titles -------------------*/

.sec-title3 {

  text-transform: uppercase;

  line-height: 1.35;

  margin: -0.25em 0 18px 0;

  text-transform: capitalize;

}



.about-us-sec .sec-subtitle {

  text-transform: uppercase;

  display: block;

  color: #000000;

  /* #0E5AF2 */

  font-size: 16px;

  font-weight: 600;

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

  margin: -0.25em 0 23px 0;

  display: block;

}



.about-us-sec .sec-subtitle2>i,

.about-us-sec .sec-subtitle>i {

  margin-right: 15px;

}



.about-us-sec .sec-innertitle {

  font-size: 40px;

  margin: 0 0 25px 0;

}



.title-area {

  margin-bottom: calc(80px - 17px);

  text-align: left !important;

}



/*------------------- 3.9. Overlay -------------------*/

.position-center,

.cta-video .play-btn {

  position: absolute;

  left: 50%;

  top: 50%;

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

}



.ripple-animation,

.play-btn:after,

.play-btn:before {

  animation-duration: 5s;

  animation-timing-function: ease-in-out;

  animation-iteration-count: infinite;

  animation-name: ripple;

}



@keyframes ripple {

  0% {

    transform: scale(1);

    opacity: 0;

  }



  30% {

    opacity: 0.4;

  }



  100% {

    transform: scale(1.5);

    opacity: 0;

  }

}



/*------------------- 4.11. About  -------------------*/

.img-box1 .img-1 img {

  filter: drop-shadow(0px 5px 32px rgba(21, 40, 76, 0.08));

}



@media (min-width: 767px) {

  .img-box1 .img-1 {

    /* z-index: 1; */

    position: absolute;

  }



  .img-box1 .img-2 {

    z-index: 1;

    position: absolute;

    left: 132px;

    top: 300px;

  }



  .img-box1 img {

    border-radius: 5px;

  }



  .img-box1 {

    /* padding: .5em; */

    position: relative;

  }



  .about-text {

    width: 56% !important;

    float: right;

  }



}



@media (max-width: 767px) {

  .img-box1 .img-1 {

    /* z-index: 1; */

  }



  .img-box1 .img-2 {

    z-index: 1;

    left: 132px;

    top: 300px;

  }



  .img-box1 img {

    border-radius: 5px;

  }



  .img-box1 {

    /* padding: .5em; */

    /* position: relative; */

  }



  .about-text {

    width: 100% !important;

  }



}



.call-media {

  display: flex;

  align-items: center;

  padding: 10px 40px 10px 10px;

  box-shadow: 0px 10px 31px rgba(169, 177, 193, 0.17);

  border-radius: 5px;

  width: fit-content;

  max-width: 100%;

  margin: 0 0 40px 0;

  background-color: #ffffff;

}



.call-media__icon {

  background-color: #EFF1F5;

  box-shadow: 0px 7px 37px rgba(96, 125, 185, 0.11);

  border-radius: 5px;

  width: 95px;

  height: 95px;

  line-height: 95px;

  border-radius: 5px;

  text-align: center;

  margin: 0 20px 0 0;

}



.call-media__label {

  text-transform: uppercase;

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

  font-size: 14px;

  font-weight: 400;

  line-height: 1;

  display: block;

  margin: 0 0 12px 0;

}



.call-media__info {

  color: #1A1A1A;

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

  font-weight: 700;

  line-height: 1;

  display: block;

  margin: 0;

}



.call-media__info a {

  color: inherit;

}



.call-media__info a:hover {

  color: #0E5AF2;

}



.background {

  /* background: #f2709c;  

background: -webkit-linear-gradient(to right, #ff9472, #f2709c);  

background: linear-gradient(to right, #ff9472, #f2709c);  */

  background-image: url(../../assets/images/business-banner-background.jpg);

}





/* Web development part start here */



._4-cards-05_grid {

  grid-column-gap: 16px;

  grid-row-gap: 80px;

  grid-template-rows: auto auto;

  grid-template-columns: 1fr 1fr;

  grid-auto-columns: 1fr;

  display: grid;

  position: relative;

}



._4-cards-05_card {

  height: 100%;

  grid-column-gap: 1rem;

  grid-row-gap: 1rem;

  background-color: #F8F9FA;

  color: white;

  text-align: left;

  border-radius: 24px;

  flex-direction: column;

  justify-content: flex-start;

  align-items: center;

  padding: 4rem 2rem 2.5rem;

  display: flex;

  position: relative;

}



._4-cards-05_card._2 {

  padding-left: 1rem;

  padding-right: 1rem;

}



._4-cards-05_image-01 {

  max-width: 15%;

  margin: auto;

  position: absolute;

  top: 0%;

  bottom: 0%;

  left: 0%;

  right: 0%;

}



.business-title h3 {

  margin-top: 0;

  margin-bottom: 0;

  font-size: 2rem;

  font-weight: 700;

  line-height: 2.5rem;

}



.icon-cost-benefit {

  width: 5rem;

  height: 5rem;

  margin-left: auto;

  margin-right: auto;

  position: absolute;

  top: -2.5rem;

  bottom: auto;

  left: 0%;

  right: 0%;

}



.business-title {

  color: #f4836a;

}



.business-text {

  color: #716f7a;

  padding: 0px 20px;

  font-size: 16px;

  line-height: 24px;

}



.section-sub-heading-part {

  font-size: 18px;

  line-height: 26px;

  font-weight: 600;

}



/* Simple card starts here */





.top-row {

  margin-bottom: 30px;

}



.section-heading {

  margin-bottom: 18px;

  font-size: 28px;

  font-weight: 700;

  line-height: 44px;

}



.web-text {

  color: #716f7a;

  font-size: 16px;

  line-height: 24px;

  text-align: justify;

}



.expertise-section .expertise-box {

  height: 100%;

  padding: 32px 33px;

}



.web-logo {

  max-width: 57px;

  height: auto;

}



.expertise-section .expertise-box {

  height: 100%;

  padding: 32px 33px;

}



.section-sub-heading {

  font-size: 20px;

}



.icon-logo img {

  padding: 13px 0px;

}



/* Simple card ends here */





/* Web development part ends here */



/* why choose us responsive  part starts here */

@media screen and (max-width: 600px) {

  .web-responsive {

    padding: 0px !important;

    margin: 0px !important;

  }



  .web-responsive1 {

    padding: 0px !important;

    margin: 0 !important;

  }



  .web-responsive1 ul {

    padding: 0px 10px !important;

    margin: 0 auto;

  }



  .why-choose-heading h4 {

    font-size: 25px !important;

    padding: 0px 15px !important;

  }



  .why-choose-text h4 {

    font-size: 22px !important;

    padding: 10px 10px !important;

    margin: 0px !important;

    font-weight: 500;

  }



  .why-choose-heading h2 {

    font-size: 28px !important;

    padding-top: 12px;

  }



  .why-choose-text p {

    font-size: 18px !important;

    padding: 0px 10px !important;

    margin: 0 auto !important;

    text-align: justify !important;

  }



  .why-choose-text img {

    width: 22px !important;

  }



  .mtt-tops {

    margin-top: 30px !important;

  }



  .h1-res {

    font-size: 25px !important;

  }



  ._4-cards-05_grid {

    grid-template-columns: none !important;

  }

}





/* why choose us responsive  part ends here */

.badge {

  color: #ffffff !important;

  background-color: #ffffff !important;

}



.badge-info {

  background-color: #116e46;

}





.datepicker-index {

  position: absolute;

  display: block;

  z-index: 10001 !important;

}



.contact-form input,

select {

  background-color: #fefefe !important;

  border: 1px solid #ebebeb !important;

  /* box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset !important; */

  height: auto !important;

  -webkit-appearance: listbox !important;

  border-radius: .375rem;

}



.contact-form textarea {

  background-color: #fefefe !important;

  border: 1px solid #ebebeb !important;

  /* box-shadow: rgba(0, 0, 0, 0.06) 0px 2px 4px 0px inset !important; */

}

.form-control {

  border-radius: 0 !important;

}

.form-control:focus {

  border: 1px solid !important;

  border-color: #b9b9b9 !important;

  box-shadow: none !important;

}

#mathCaptcha {

  float: left;

  font-size: 24px;

  font-weight: bold;

  text-align: center;

  border: 1px solid #ebebeb;

  background-color: #fefefe;

  padding: 8px;

  border-radius: .375rem;

  width: 100%;

}



#contactUsForm {

  margin: 0 auto;

  padding: 25px;

  border-radius: 15px;

  box-shadow: rgba(14, 63, 126, 0.04) 0px 0px 0px 1px, rgba(42, 51, 69, 0.04) 0px 1px 1px -0.5px, rgba(42, 51, 70, 0.04) 0px 3px 3px -1.5px, rgba(42, 51, 70, 0.04) 0px 6px 6px -3px, rgba(14, 63, 126, 0.04) 0px 12px 12px -6px, rgba(14, 63, 126, 0.04) 0px 24px 24px -12px;

}



.bRed {

  border: 2px solid red;

  outline: none;

}



/* career part start here */

.hr-part .hr {

  border: 1px solid #e0deeb;

  width: 100%;

}



/* career part end here */



nav ul {

  list-style: none;

  /*position: relative;*/

}



nav ul li {

  display: inline-block;

}



nav a {

  text-decoration: none;

}



/* Hide Dropdowns by Default */

nav ul ul {

  /*display: none;*/

  /*position: absolute;*/

  /*top: 75px;*/

  /*margin-left: -52px !important;*/
}



/* Display Dropdowns on Hover */

nav ul li:hover>ul {

  display: inherit;

}



/* Fisrt Tier Dropdown */


/* pos drop down system */

nav ul ul li {
  /*width: 200px;*/
  /*float: none;*/
  display: list-item;
  /*position: relative;*/
  /*background-color: #08643a;*/
}

/* nav ul ul:hover{
  transition-property: all;
  transition-duration: .3s;
  animation-timing-function: cubic-bezier(.4,0,.2,1);
  transition: 0.4s all ease-in;
} */


/*nav ul ul li a:hover {*/

/*  background-color: #000000;*/

/*  display: list-item;*/

  /* position: relative; */

/*  width: 170px !important;*/

/*  margin-left: -20px !important;*/
/*}*/



.hr-part .hr {

  border: 0.1px solid #f7f7f7;

  width: 100%;

}



/* whatsApp call fixed */



.whatsapp-us {

  position: fixed;

  bottom: 20px;

  right: 20px;

  cursor: pointer;

  cursor: pointer;

  width: 60px;

}



/* Banner Slider Start */

.banner {

  min-height: 88vh;

  display: flex;

  justify-content: center;

  align-items: center;

  /* background-image: radial-gradient( circle 993px at 0.5% 50.5%,  rgba(137,171,245,0.37) 0%, rgba(245,247,252,1) 100.2% ); */

  background-image: radial-gradient(circle 993px at 99.5% 50.5%, rgba(177, 200, 250, 0.37) 0%, rgba(245, 247, 252, 1) 100.2%);

}



#title {

  font-family: "Plus Jakarta Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 800;

  font-style: normal;

  font-size: 50px;

}



#sub-title {

  font-family: "Plus Jakarta Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: normal;

  font-style: normal;

  font-size: 22px;

}

#sub-title-new {

  font-family: "Plus Jakarta Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: normal;

  font-style: normal;

  font-size: 19px;
}

.color-text {

  color: #ed3106;

  font-family: "Plus Jakarta Sans", sans-serif;

  font-optical-sizing: auto;

  font-weight: 800;

  font-style: normal;

  font-size: 45px;

}









.business-card {

  background-color: #F5F7FC;

  padding: 2rem;

  width: 280px;

  min-height: 180px;

  text-align: center;

  transition: transform 0.3s ease, box-shadow 0.3s ease;

  opacity: 0;

  transform: translateY(20px);

  animation: fadeInUp 0.5s forwards;

}



.business-card img {

  position: absolute;

  top: 0;

  right: 0;

  width: 30%;

}



.business-card span {

  display: block;

  font-size: 2rem;

  font-weight: bold;

  /* color: #afafae; */

  color: #3b3b3b;

}



.business-card p {

  font-size: 1.2rem;

  color: #7a7a7a;

}



.business-card:hover {

  transform: translateY(-10px);

  box-shadow: rgba(17, 12, 46, 0.15) 0px 48px 100px 0px;

}



@keyframes fadeInUp {

  from {

    opacity: 0;

    transform: translateY(20px);

  }



  to {

    opacity: 1;

    transform: translateY(0);

  }

}



.business-card:nth-child(1) {

  animation-delay: 0.2s;

}



.business-card:nth-child(2) {

  animation-delay: 0.4s;

}



.business-card:nth-child(3) {

  animation-delay: 0.6s;

}



#business-title {

  text-transform: capitalize !important;

  font-family: "Plus Jakarta Sans", sans-serif;

  padding-right: 20px;

  font-weight: 500;

  text-align: right;

  font-size: 35px;

}



#business-title span {

  font-weight: bold;

  font-size: 35px;

}





.our-service {

  background-image: radial-gradient(circle 993px at 99.5% 50.5%, rgba(177, 200, 250, 0.37) 0%, rgba(245, 247, 252, 1) 100.2%);



}



.service-card {

  min-height: 180px;

  box-shadow: 0px 4px 20px 5px rgba(0, 0, 0, 0.03);

  margin-bottom: 25px;

  padding: 15px;

  text-align: center;

  font-weight: bold;

  display: flex;

  flex-direction: column;

  justify-content: center;

  align-items: center;
  border-radius: 6px;

}



.service-card:hover {

  /* transition: all 0.2s ease-in-out;

  transform: scale(1.07); */
  box-shadow: 0 10px 20px 0 rgba(95, 26, 137, 0.4);
  border-radius: 6px;
  transition: all 0.3s ease-in-out;
}



.service-card img {

  width: 50px;

}



.products {

  /* background-color: #ffebeb; */

}





.product-box {

  background-color: #F5F7FC;

  border-radius: 20px;

  padding: 35px;

  height: auto !important;

  overflow: hidden;

}



.product-box-even {

  background-color: #f5fcf8;

}



.product-box-even img,

.product-box-odd img {

  margin-bottom: -180px;

}



.product-box:hover img {

  transition: all 0.3s ease-in-out;

  transform: scale(1.03);

}



.product-box h3 {

  font-size: 30px !important;

}





.arrow-button {

  text-decoration: none;

  color: #fff;

  height: 20px;

  width: 20px;

  padding: 20px;

  border-radius: 50%;

  background-color: #031979;

  display: flex;

  justify-content: center;

  align-items: center;

  box-shadow: rgba(60, 64, 67, 0.3) 0px 1px 2px 0px, rgba(60, 64, 67, 0.15) 0px 1px 3px 1px;

}



.arrow-button:hover {

  background-color: #e41212;

  color: #fff;

}



.limited-sub-title {

  overflow: hidden;

  text-overflow: ellipsis;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  /* Number of lines to show */

  -webkit-box-orient: vertical;

}



.limited-sub-title2 {

  overflow: hidden;

  text-overflow: ellipsis;

  display: -webkit-box;

  -webkit-line-clamp: 3;

  /* Number of lines to show */

  -webkit-box-orient: vertical;

}



.consulty-area {

  background-image: radial-gradient(circle 993px at 99.5% 50.5%, rgba(177, 200, 250, 0.37) 0%, rgba(245, 247, 252, 1) 100.2%);

}



/* Clients logo Sliding Start  */



.portfolio-section {

  background-image: radial-gradient(circle 993px at 99.5% 50.5%, rgba(177, 200, 250, 0.37) 0%, rgba(245, 247, 252, 1) 100.2%);

}



.customer-logos .slide img {

  width: 180px;



}



.slick-slide {

  margin: 0px 20px;

}



.slick-slide img {

  width: 100%;

}



.slick-slider {

  position: relative;

  display: block;

  box-sizing: border-box;

  -webkit-user-select: none;

  -moz-user-select: none;

  -ms-user-select: none;

  user-select: none;

  -webkit-touch-callout: none;

  -khtml-user-select: none;

  -ms-touch-action: pan-y;

  touch-action: pan-y;

  -webkit-tap-highlight-color: transparent;

}



.slick-list {

  position: relative;

  display: block;

  overflow: hidden;

  margin: 0;

  padding: 0;

}



.slick-list:focus {

  outline: none;

}



.slick-list.dragging {

  cursor: pointer;

  cursor: hand;

}



.slick-slider .slick-track,

.slick-slider .slick-list {

  -webkit-transform: translate3d(0, 0, 0);

  -moz-transform: translate3d(0, 0, 0);

  -ms-transform: translate3d(0, 0, 0);

  -o-transform: translate3d(0, 0, 0);

  transform: translate3d(0, 0, 0);

}



.slick-track {

  position: relative;

  top: 0;

  left: 0;

  display: block;

}



.slick-track:before,

.slick-track:after {

  display: table;

  content: '';

}



.slick-track:after {

  clear: both;

}



.slick-loading .slick-track {

  visibility: hidden;

}



.slick-slide {

  display: none;

  float: left;

  height: 100%;

  min-height: 1px;

}



[dir='rtl'] .slick-slide {

  float: right;

}



.slick-slide img {

  display: block;

}



.slick-slide.slick-loading img {

  display: none;

}



.slick-slide.dragging img {

  pointer-events: none;

}



.slick-initialized .slick-slide {

  display: block;

}



.slick-loading .slick-slide {

  visibility: hidden;

}



.slick-vertical .slick-slide {

  display: block;

  height: auto;

  border: 1px solid transparent;

}



.slick-arrow.slick-hidden {

  display: none;

}



.slide img {

  width: 250px;

}







/* Timeline  */





.timeline {

  position: relative;

  max-width: 1200px;

  margin: 0 auto;

}



/* The actual timeline (the vertical ruler) */

.consulty-area .timeline::after {

  content: '';

  position: absolute;

  width: 6px;

  /* background-image: radial-gradient(circle 993px at 99.5% 50.5%, rgba(177, 200, 250, 0.37) 0%, rgba(245, 247, 252, 1) 100.2%); */

  top: 0;

  bottom: 0;

  left: 50%;

  margin-left: -3px;

  /* background-color: rgb(255, 0, 0); */

  border-left: 1px dashed rgb(122, 122, 122);

}



/* Container around content */

.time-line-container {

  padding: 10px 25px;

  position: relative;

  background-color: inherit;

  width: 50%;

}



/* The circles on the timeline */

.time-line-container::after {

  content: '';

  position: absolute;

  width: 25px;

  height: 25px;

  right: -13px;

  background-color: rgb(255, 255, 255);

  /* border: 4px solid #FF9F55; */

  border: 4px solid #ed3106;

  top: 15px;

  border-radius: 50%;

  z-index: 1;



}



/* Place the time-line-container to the left */

.left {

  left: 0;

}



/* Place the time-line-container to the right */

.right {

  left: 50%;

  /* max-width: 330px; */

}



/* Add arrows to the left time-line-container (pointing right) */

.left::before {

  content: " ";

  height: 0;

  position: absolute;

  top: 22px;

  width: 0;

  z-index: 1;

  right: 15px;

  border: medium solid white;

  border-width: 10px 0 10px 10px;

  border-color: transparent transparent transparent #fff;

}



/* Add arrows to the right time-line-container (pointing left) */

.right::before {

  content: "";

  height: 0;

  position: absolute;

  top: 22px;

  width: 0;

  z-index: 1;

  left: 15px;

  border: medium solid white;

  border-width: 10px 10px 10px 0;

  border-color: transparent #fff transparent transparent;

}



/* Fix the circle for time-line-containers on the right side */

.right::after {

  left: -12px;

}



/* The actual content */

.timeline-content {

  padding: 20px 10px;

  background-color: rgba(255, 255, 255, 0.849);

  position: relative;

  border-radius: 6px;

  box-shadow: rgba(0, 0, 0, 0.04) 0px 3px 5px;

  /* -webkit-box-shadow:0px 0px 175px 2px rgba(150,231,255,0.23);

-moz-box-shadow: 0px 0px 175px 2px rgba(150,231,255,0.23);

box-shadow: 0px 0px 175px 2px rgba(150,231,255,0.23); */

}



/* Media queries - Responsive timeline on screens less than 600px wide */

@media screen and (max-width: 600px) {



  /* Place the timelime to the left */

  .timeline::after {

    left: 31px;

  }



  #title {

    font-size: 30px !important;

  }



  .color-text {

    font-size: 30px !important;

  }



  #sub-title {

    font-size: 18px;

  }



  /* Full-width time-line-containers */

  .time-line-container {

    width: 100%;

    padding-left: 70px;

    padding-right: 25px;

  }



  /* Make sure that all arrows are pointing leftwards */

  .time-line-container::before {

    left: 60px;

    border: medium solid white;

    border-width: 10px 10px 10px 0;

    border-color: transparent white transparent transparent;

  }



  /* Make sure all circles are at the same spot */

  .left::after,

  .right::after {

    left: 5px;

  }



  /* Make all right containers behave like the left ones */

  .right {

    left: 0%;

  }

  .consulty-area .timeline::after {

    left: 6%;

  }

}


.project-card {

  display: flex;

  flex-direction: column;

  padding: 20px;

  border: 0;



  background: rgba(255, 255, 255, 0.2);

  border-radius: 10px;

  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

  backdrop-filter: blur(5px);

  -webkit-backdrop-filter: blur(5px);

  border: 1px solid rgba(255, 255, 255, 0.3);

}



.project-card:hover {

  transition: all 0.3s ease-in-out;

  background-color: #f5fcf8;

}


.testimonial-container {

  background-image: radial-gradient(circle 993px at 99.5% 50.5%, #b1c8fa5e 0%, #f5f7fc 100.2%);

}


.background {

  background-image: radial-gradient(circle 993px at 99.5% 50.5%, rgba(177, 200, 250, 0.37) 0%, rgba(245, 247, 252, 1) 100.2%);

}



.our-mission {

  background-image: url(../images/mission.jpg);

  background-size: cover;

  background-position: center;

}



.mission,

.vision {

  background: rgba(255, 255, 255, 0.644);

  border-radius: 16px;

  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

  backdrop-filter: blur(5px);

  -webkit-backdrop-filter: blur(5px);

  border: 1px solid rgba(255, 255, 255, 0.3);

  padding: 25px;

  min-height: 320px;

}




.mission h1,

.vision h1 {

  font-size: 30px !important;

  text-transform: uppercase;

}



.choose-us-box {

  /*min-height: 230px;*/
  height: 100%;

  border-radius: 5px;

  -webkit-box-shadow: 0px 0px 105px 13px rgba(227, 235, 252, 0.9);

  -moz-box-shadow: 0px 0px 105px 13px rgba(227, 235, 252, 0.9);

  box-shadow: 0px 0px 105px 13px rgba(227, 235, 252, 0.9);

}





.team-card {

  min-height: 330px;

  max-width: 300px;

  display: flex;

  flex-direction: column;

  align-items: center;

  justify-content: center;



  background: rgba(255, 255, 255, 0.2);

  border-radius: 10px;

  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);

  backdrop-filter: blur(5px);

  -webkit-backdrop-filter: blur(5px);

  border: 1px solid rgba(255, 255, 255, 0.3);

}



.team-card::before {

  content: "";

  position: absolute;

  top: -5px;

  width: 20px;

  height: 5px;

  border: 3px solid red;

  box-shadow: rgba(17, 17, 26, 0.05) 0px 1px 0px, rgba(17, 17, 26, 0.1) 0px 0px 8px;

}



.team-card:hover {

  background: rgba(255, 255, 255, 0.884);

  transition: all 0.2s ease-in-out;

  transform: scale(1.05);

  transform-style: preserve-3d;

}



.team-card div {

  display: flex;

  flex-direction: column;

  align-items: center;

}



.team-card img {

  border-radius: 50%;

  width: 110px;

  box-shadow: rgba(0, 0, 0, 0.05) 0px 0px 0px 1px;

  padding: 5px;

  border: 2px solid #fcbfbf;

  margin-bottom: 15px;

}



.team-card p {

  font-size: 18px !important;

}



.team-card a {

  font-size: 14px;

}



.card-case__technology {

  display: flex;

  flex-wrap: wrap;

  margin-bottom: 16px;

  margin-top: 29px;

}

.card-case__technology__item {

  background: hsla(0, 0%, 100%, .16);

  font-size: 13px;

  margin-bottom: 4px;

  margin-right: 4px;

  padding: 6px 16px;

}

.not-found {

  height: 80vh;

}



.not-found img {

  max-width: 400px;

}







/* Animation  */



.animateFromBottomToOrigin {

  opacity: 0;

  transform: translateY(200px);

  transition: opacity 0.6s ease, transform 0.6s ease;

}



.animateFromLeftToOrigin {

  opacity: 0;

  transform: translateX(-200px);

  transition: opacity 0.8s ease, transform 0.8s ease;

}



.animateFromRightToOrigin {

  opacity: 0;

  transform: translateX(200px);

  transition: opacity 0.8s ease, transform 0.8s ease;

}





.animate {

  opacity: 1;

  transform: translateX(0) translateY(0);

}

/* @media (max-width: 768px) {

  .animateFromRightToOrigin {

    transition: opacity 0.6s ease, transform 0.6s ease;

    transform: translateX(100px);

  }

} */











@media only screen and (max-width: 768px) {

  .top-slider .container .text {

    width: 80%;

    padding: 10px;

    margin: 0 auto;

    background-color: transparent;

  }



  .text h2 {

    font-size: 1.1em !important;

  }



  .text p {

    font-size: 0.85em !important;

    font-weight: normal;

  }



  .text button {

    padding: 2px 5px;

    font-size: 8px !important;

    letter-spacing: 0.1em;

  }



  .banner-bgcolor {

    height: 40vh !important;

  }



  #title,

  #sub-title {

    text-align: center;

  }



  #title,

  .color-text {

    font-size: 35px !important;

  }



  #sub-title {

    font-size: 20px !important;

  }



  .slider ul {

    animation: cambio 10s infinite linear !important;

  }



  .customer-logos .slide img {

    width: 120px !important;



  }

  .banner-left {

    display: flex;

    flex-direction: column;

    justify-content: center;

    align-items: center;

  }

  #business-title {

    font-size: 25px !important;

    margin-top: 15px;

  }

  .product-box-even img,

  .product-box-odd img {

    margin-bottom: -80px;

  }

}

/* POS list style system about page */
.pos-list ul {
  margin: 15px 25px;
}

.pos-list ul li a {
  font-size: 22px;
  font-family: "Plus Jakarta Sans", sans-serif;
  color: #212529;
}

.pos-list ul li a:hover {
  color: green;
}

.about-sk-pos img {
  position: relative;
  left: 50%;
  padding-top: 10px;
}

/* POS list style system about page */

/* POS video system start here */

.pos-video iframe {
  width: 100%;
  height: 375px;
  border-radius: 12px;

}

/* POS video system ends here */

/* POS features start here */
.feature-img img {
  width: 65px;
}

/* POS features ends here */

/* why we unique page start here */

.featured-box {
  padding: 20px;
  border-radius: 10px;
  background: #fff;
  box-shadow: 0px 0px 10px rgba(0, 0, 0, 0.1);
  transition: transform 0.3s ease-in-out, box-shadow 0.3s ease-in-out;
}

.featured-box:hover {
  transform: translateY(-5px);
  box-shadow: 0px 10px 20px rgba(0, 0, 0, 0.15);
}

.featured-header {
  font-weight: bold;
  padding: 10px 15px;
  border-radius: 5px 5px 0 0;
  display: inline-block;
}

.chat-icon {
  position: fixed;
  bottom: 20px;
  right: 109px;
  background: #0078FF;
  color: white;
  width: 60px;
  height: 60px;
  display: flex;
  justify-content: center;
  align-items: center;
  border-radius: 50%;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
  cursor: pointer;
  font-size: 28px;
  z-index: 1000;
  transition: all 0.3s ease;
}

.chat-icon:hover {
  background: #005FCC;
}

/* Chat Box */
.chat-box {
  position: fixed;
  bottom: 90px;
  right: 20px;
  width: 450px;
  max-width: 90%;
  background: white;
  border-radius: 10px;
  box-shadow: 0px 4px 10px rgba(0, 0, 0, 0.2);
  display: none;
  flex-direction: column;
  overflow: hidden;
  z-index: 999999999;
}

/* Chat Header */
.chat-header {
  background: #0078FF;
  color: white;
  padding: 15px;
  text-align: center;
  font-size: 18px;
  font-weight: bold;
  cursor: pointer;
}

/* Chat Messages */
.chat-messages {
  padding: 10px;
  height: 350px;
  overflow-y: auto;
  display: flex;
  flex-direction: column;
  gap: 5px;
}

.chat-messages p {
  padding: 10px;
  border-radius: 10px;
  max-width: 80%;
}

.user-message {
  align-self: flex-end;
  background: #0078FF;
  color: white;
}

.bot-message {
  align-self: flex-start;
  background: #E5E5E5;
  color: black;
}

/* Chat Input */
.chat-input {
  display: flex;
  padding: 10px;
  border-top: 1px solid #ddd;
}

.chat-input input {
  flex: 1;
  padding: 10px;
  border: none;
  outline: none;
  font-size: 16px;
}

.chat-input button {
  background: #0078FF;
  color: white;
  border: none;
  padding: 10px;
  cursor: pointer;
  font-size: 16px;
}

.chat-input button:hover {
  background: #005FCC;
}

#loadingMessage {
  font-size: 14px;
}

/* why we unique page end here */

/* .table-hover tbody tr:hover {
  background-color: #f8f9fa;
  transition: background-color 0.3s ease-in-out;
} */
/* 
thead {
  position: sticky;
  top: 74 !important;
  background: white;

}
.wdth-fixed tr th{
  width: 152px;
}

@media only screen and (max-width: 600px) {
  .wdth-fixed tr th{
  width: 100% !important;
}
} */

/* Free appointment system */
.free-consultant {
  padding: 45px 0;
  /* background: url(); */
  background-image: url(../../assets/images/call_uss.jpg);
  background-repeat: no-repeat;
  background-size: cover;
  background-position: center;
  width: 100%;
}

.free-left {
  color: black;
  font-family: "Plus Jakarta Sans", sans-serif;
}

.free-left h4 a {
  font-size: 20px;
  font-weight: 500;
  color: #fff;
  text-decoration: none;
}

.free-right {
  display: flex;
  align-items: center;
  height: 100%;
  justify-content: flex-end;
}

.free-right a {
  font-family: "Plus Jakarta Sans", sans-serif;
  background: #004185;
  color: white;
  text-transform: uppercase;
  padding: 10px 20px;
  font-weight: 600;
  font-size: 15px;
  transition: 0.3s ease-out;
  text-decoration: none;
}

.free-right a:hover {
  background: black;
  color: white;
}




header{
    position: sticky;
    top: 0;
    z-index: 100;
    background-image: linear-gradient(to top, #dfe9f3 0%, white 100%);
    padding: 8px 0;
}


.mega-menu {
  background: rgba(255, 255, 255, 0.8);
  border-radius: 16px;
  box-shadow: 0 4px 30px rgba(0, 0, 0, 0.1);
  backdrop-filter: blur(15px);
  -webkit-backdrop-filter: blur(15px);
  border: 1px solid rgba(255, 255, 255, 0.3);
  max-width: 800px;
  margin: 0 auto;
}

.limited-text2 {
  overflow: hidden;
  text-overflow: ellipsis;
  display: -webkit-box;
  -webkit-line-clamp: 2;
  -webkit-box-orient: vertical;
}

@media all and (min-width: 992px) {
  .dropdown-menu {
    /*width: 13rem;*/
  }

  .mega-submenu {
    left: 100%;
    top: 0;
    min-width: 25rem;
  }

  .ktm-mega-menu {
    position: static;
  }

  .mega-menu {
    left: 0;
    right: 0;
    width: 100%;
  }

  .dropdown-menu li {
    position: relative;
  }

  .dropdown-menu .submenu {
    display: none;
    left: 100%;
    top: 0;
  }

  .dropdown-menu>li:hover>.submenu,
  .dropdown:hover>.dropdown-menu {
    display: block;
  }
}

.icon-box {
  border-radius: 10px;
  padding: 5px;
  width: 50px;
}

.web-development {
  background-color: beige;
}

.mobile {
  background-color: rgb(239, 239, 255);
}

.software {
  background-color: rgb(235, 255, 243);
}

.seo {
  background-color: aliceblue;
}


.mega-menu .service-title,
.product-title {
  font-weight: 600;
  font-size: 16px;
  line-height: 25px;
  transition: all 0.3s ease-in;
  color: black;
  text-decoration: none;
  text-transform: capitalize;
}

.mega-menu .service-title:hover {
  color: #ed3106;
  transition: all 0.3s ease-out;
}

.mega-menu .service-subtitle,
.product-card p {
  line-height: 22px;
  color: #616060;
  font-weight: 400;
}

.mega-menu .product-card {
  transition: all 0.3s ease-in;
}

.mega-menu .product-card:hover .product-title {
  color: #ed3106;
  transition: all 0.3s ease-out;
}

.mega-menu .product-card img {
  background-color: ghostwhite;
  border: 1px solid rgb(238, 238, 238);
  width: 80px;
  padding: 10px;
  border-radius: 10px;
}

.dropdown-item.active, .dropdown-item:active {
    text-decoration: none;
    background-color: ghostwhite !important;
}

@media only screen and (max-width: 600px) {
    .product-card img {
    width: 80px;
    padding: 8px;
    border-radius: 10px;
  }
      .mega-menu .service-title,
    .product-title {
      font-size: 20px;
      line-height: 22px;
    }
    .mega-menu .service-subtitle,
    .product-card p {
      line-height: 20px;
      font-size: 16px;
    }
    .icon-box {
      border-radius: 10px;
      padding: 5px;
}
    .seo-flex{
        display: flex;
        flex-direction: column;
    }
    
    .image-hover-effect{
        width: 100% !important;
    }
}

/*navbar hover system*/

/*.nav-item {*/
/*    border-bottom: 2px solid transparent;*/
/*    transition: border-bottom-color 0.3s ease;*/
/*}*/

/*.nav-item:hover {*/
/*    border-bottom: 2px solid orange;*/
/*}*/

.nav-item {
    display: inline-block;
    border-bottom: 2px solid transparent;
}

.nav-item::after {
    content: '';
    display: block;
    width: 0;
    height: 2px;
    background-color: orange;
    transition: width 0.3s ease;
}

.nav-item:hover::after {
    width: 100%;
}

 @media (min-width: 992px) {
            .left-col {
                border-right: 1px solid orange;
                padding-right: 30px;
            }
            .right-col {
                padding-left: 30px;
                position: sticky;
                top: 83px;
                align-self: start;
            }
        }


/*seo pricing table*/

.custom-card {
      background-color: #f8f9fa;
      border: none;
      border-radius: 6px;
      padding: 1.5rem;
      transition: all 0.3s ease;
      box-shadow: rgba(0, 0, 0, 0.02) 0px 1px 3px 0px, rgba(27, 31, 35, 0.15) 0px 0px 0px 1px;
    }
    .custom-card:hover {
      transform: translateY(-5px);
      box-shadow: 0 1rem 1.5rem rgba(0, 0, 0, 0.1);
    }
    .label-box {
      display: inline-block;
      background-color: black;
      color: white;
      font-weight: 600;
      padding: 0.25rem 0.75rem;
      border-top-left-radius: 0.5rem;
      border-bottom-right-radius: 0.5rem;
      margin-bottom: 0.75rem;
      font-size: 1rem;
    }
    
    .image-hover-effect {
            transition: opacity 0.3s ease, box-shadow 0.3s ease;
            opacity: 1;
            box-shadow: rgba(50, 50, 93, 0.25) 0px 2px 5px -1px, rgba(0, 0, 0, 0.3) 0px 1px 3px -1px;
        }
        .image-hover-effect:hover {
            opacity: 0.8;
            box-shadow: 0 10px 20px rgba(0, 0, 0, 0.2);
        }
        
        .seo-border{
            padding: 26px !important;
            border: 1px solid #E6E3E3;
            border-radius: 15px;
        }
        
       
       
.pages {
    background: linear-gradient(to bottom, rgba(255, 255, 255, 0.15) 0%, rgba(0, 0, 0, 0.15) 100%), radial-gradient(at top center, rgba(255, 255, 255, 0.40) 0%, rgba(0, 0, 0, 0.40) 120%) #989898;
    background-blend-mode: multiply, multiply;
    color: white;
    padding: 10px 15px;
    font-size: 20px;
    text-transform: capitalize;
    font-weight: 500;
}
.sitemap-section a {
    text-decoration: none;
    color: black;
    transition: all 0.1s ease-in;
}
.sitemap-section a:hover {
    font-weight: 500;
    color: #ed3106;
    transition: all 0.1s ease-out;
}













.history-tl-container {
            display: block;
            position: relative;
        }

        .history-tl-container ul.tl {
            margin: 20px 0;
            padding: 0;
            display: inline-block;
        }

        .history-tl-container ul.tl {
            margin: 20px 0;
            padding: 0;
            display: inline-block;
        }

        .history-tl-container ul.tl li {
            list-style: none;
            margin: auto;
            min-height: 50px;
            border-left: 1px dashed #5f8d9a;
            padding: 0 0 0 20px;
            position: relative;
        }
        .history-tl-container ul.tl li .item-title a{
            text-decoration: none;
            color: black;
            transition: all 0.1s ease-in;
        }
        .history-tl-container ul.tl li .item-title a:hover{
            font-weight: 400;
            color: #ed3106;
            transition: all 0.1s ease-out;
        }
        .list span a{
            text-decoration: none;
            color: black;
            transition: all 0.1s ease-in;
        }
        .list span a:hover{
            font-weight: 400;
            color: #ed3106;
            transition: all 0.1s ease-out;
        }

        .history-tl-container ul.tl li::before {
            position: absolute;
            left: -11px;
            top: 0;
            content: " ";
            border: 8px solid rgba(255, 255, 255, 0.74);
            border-radius: 500%;
            background: #93cff5;
            height: 20px;
            width: 20px;
            transition: all 500ms ease-in-out;
        }
        .Centersubh{
            font-size: 24px;
            text-transform: capitalize;
            text-align: left;
        }
        
        
      /*website page start start here  */
      
      .sk-phase-container {
            display: flex;
            flex-wrap: wrap;
            padding: 30px;
            background-color: #f0f8ff;
            border-radius: 15px;
            /*box-shadow: 0 4px 12px rgba(0, 0, 0, 0.1);*/
            min-height: 400px;
            border: 1px solid #dfdfdf;
        }

        .sk-phase-list {
            flex: 0 0 330px;
            padding: 15px;
            /* background-color: #fff; */
            border-radius: 10px;
            box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05);
            margin-right: 30px;
            max-height: 400px;
            /* Fixed height for scrolling */
            overflow-y: auto;
            /* Enable vertical scrolling */
        }

        .sk-phase-item {
            display: flex;
            justify-content: space-between;
            align-items: center;
            padding: 13px 15px;
            margin-bottom: 14px;
            border-radius: 5px;
            background-color: #fff;
            border: 1px solid #dfdfdf;
            color: #333;
            font-weight: 500;
            cursor: pointer;
            transition: all 0.3s ease;
        }

        .sk-phase-item.active {
            background-color: #28a745;
            color: #fff;
            font-weight: 600;
        }

        .sk-phase-item:hover {
            /* background-color: #e0e0e0;
            color: #000; */
            background-color: #28a745;
            color: white;

        }

        .sk-phase-content {
            flex: 1;
            padding: 20px 32px;
            /* background-color: #e6f3fa; */
            /* border-radius: 10px; */
            text-align: center;
            /* box-shadow: 0 2px 8px rgba(0, 0, 0, 0.05); */
        }

        .sk-phase-img {
            max-width: 100%;
            height: auto;
            border-radius: 10px;
            margin-bottom: 15px;
        }

        .sk-phase-content h4 {
            font-size: 1.5rem;
            margin-bottom: 10px;
            color: #333;
        }
        
        .sk-phase-contentE{
            text-align: left;
        }

        .sk-phase-content p {
            font-size: 1rem;
            color: #555;
            line-height: 1.6;
        }

        @media (max-width: 768px) {
            .sk-phase-container {
                flex-direction: column;
                padding: 15px;
            }

            .sk-phase-list {
                flex: 100%;
                margin-bottom: 20px;
                margin-right: 0;
                max-height: 300px;
                /* Adjusted for mobile */
            }

            .sk-phase-content {
                flex: 100%;
            }
        }
      
    .tall-image {
            height: 100%;
            object-fit: cover;
        }

        .stacked-images img {
            height: 220px;
            object-fit: cover;
        }    
    .library-title{
            font-size: 32px;
            text-transform: capitalize;
            font-weight: 500;
            text-align: left;
        
    }    
    
    .library-textp{
        font-size: 17px;
    }
    
    .library-card,
    .card-body {
    padding: 13px 16px !important;
}

.pester-reviews .card:hover {
    transform: translateY(-5px);
    box-shadow: 0 0.5rem 1rem rgba(0, 0, 0, 0.15) !important;
    transition: all 0.3s ease;
    }
    
/*E-Library Testimonial*/

.sk-testimonial-section {
        padding: 80px 0;
        position: relative;
        overflow: hidden;
    }
    .sk-testimonial-section::before {
        content: '';
        position: absolute;
        top: 0;
        left: 0;
        width: 100%;
        height: 100%;
        
        opacity: 0.1;
    }
    .sk-testimonial-label {
        color: #ff0000;
        font-size: 14px;
        font-weight: bold;
        text-transform: uppercase;
        margin-bottom: 10px;
    }
    .sk-testimonial-title {
        font-size: 32px;
        font-weight: bold;
        color: #000;
        text-align: left;
        text-transform: capitalize;
    }
    .sk-testimonial-intro {
        color: #666;
        font-size: 16px;
        margin-top: 20px;
    }
    .carousel-inner .carousel-item {
        transition: transform 0.5s ease-in-out;
    }
    .sk-testimonial-card {
        background: #fff;
        padding: 40px;
        border-radius: 20px;
        /*box-shadow: 0 8px 16px rgba(0,0,0,0.15);*/
        position: relative;
        border: 1px solid #e0e0e0;
        transition: transform 0.3s ease, box-shadow 0.3s ease;
    }
   
    .sk-rating-circle {
        width: 30px;
        height: 30px;
        background-color: #dc3545;
        color: #fff;
        border-radius: 50%;
        display: flex;
        align-items: center;
        justify-content: center;
        font-size: 14px;
        font-weight: bold;
        margin-right: 10px;
    }
    .sk-stars {
        color: #ffc107;
    }
    .sk-testimonial-text {
        color: #666;
        font-size: 16px;
        margin-bottom: 20px;
        line-height: 1.6;
        font-style: italic;
    }
    .sk-customer-name {
        font-weight: bold;
        color: #000;
        margin-bottom: 0;
    }
    .sk-customer-info {
        color: #6c757d;
        font-size: 14px;
    }
    .sk-carousel-controls {
        position: absolute;
        top: -60px;
        right: 0;
        display: flex;
        gap: 10px;
        z-index: 10;
    }
    .sk-carousel-control-prev,
    .sk-carousel-control-next {
        width: 40px;
        height: 40px;
        border: none;
        color: #fff;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        background-color: #cf8a0c; /* Green color */
        transition: background-color 0.3s ease, transform 0.3s ease;
    }
    .sk-carousel-control-prev:hover,
    .sk-carousel-control-next:hover {
        background-color: #157347; /* Darker green on hover */
        transform: scale(1.1);
    }
    .carousel-control-prev,
    .carousel-control-next {
        opacity: 0.75;
    }
    .carousel-control-prev:hover,
    .carousel-control-next:hover {
        opacity: 1;
    }
    @media (max-width: 991px) {
        .sk-testimonial-title {
            font-size: 36px;
        }
        .sk-testimonial-intro {
            margin-bottom: 30px;
        }
        .sk-carousel-controls {
            top: -50px;
            right: 0;
        }
        .sk-testimonial-card {
            padding: 30px;
        }
    }
    @media (max-width: 767px) {
        .sk-testimonial-title {
            font-size: 28px;
            text-align: center;
        }
        .sk-carousel-controls {
            position: static;
            justify-content: center;
            margin-top: 20px;
        }
        .sk-testimonial-card {
            padding: 20px;
        }
    }
/*E-Library Testimonial*/    


/*privacy page*/

.sksoft-privacy h3 {
  font-size: 28px;
  font-weight: 600;
  margin-top: 30px;
  margin-bottom: 10px;
  color: #000;
  text-align: left;
  text-transform: math-auto;
}

.sksoft-privacy p {
  font-size: 16px;
  line-height: 1.7;
  margin-bottom: 15px;
}

.sksoft-privacy ul {
  list-style: none;
  padding-left: 0;
  margin-bottom: 20px;
}

.sksoft-privacy ul li {
  font-size: 16px;
  line-height: 1.7;
  padding: 5px 0;
}

.sksoft-privacy strong {
  color: #000;
}

/* Countering system start here */

.title-card {
  font-family: "Plus Jakarta Sans", sans-serif;
  font-optical-sizing: auto;
  font-weight: 800;
  font-style: normal;
  font-size: 45px;
  text-transform: capitalize;
}


.sksoft-counter-section {
  background-color: #F9FAFB;
}

.sksoft-counter-card {
  background-color: #fff;
  border: 2px solid transparent;
  border-radius: 8px;
  padding: 20px;
  text-align: center;
  transition: all 0.3s ease;
  box-shadow: 0 4px 12px rgba(0, 0, 0, 0.05);
  position: relative;
  overflow: hidden;
}

.sksoft-counter-card:hover {
  transform: translateY(-5px);
  box-shadow: 0 8px 20px rgba(0, 0, 0, 0.1);
}

.sksoft-counter-icon {
  font-size: 2rem;
  margin-bottom: 10px;
  transition: transform 0.3s ease;
}

.sksoft-counter-card:hover .sksoft-counter-icon {
  transform: scale(1.1);
}

.sksoft-counter-number {
  font-size: 2.5rem;
  font-weight: bold;
  display: block;
}

.sksoft-counter-label {
  font-size: 1rem;
  text-transform: uppercase;
  font-weight: 600;
}

/* Bottom left colored tab */
.sksoft-counter-card::after {
  content: '';
  position: absolute;
  bottom: -2px;
  left: 0;
  width: 50px;
  height: 10px;
  border-top-right-radius: 8px;
  border-bottom-left-radius: 8px;
  transform: skewX(-45deg);
  transform-origin: bottom left;
  transition: width 0.3s ease;
}

.sksoft-counter-card:hover::after {
  width: 60px;
}

/* Color variations for borders, icons, labels, and tabs */
.sksoft-counter-card:nth-child(1) {
  border-color:#c52805;
  /* Orange */
}

.sksoft-counter-card:nth-child(1) .sksoft-counter-icon,
.sksoft-counter-card:nth-child(1) .sksoft-counter-label {
  color: #c52805;
  font-weight: 800;
}

.sksoft-counter-card:nth-child(1)::after {
  background-color: #c52805;
}

.sksoft-counter-card:nth-child(2) {
  border-color: #00bfff;
  /* Cyan */
}

.sksoft-counter-card:nth-child(2) .sksoft-counter-icon,
.sksoft-counter-card:nth-child(2) .sksoft-counter-label {
  color: #00bfff;
}

.sksoft-counter-card:nth-child(2)::after {
  background-color: #00bfff;
}

.sksoft-counter-card:nth-child(3) {
  border-color: #ff69b4;
  /* Pink */
}

.sksoft-counter-card:nth-child(3) .sksoft-counter-icon,
.sksoft-counter-card:nth-child(3) .sksoft-counter-label {
  color: #ff69b4;
}

.sksoft-counter-card:nth-child(3)::after {
  background-color: #ff69b4;
}

.sksoft-counter-card:nth-child(4) {
  border-color: #9370db;
  /* Purple */
}

.sksoft-counter-card:nth-child(4) .sksoft-counter-icon,
.sksoft-counter-card:nth-child(4) .sksoft-counter-label {
  color: #9370db;
}

.sksoft-counter-card:nth-child(4)::after {
  background-color: #9370db;
}

@media (max-width: 767px) {
  .sksoft-counter-card {
    margin-bottom: 20px;
  }

  .sksoft-counter-card::after {
    width: 40px;
  }

  .sksoft-counter-card:hover::after {
    width: 50px;
  }

  .why-card {
    max-width: 380px !important;
  }
}

/* Countering system ends here */ 

/* Unique RAT Section Styles */
.list-font-rat li {
  font-size: 18px;
}

.rat-form input {
  height: 52px;
}

.rat-section {
  background-color: #682828;
  background-image: radial-gradient(#2c2c2c 1px, transparent 1px);
  background-size: 20px 20px;
}

.rat-title {
  color: #fff;
}

.rat-card {
  border: none;
}

.rat-card-dark {
  background-color: rgba(0, 0, 0, 0.65);
  border: none;
}

.lead-text {
  font-size: 16px;
  color: white;
}

.rat-icon-box {
  width: 45px;
  height: 45px;
  background-color: rgba(220, 53, 69, 0.15);
  color: #ff3b3b;
  display: flex;
  align-items: center;
  justify-content: center;
  border-radius: 8px;
  font-size: 18px;
  flex-shrink: 0;
}

.rat-contact-item {
  background-color: rgba(255, 255, 255, 0.1);
  transition: 0.3s;
}

.rat-contact-item:hover {
  background-color: rgba(255, 255, 255, 0.15);
}

.rat-btn-danger {
  background-color: #dc3545;
  border: none;
  transition: 0.3s;
}

.rat-btn-danger:hover {
  background-color: #b92a37;
}

@media (max-width: 992px) {
  .rat-contact-item {
    flex-direction: row;
    align-items: flex-start;
  }
}

/*two pages css ends here */

/*blog page css*/

.blog-pos-part {
        padding: 30px 0;
    }
    .blog-pos-part .card {
        border: none;
        border-radius: 16px;
        box-shadow: 0 4px 15px rgba(0, 0, 0, 0.08);
        transition: all 0.3s ease;
        height: 100%;
    }
    .blog-pos-part .card:hover {
        transform: translateY(-8px);
        box-shadow: 0 12px 25px rgba(0, 0, 0, 0.15);
    }
    .blog-pos-part .step-number {
        width: 48px;
        height: 48px;
        background: linear-gradient(135deg, #0d6efd, #0b5ed7);
        color: white;
        font-size: 1.4rem;
        font-weight: 700;
        display: flex;
        align-items: center;
        justify-content: center;
        border-radius: 50%;
        margin-bottom: 15px;
    }
    .blog-pos-part .industry-icon {
        font-size: 2.8rem;
        margin-bottom: 15px;
        color: #0d6efd;
    }
    .title-fixed-left h2,
    .title-fixed-left h4 {
    text-align: left !important;
    text-transform: capitalize;
}

/*blog page css*/

/*demo pos*/

.demo-right {
        padding: 50px 40px;
        display: flex;
        flex-direction: column;
        justify-content: center;
    }
    .demo-title {
        font-size: 30px;
        font-weight: 700;
        color: #0d6efd;
        margin-bottom: 20px;
        line-height: 1.2;
        text-align: left;
        text-transform: capitalize;
    }
    .demo-text {
        font-size: 1.1rem;
        color: #555;
        margin-bottom: 40px;
    }
    .demo-btn {
        display: inline-flex;
        align-items: center;
        justify-content: center;
        background: linear-gradient(90deg, #0d6efd, #0b5ed7);
        color: white;
        font-size: 1.25rem;
        font-weight: 600;
        padding: 18px 20px;
        border-radius: 50px;
        text-decoration: none;
        box-shadow: 0 10px 25px rgba(13, 110, 253, 0.3);
        transition: all 0.3s ease;
        gap: 10px;
    }
    .demo-btn:hover {
        transform: translateY(-4px);
        box-shadow: 0 15px 35px rgba(13, 110, 253, 0.4);
        color: white;
    }
    .demo-btn i {
        font-size: 1.4rem;
    }