/*=============== GOOGLE FONTS ===============*/
@import url('https://fonts.googleapis.com/css2?family=Poppins:wght@400;500;600;700&display=swap');

/*=============== VARIABLES CSS ===============*/
:root {
  --header-height: 3.5rem; /*56px*/

  /*========== Colors ==========*/
  /*Color mode HSL(hue, saturation, lightness)*/
  --hue: 152;
  --first-color: hsl(var(--hue), 24%, 32%);
  --first-color-alt: hsl(var(--hue), 24%, 28%);
  --first-color-light: hsl(var(--hue), 24%, 66%);
  --first-color-lighten: hsl(var(--hue), 24%, 92%);
  --title-color: hsl(var(--hue), 4%, 15%);
  --text-color: hsl(var(--hue), 4%, 35%);
  --text-color-light: hsl(var(--hue), 4%, 55%);
  --body-color: hsl(var(--hue), 0%, 100%);
  --container-color: #FFF;

  /*========== Font and typography ==========*/
  /*.5rem = 8px | 1rem = 16px ...*/
  --body-font: 'Poppins', sans-serif!important;
  --big-font-size: 2rem;
  --h1-font-size: 1.5rem;
  --h2-font-size: 1.25rem;
  --h3-font-size: 1rem;
  --normal-font-size: .938rem;
  --small-font-size: .813rem;
  --smaller-font-size: .75rem;

  /*========== Font weight ==========*/
  --font-medium: 500;
  --font-semi-bold: 600;

  /*========== Margenes Bottom ==========*/
  /*.5rem = 8px | 1rem = 16px ...*/
  --mb-0-5: .5rem;
  --mb-0-75: .75rem;
  --mb-1: 1rem;
  --mb-1-5: 1.5rem;
  --mb-2: 2rem;
  --mb-2-5: 2.5rem;

  /*========== z index ==========*/
  --z-tooltip: 10;
  --z-fixed: 100;
}

/* Responsive typography */
@media screen and (min-width: 968px) {
  :root {
    --big-font-size: 3.5rem;
    --h1-font-size: 2.25rem;
    --h2-font-size: 1.5rem;
    --h3-font-size: 1.25rem;
    --normal-font-size: 1rem;
    --small-font-size: .875rem;
    --smaller-font-size: .813rem;
  }
}

/*=============== BASE ===============*/
*{
  box-sizing: border-box;
  padding: 0;
  margin: 0;
}

html{
  scroll-behavior: smooth;
}

body,
button,
input,
textarea{
  font-family: var(--body-font) !important;
  font-size: var(--normal-font-size);
}

body{
  margin: var(--header-height) 0 0 0;
  background-color: var(--body-color);
  color: var(--text-color);
  transition: .4s; /*For animation dark mode*/
  overflow-x: hidden;
}

button{
  cursor: pointer;
  border: none;
  outline: none;
}

h1,h2{
  color: var(--title-color);
  font-weight: var(--font-semi-bold);
}

ul{
  list-style: none;
}

a{
  text-decoration: none!important;
}

img{
  max-width: 100%;
  height: auto;
}

/*=============== THEME ===============*/
/*========== Variables Dark theme ==========*/
body.dark-theme{
  --first-color-dark: hsl(var(--hue), 8%, 20%);
  --title-color: hsl(var(--hue), 4%, 95%);
  --text-color: hsl(var(--hue), 4%, 75%);
  --body-color: #1d3557;
  --container-color: hsl(var(--hue), 8%, 16%);
}

/*========== Button Dark/Light ==========*/
.change-theme{
  color: var(--title-color);
  font-size: 1.15rem;
  cursor: pointer;
}

.banner_container{

  padding-left:5% ;
  padding-right:5% ;
}

.nav__btns{
  display: inline-flex;
  align-items: center;
  column-gap: 1rem;
}

/*========== 
Color changes in some parts of 
the website, in dark theme 
==========*/
.dark-theme .contact__description a{
  color: white;
}

.dark-theme .steps__bg,
.dark-theme .questions{
  background-color: #03071e;
}

.dark-theme .product__circle,
.dark-theme .footer__subscribe{
  background-color: var(--container-color);
}

.dark-theme .scroll-header{
  box-shadow: 0 1px 4px hsla(var(--hue), 4%, 4%, .3);
}
.dark-theme .slide {
background-color: black;
}
/*=============== REUSABLE CSS CLASSES ===============*/
.section{
  padding: 5.5rem 0 1rem;
}

.section__title,
.section__title-center{
  font-size: var(--h2-font-size);
  margin-bottom: var(--mb-2);
  line-height: 140%;
}

.section__title-center{
  text-align: center;
}

.container{
  max-width: 1150px;
  margin-left: var(--mb-1-5);
  margin-right: var(--mb-1-5);
}

.grid{
  display: grid;
}

.main{
  overflow: hidden; /*For animation*/
}

/*=============== HEADER ===============*/
.header{
  width: 100%;
  background-color: var(--body-color);
  
  top: 0;
  left: 0;
  z-index: var(--z-fixed);
  transition: .4s; /*For animation dark mode*/
}

.corefix{
  position: fixed !important;
  top: 0;

}

/*=============== NAV ===============*/
.nav{
  height: var(--header-height);
  display: flex;
  justify-content: space-between;
  align-items: center;
}

.nav__logo,
.nav__toggle,
.nav__close{
  color: var(--title-color);
}
ul.nav__list{

  margin-bottom: 0px;
}
.nav__logo{
 
  font-weight: 700;
  letter-spacing: -1px;
  display: inline-flex;
  align-items: center;
  column-gap: .5rem;
  transition: .3s;
}

.nav__logo-icon{
  font-size: 1.15rem;
  color: var(--first-color);
}

.nav__logo:hover{
  color: var(--first-color);
}

.nav__toggle{
  display: inline-flex;
  font-size: 1.25rem;
  cursor: pointer;
}

@media screen and (max-width: 767px){
  .nav__menu{
    position: fixed;
    background-color: var(--container-color);
    width: 80%;
    height: 100%;
    top: 0;
    right: -100%;
    box-shadow: -2px 0 4px hsla(var(--hue), 24%, 15%, .1);
    padding: 4rem 0 0 3rem;
    border-radius: 1rem 0 0 1rem;
    transition: .3s;
    z-index: var(--z-fixed);
  }
}

.nav__close{
  font-size: 1.5rem;
  position: absolute;
  top: 1rem;
  right: 1.25rem;
  cursor: pointer;
}

.nav__list{
  display: flex;
  flex-direction: column;
  row-gap: 1.5rem;
}

.nav__link{
  color: var(--title-color);
  font-weight: var(--font-medium);
  transition: .3s;
}

.nav__link:hover{
  color: #063353;
}

/* Show menu */
.show-menu{
  right: 0;
}

/* Change background header */
.scroll-header{
  box-shadow: 0 1px 4px hsla(var(--hue), 4%, 15%, .1);
}

/* Active link */
.active-link{
  position: relative;
  color: #063353;
}

.active-link::after{
  content: '';
  position: absolute;
  bottom: -.5rem;
  left: 0;
  width: 50%;
  height: 2px;
  background-color: #063353;
}

/* drop down section start */
.dropbtn {
  color: #000;
  padding: 16px;
  font-size: 16px;
  border: none;
  cursor: pointer;
}



.dropdown-content {
  display: none;
  position: absolute;
  background-color: #f9f9f9;
  min-width: 160px;
  box-shadow: 0px 8px 16px 0px rgba(0,0,0,0.2);
  z-index: 999;
}

.dropdown-content a {
  color: black;
  padding: 12px 16px;
  text-decoration: none;
  display: block;
}

.dropdown-content a:hover {background-color: #f1f1f1}

.dropdown:hover .dropdown-content {
  display: block;
}

.dropdown:hover .dropbtn {
  /* background-color: #3e8e41; */
}
/* drop down section end */
/*=============== HOME ===============*/


.owl-dots {
    text-align: center;
    position: absolute;
    bottom: -50px;
    left: 100px;
}
.home{
  padding: 0rem 0 2rem;
}
li{
  list-style: none;
}
.home__container{
  position: relative;
  row-gap: 2rem;
}
.slide-list li{
  display: flex;
  gap: 10px;
}
.home__img{
  width: 200px;
  justify-self: center;
}

.home__title{
  font-size: 40px;
  line-height: 140%;
  margin-bottom: var(--mb-1);
}

.home__description{
  margin-bottom: var(--mb-2-5);
}
.underline-5{
  width: 18%;
  border: 1px solid #063353;
  text-align: center;
  position: relative;
  left: 0%;
  top: -5px;
  display: inline-block;
}
.home__social {
    display: flex;
    gap: 2rem;
    position: absolute;
    bottom: 2%;
    left: 3%;
    z-index: 99;
}
.home__social-follow{
  /* font-weight: var(--font-medium);
  font-size: var(--smaller-font-size); */
  color: #063353;
  position: relative;
  /* transform: rotate(90deg); */
  font-size: 1.1rem;
  line-height: 36px;
}

.home__social-follow::after{
  content: '';
  position: absolute;
  width: 1rem;
  height: 2px;
  background-color: #063353;
  right: -32%;
  top: 50%;
}
.smallhead{
  background-color:#D7E9F7;
   color: #101d6d;
    width: 60%;
    text-align: center;
    padding: 2px;
    border-radius: 3px;
  font-weight: 600;
   
}
.home__social-links{
  /* display: inline-flex;
  flex-direction: column;
  row-gap: .25rem; */
  display: flex;
  gap: 1.5rem;
  margin-left: 2rem;
  color: #063353;
  font-size: 1.5rem;
    color: #063353!important;
}

.home__social-link{
  font-size: 1.5rem;
    color: #063353;
}

.home__social-link:hover{
  transform: translateX(.25rem);
}
.home_social-link{
  color: #063353;
}
.home_social-link:hover{
  color: #d5ab55;
}

/* 
.social-follow::after{
  width: 1rem;
  height: 1rem;
  background-color: red;
} */
.portfolio-text{
  text-align: center;
  font-size: 1.3rem;
  font-size: 1.5rem;
  font-weight: 400;
}
.banner-section{
   background-image: url(../img/banner/corevista_banner_new1.jpg); 
   background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 90vh!important;
  border-radius: 15px;
  box-shadow: rgb(0 0 0 / 10%) 0px 1px 3px 0px, rgb(0 0 0 / 6%) 0px 1px 2px 0px;
  position: relative; 
      overflow: hidden;
}

.home__socialimg{
  position: absolute;
    bottom: 0;
    left: 0;
}

.home__socialimg img{
width: 80%;
border-radius: 0px 0px 0px 13px;
}

.banner-section-mobileax{
  display: none;
}
.mobilebanner{

display: none;
}

.home__socialmob{
  display: none;
}

.nav {
   
    flex-wrap: nowrap !important;
    }

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

.banner-section{
   background-image: url(../img/banner/corevista_banner_new1.jpg); 
   background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  height: 590px !important;
  border-radius: 15px;
  box-shadow: rgb(0 0 0 / 10%) 0px 1px 3px 0px, rgb(0 0 0 / 6%) 0px 1px 2px 0px;
  position: relative; 
}

.home__socialimg img{
width: 60%;
border-radius: 0px 0px 0px 13px;
}
.home__social-links {
    display: flex;
    gap: 1rem;
    margin-left: 2rem;
    color: #063353;
    font-size: 1.5rem;
    color: #063353!important;
}
.home__social {
    display: flex;
    gap: 1rem;
    position: absolute;
    bottom: 2%;
    left: 2%;
    z-index: 99;
}

}

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

  .owl-dots button.owl-dot {
    width: 8px !important;
    height: 8px !important;
    border-radius: 50%;
    display: inline-block;
    background: #efebeb47;
    margin: 0 3px;
}
.owl-dots {
    text-align: center;
    position: absolute;
    bottom: -30px!important;
    left: 25px!important;
}

  .home__socialmob{
    display: flex;
    justify-content: center;
    align-items: center;
    margin-top: 5px;
  }

  .axnone{

    display: none !important;
  }

.slide-sections {
    display: inline-block;
    margin-left: 20px !important;
    margin-top: 25%!important;
    margin-right: 20px;
}
.slide-sections p {
    color: #fff;
    width: 90% !important;
    font-size: 14px !important;
    margin-bottom: 15px !important;
}

.slide-sections h2 {
    color: #fff;
    font-size: 1.3rem !important;
    width: 100%;
    font-weight: 500;
}
.btn-enquiry {
 
    border-radius: 5px !important;
  
}



  .banner-section{
    display: none;
  }
.home__socialimg{

  display: none;
}

.banner-section-mobileax{

height: 90vh;
  display: block;

  background: rgb(50,86,146);
background: linear-gradient(175deg, rgba(50,86,146,1) 2%, rgba(6,51,84,1) 57%);
}

.mobilebanner{

display: block;
  position: absolute;
     bottom: 6px;
    width: 290px;
    right: 0;
}

  }



/*.banner-section-mobile{
  background-image: url(../img/logo/anas4.png);
  background-repeat: no-repeat;
  background-size: cover;
  width: 100%;
  
  border-radius: 15px;
  box-shadow: rgb(0 0 0 / 10%) 0px 1px 3px 0px, rgb(0 0 0 / 6%) 0px 1px 2px 0px;
  position: relative;
  width: 100vw!important;
   height: 100vh!important;
  
}*/

/* tab style about us */
/* Style the tab */
.tab {
  overflow: hidden;
  /* border: 1px solid #ccc;
  background-color: #f1f1f1; */
}
.about-lottie{
  padding-top: 40px;
}

/* Style the buttons inside the tab */
.tab button {
  background-color: inherit;
  float: left;
  border: none;
  outline: none;
  cursor: pointer;
  padding: 14px 16px;
  transition: 0.1s;
  font-size: 17px;
}

/* Change background color of buttons on hover */
.tab button:hover {
  /* background-color: #ddd; */
}

/* Create an active/current tablink class */
.tab button.active {
  /* background-color: #ccc; */
  border-bottom: 2px solid #063354;
}

/* Style the tab content */
.tabcontent {
  display: none;
  padding: 6px 12px;
  /* border: 1px solid #ccc; */
  border-top: none;
}

/* owl carousel */
.slide-sections {
    display: inline-block;
   
    margin-left: 100px;
    margin-top: 16%;
}
.slide-sections h2{
  color: #fff; 
  font-size: 2.8rem;
  width: 100%;
  font-weight: 500;
  padding-bottom: 40px;
}
.slide-sections p{
  color: #fff;
   width: 51%;
    font-size: 16px;
    margin-bottom: 30px;
}
.btn-enquiry {
    color: #fff;
    background: #d5ab55;
    padding: 0.5rem 2.5rem;
    border-radius: 10px;

    margin-top: 21px;
}
.btn-enquiry:hover{
  color: #063353;
}
/* owl carousel */



/* about section start */
#about{
  padding-top: 50px;
}
.about-span{
  color: #063353;
  font-size: 1.8rem;
  font-weight: 600;
}
.about-text h2{
  font-size: 1.8rem;
    font-weight: 500;
}
.underline-about{
  width: 20%;
  border: 1px solid #063353;
  margin-top: 0.9rem;
}
.about-text p{
  margin-top: 14px;
  color: #777777;
  text-align: justify;
}






/* about section end */
/* diagram */
#diagram{
  padding-top: 100px;
}
/* diagram */



/* what we do new section start */
#base{
  padding-top: 100px;
}
.base-h2{
  text-align: center;
    font-size: 1.8rem;
    font-weight: 500;
}
.base-underline{
  width: 12%;
    border: 1px solid #063353;
    text-align: center;
    position: relative;
    left: 44%;
    top: -2px;
    display: inline-block;
}
.base-section p{
  color: #777777;
  text-align: justify;
}
.base-row{
  padding-top: 40px;
}
.base-lottie{
  width: 400px;
  /* height: 499px; */
  margin-left: 88px;
  position: relative;
  bottom: 40px;
}



.base-section{
  /* padding-top: 90px; */
}




.content {
  position: relative;
  top: 90px;
  left: 63%;
   transform: translate(-50%, -50%);
   height: 140px;
  overflow: hidden;
  font-family: 'Lato', sans-serif;
  font-size: 35px;
  line-height: 40px;
  color: #000;
}
.content__container {
  font-weight: 600;
  overflow: hidden;
  height: 40px;
  padding: 0 40px;
}
.content__container:after, .content__container:before {
  position: absolute;
  top: 0;
  color: #16a085;
  font-size: 42px;
  line-height: 40px;
  -webkit-animation-name: opacity;
  -webkit-animation-duration: 2s;
  -webkit-animation-iteration-count: infinite;
  animation-name: opacity;
  animation-duration: 2s;
  animation-iteration-count: infinite;
}
.content__container__text {
  display: inline;
  float: left;
  margin: 0;
    font-size: 2rem;
    font-weight: 500;
}
.content__container__list {
  margin-top: 0;
    padding-left: 279px;
  text-align: left;
  list-style: none;
  -webkit-animation-name: change;
  -webkit-animation-duration: 10s;
  -webkit-animation-iteration-count: infinite;
  animation-name: change;
  animation-duration: 10s;
  animation-iteration-count: infinite;
    color: #063353;
    font-size: 2.3rem;
    font-weight: 600;

}
.content__container__list__item {
  line-height: 40px;
  margin: 0;
}
@-webkit-keyframes opacity {
  0%, 100% {
    opacity: 0;
 }
  50% {
    opacity: 1;
 }
}
@-webkit-keyframes change {
  0%, 12.66%, 100% {
    transform: translate3d(0, 0, 0);
 }
  16.66%, 29.32% {
    transform: translate3d(0, -25%, 0);
 }
  33.32%, 45.98% {
    transform: translate3d(0, -50%, 0);
 }
  49.98%, 62.64% {
    transform: translate3d(0, -75%, 0);
 }
  66.64%, 79.3% {
    transform: translate3d(0, -50%, 0);
 }
  83.3%, 95.96% {
    transform: translate3d(0, -25%, 0);
 }
}
@-o-keyframes opacity {
  0%, 100% {
    opacity: 0;
 }
  50% {
    opacity: 1;
 }
}
@-o-keyframes change {
  0%, 12.66%, 100% {
    transform: translate3d(0, 0, 0);
 }
  16.66%, 29.32% {
    transform: translate3d(0, -25%, 0);
 }
  33.32%, 45.98% {
    transform: translate3d(0, -50%, 0);
 }
  49.98%, 62.64% {
    transform: translate3d(0, -75%, 0);
 }
  66.64%, 79.3% {
    transform: translate3d(0, -50%, 0);
 }
  83.3%, 95.96% {
    transform: translate3d(0, -25%, 0);
 }
}
@-moz-keyframes opacity {
  0%, 100% {
    opacity: 0;
 }
  50% {
    opacity: 1;
 }
}
@-moz-keyframes change {
  0%, 12.66%, 100% {
    transform: translate3d(0, 0, 0);
 }
  16.66%, 29.32% {
    transform: translate3d(0, -25%, 0);
 }
  33.32%, 45.98% {
    transform: translate3d(0, -50%, 0);
 }
  49.98%, 62.64% {
    transform: translate3d(0, -75%, 0);
 }
  66.64%, 79.3% {
    transform: translate3d(0, -50%, 0);
 }
  83.3%, 95.96% {
    transform: translate3d(0, -25%, 0);
 }
}
@keyframes opacity {
  0%, 100% {
    opacity: 0;
 }
  50% {
    opacity: 1;
 }
}
@keyframes change {
  0%, 12.66%, 100% {
    transform: translate3d(0, 0, 0);
 }
  16.66%, 29.32% {
    transform: translate3d(0, -25%, 0);
 }
  33.32%, 45.98% {
    transform: translate3d(0, -50%, 0);
 }
  49.98%, 62.64% {
    transform: translate3d(0, -75%, 0);
 }
  66.64%, 79.3% {
    transform: translate3d(0, -50%, 0);
 }
  83.3%, 95.96% {
    transform: translate3d(0, -25%, 0);
 }
}








/* what we do new section end */



/* how we work */
.work-text-section{
  padding: 4rem!important;
  box-shadow: rgb(0 0 0 / 8%) 0px 4px 12px;
  border-radius: 15px;
  background: #063353;
  color: #fff;
}
.work-text-section h3{
  font-size: 1.5rem;
  text-align: center;
   padding-bottom: 15px;
   font-weight: 400;
}
.main-text p{
  text-align: center;
  color: #dee2e6;
}

/* what we do section start */
#feature{
  padding-top: 40px;
  position: relative;
}
.feature-h2{
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
}
.mission-vission{
  padding-top: 50px;
}
.underline-1{
  width: 12%;
  border: 1px solid #063353;
  text-align: center;
  position: relative;
  left: 44%;
  top: -2px;
  display: inline-block;
}
.card-row{
  row-gap: 2rem;
  padding-top: 40px;
}
.card-text h2{
  font-size: 1.2rem;
  font-weight: 500;
  padding-top: 1.5rem;
}
.card-body{
  display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center;
  padding: 1.1rem;
}
.card-text{
  text-align: center;
}
.card-text p{
  text-align: center;
    margin-bottom: 0rem;
    padding-top: 0.5rem;
    color: #777777;
}
.card-1{
  padding: 0.5rem 1rem;
  border: none!important;
  box-shadow: rgba(0, 0, 0, 0.16) 0px 1px 4px;
}
.card-1:hover{
  background: #063353;
  color: #fff;
}
.card-1:hover *,
.card-1-p:hover{
  color: #fff;
}


.card{
  border: none!important;
  padding: 0.5rem 1rem;
  border-radius: 10px!important;
}

/* .card:hover *,
.card-1-p:hover{
  color: #fff;
  background: #063353;
} */
.eclips-1{
  position: absolute;
  top: 17%;
  left: 10%;
  z-index: 2;
}
.eclips-2{
  position: absolute;
  top: 67%;
  z-index: 9;
  left: 31%;
}
.eclips-3{
  position: absolute;
    top: 60%;
    right: 6%;
    z-index: 2;
}
.eclips-16{
  position: absolute;
  top: 29%;
  left: 59%;
  z-index: 2;
}
img.vert-move {
  -webkit-animation: mover 1s infinite  alternate;
  animation: mover 1s infinite  alternate;
}
img.vert-move {
  -webkit-animation: mover 1s infinite  alternate;
  animation: mover 1s infinite  alternate;
}
@-webkit-keyframes mover {
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
@keyframes mover {
  0% { transform: translateY(0); }
  100% { transform: translateY(-10px); }
}
/* what we do section end */



/* slide section start */
#slide{
  padding-top: 60px;
  position: relative;
  background-image: url(../img/slide-image/features.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.slide-h2{
  text-align: center;
  font-size: 1.8rem;
  font-weight: 500;
}
.blog-slider__button:hover{
  color: #fff;
}
.slide-underline{
  display: inline-block;
    border: 1px solid #063353;
    
    position: absolute;
    width: 6%!important;
    top: 11%;
    left: 47.1%;
}
.blog-slider__img img{
  padding: 2rem;
}

.blog-slider {
  width: 100%!important;
  position: relative;
  top: 40px;
  max-width: 1050px!important;
  margin: auto;
  background: #fff;
  box-shadow: 0px 14px 80px rgb(34 35 58 / 20%);
  padding: 25px;
  border-radius: 25px;
  height: 400px;
  transition: all 0.3s;
  margin-left: 4.5rem;
  box-shadow: rgba(17, 17, 26, 0.1) 0px 4px 16px, rgba(17, 17, 26, 0.05) 0px 8px 32px;
}
@media screen and (max-width: 992px) {
  .blog-slider {
    max-width: 680px;
    height: 400px;
 }
}
@media screen and (max-width: 768px) {
  .blog-slider {
    min-height: 500px;
    height: auto;
    margin: 180px auto;
 }
}
@media screen and (max-height: 500px) and (min-width: 992px) {
  .blog-slider {
    height: 350px;
 }
}
.blog-slider__item {
  display: flex;
  align-items: center;
}
@media screen and (max-width: 768px) {
  .blog-slider__item {
    flex-direction: column;
 }
}
.blog-slider__item.swiper-slide-active .blog-slider__img img {
  opacity: 1;
  transition-delay: 0.3s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > * {
  opacity: 1;
  transform: none;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(1) {
  transition-delay: 0.3s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(2) {
  transition-delay: 0.4s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(3) {
  transition-delay: 0.5s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(4) {
  transition-delay: 0.6s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(5) {
  transition-delay: 0.7s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(6) {
  transition-delay: 0.8s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(7) {
  transition-delay: 0.9s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(8) {
  transition-delay: 1s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(9) {
  transition-delay: 1.1s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(10) {
  transition-delay: 1.2s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(11) {
  transition-delay: 1.3s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(12) {
  transition-delay: 1.4s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(13) {
  transition-delay: 1.5s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(14) {
  transition-delay: 1.6s;
}
.blog-slider__item.swiper-slide-active .blog-slider__content > *:nth-child(15) {
  transition-delay: 1.7s;
}
.blog-slider__img {
  width: 300px;
  flex-shrink: 0;
  height: 300px;
  /* box-shadow: 1px 3px 4px 1px #063353; */
  border-radius: 20px;
  transform: translateX(-80px);
  overflow: hidden;
  box-shadow: rgb(0 0 0 / 16%) 0px 1px 4px;
  /* box-shadow: rgb(0 0 0 / 24%) 0px 3px 8px; */
  background: #fff;
}
.blog-slider__img::after {
  content: '';
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%); */
  border-radius: 20px;
  opacity: 0.6;
  /* background-color: #063353; */
}
@media screen and (max-width: 768px) {
  .blog-slider__img {
    transform: translateY(-50%);
    /* width: 90%; */
 }
}
@media screen and (max-width: 576px) {
  .blog-slider__img {
    /* width: 95%; */
 }
}
@media screen and (max-height: 500px) and (min-width: 992px) {
  .blog-slider__img {
    height: 270px;
 }
}
.blog-slider__img img {
  width: 100%;
  height: 100%;
  object-fit: cover;
  display: block;
  opacity: 0;
  border-radius: 20px;
  transition: all 0.3s;
}
.blog-slider__content {
  padding-right: 25px;
}
@media screen and (max-width: 768px) {
  .blog-slider__content {
    margin-top: -80px;
    text-align: center;
    padding: 0 30px;
 }
}
@media screen and (max-width: 576px) {
  .blog-slider__content {
    padding: 0;
 }
}
.blog-slider__content > * {
  opacity: 0;
  transform: translateY(25px);
  transition: all 0.4s;
}
.blog-slider__code {
  color: #7b7992;
  margin-bottom: 15px;
  display: block;
  font-weight: 500;
}
.blog-slider__title {
  font-weight: 500;
  font-size: 1.4rem;
  color: #0d0925;
  margin-bottom: 20px;
}
.blog-slider__text {
  color: #4e4a67;
  margin-bottom: 30px;
  line-height: 1.5em;
  /* width: 65%; */
  text-align: justify;
}
.blog-slider__button {
  display: inline-flex;
  /* background-image: linear-gradient(147deg, #fe8a39 0%, #fd3838 74%); */
  padding: 12px 35px;
  border-radius: 0px;
  color: #fff;
  /* box-shadow: 0px 14px 80px rgb(252 56 56 / 40%); */
  text-decoration: none;
  font-weight: 400;
  justify-content: center;
  text-align: center;
  letter-spacing: 1px;
  background: #063353;
  font-size: 1rem;
  border-radius: 5px;
}
@media screen and (max-width: 576px) {
  .blog-slider__button {
    width: 100%;
 }
}
.blog-slider .swiper-container-horizontal > .swiper-pagination-bullets, .blog-slider .swiper-pagination-custom, .blog-slider .swiper-pagination-fraction {
  bottom: 10px;
  left: 0;
  width: 100%;
}
.blog-slider__pagination {
  position: absolute;
  z-index: 21;
  right: 20px;
  width: 11px !important;
  text-align: center;
  left: auto !important;
  top: 50%;
  bottom: auto !important;
  transform: translateY(-50%);
}
@media screen and (max-width: 768px) {
  .blog-slider__pagination {
    transform: translateX(-50%);
    left: 50% !important;
    top: 205px;
    width: 100% !important;
    display: flex;
    justify-content: center;
    align-items: center;
 }
}
.blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
  margin: 8px 0;
}
@media screen and (max-width: 768px) {
  .blog-slider__pagination.swiper-pagination-bullets .swiper-pagination-bullet {
    margin: 0 5px;
 }
}
.blog-slider__pagination .swiper-pagination-bullet {
  width: 11px;
  height: 11px;
  display: block;
  border-radius: 10px;
  background: #062744;
  opacity: 0.2;
  transition: all 0.3s;
}
.blog-slider__pagination .swiper-pagination-bullet-active {
  opacity: 1;
  background: #063353;
  height: 30px;
  box-shadow: rgb(0 0 0 / 19%) 0px 10px 20px, rgb(0 0 0 / 23%) 0px 6px 6px;
}
@media screen and (max-width: 768px) {
  .blog-slider__pagination .swiper-pagination-bullet-active {
    height: 11px;
    width: 30px;
 }
}
/* slide section end */




/* countries section start */
#stand{
  position: relative;
  padding-top: 110px;
}
.stand-underlien{
  border: 1px solid #063353;
  width: 12%;
  position: absolute;
  left: 44.5%;
  top: 10.5rem;
}
.stand-h2{
  text-align: center;
  font-size: 1.8rem;
    font-weight: 500;
}
.stand-row{
  padding-top: 50px;
  padding-bottom: 200px;
}
.dots-img{
  max-width: 200px!important;
  position: absolute;
  left: 20px;
  top: 142px;
}
.card-img-down{
  position: relative;
  top: 45%;
}
.countries-image{
  border-radius: 10px!important;
  box-shadow: rgba(14, 30, 37, 0.12) 0px 2px 4px 0px, rgba(14, 30, 37, 0.32) 0px 2px 16px 0px;
 
}



.card-img{
  -webkit-transition: all 3s ease; 
-moz-transition: all 3s ease; 
-o-transition: all 3s ease; 
-ms-transition: all 3s ease; 
transition: all 3s ease; 
}
.card-img:hover{
  transform: scale(1.1);
transition: 3s ease-in-out;
}
.card-img, .overlay{
  text-align: center;
}
.countries-image, .overlay{
  transition: 1.3s all;
border-radius: 3px;
}
.card-img{
  float: left;
/* max-width: 50%; */
position: relative;
/* margin: .5%; */
/* margin: 10px 100px; */
box-shadow: rgba(0, 0, 0, 0.15) 0px 5px 15px 0px;
}
.countries-image{
  width: 100%;
margin-bottom: 0px;
}
.overlay {
position: absolute;
top: 0;
left: 0;
bottom: 0;
width: 100%;
background: rgba(0, 0, 0, 0.5);
color: #fff;
/* opacity: 0; */
border-radius: 10px;
}

.overh2{
padding-top: 80%;
font-size: 1.5rem;
line-height: 20px;
/* font-family: 'Droid Serif', serif; */
position: relative;
bottom: 116px;
color: #a19c9c;
}

.card-img:hover .overlay{
opacity: 1;
/* transform: scale(2); */


}

/* countries section end */



/* client section start */
#client{
  position: relative;
  padding-bottom: 100px;
  background-image: url(../img/client/light_dott_pg.png);
  background-repeat: no-repeat;
  background-size: contain;
}
.client-h2{
  font-size: 1.8rem;
  font-weight: 500;
  padding-top: 40px;
  text-align: center;
}
.client-bg{
  /* max-width: 600px!important; */
}
.client-underline{
  width: 21%;
  border: 1px solid #063353;
  margin-left: 14rem;
  margin-top: 1.3rem;
}
.client-p{
  color: #777777;
  padding-top: 20px;
  text-align: center;
  width: 96%;

}
.slider-section{
  /* box-shadow: 0 10px 20px -5px rgb(0 0 0 / 13%); */ 
    height: 100px;
    margin: auto;
    overflow: hidden;
    position: relative;
    border-radius: 10px;
    margin-top: 87px;
}
/* client section end */




/* contact section start */
#contact{
  position: relative;
}
.contact-container{
  /* background: #fbfdfe; */
  padding: 3rem;
}
.form-box{
  box-shadow: rgb(0 0 0 / 8%) 0px 4px 12px;
  padding: 2rem;
  background: #fff;
  position: relative;
  right: 50px;
  border-radius: 15px;
  padding: 1.5rem 2rem!important;
}
.contact-underline{
  width: 14%;
  border: 1px solid #063353;
  position: absolute;
  left: 43%;
  top: 110px;
}
.contact-h2{
  text-align: center;
  padding-bottom: 65px;
  font-size: 1.8rem;
  font-weight: 500;
}
.contact-touch{
  width: 600px;
}
/* contact section end */


/* newsletter section start */
.letter-section{
  /* display: flex;
  flex-direction: column;
  align-items: center;
  justify-content: center; */
}
.letter-section h2{
  font-size: 1.8rem;
  font-weight: 500;
  text-align: center;
}
#newsletter{
  padding-top: 100px;
  /* padding-bottom: 40px; */
  background-image: url(../img/banner/quote_bg_texture.png);
  background-size: cover;
  background-repeat: no-repeat;
}
.letter-section p{
  padding-top: 12px;
    color: #777777;
    padding-bottom: 40px;
    text-align: center;

}
.input-section{
  border: none;
  outline: none;
  width: 26%;
    padding: 0 0.5rem;
    background: none;
    background: #eaf7f6;
    border-radius: 10px;
    padding-left: 22px
}
.letter-btn{
  background: #063353;
    color: #fff;
    padding: 0.9rem 1.75rem;
    border-radius: 10px;
    border: none;
    margin-left: 30px;
}
.form-section{
  display: flex;
  justify-content: center;
}

/* newsletter section end */


/* footer section start */
footer{
  padding-top: 100px;
 
}
.footer-li{
  padding-bottom: 0.6rem;
  font-size: 15px;
}
.footer_title h3{
  padding-left: 1.9rem;
  font-size: 1.4rem;
}
.footer-links{
  color: #777777;
}
.footer-links:hover{
  transform: translateY(-.25rem);
  color: #063353;
}
.company{
  padding-top: 0.5rem;
    color: #777777;
    font-size: 15px;
    line-height: 1.7rem;
}
.company i:hover{
  color: #063353;
}
.company-contacts{
  color: #777777;
}
.company-contacts:hover{
  color: #063353;
}
.footer-links i{
  font-size: 14px;
    padding-right: 8px;
    color: #063353;
}
.company i{
  font-size: 16px;
  color: #063353;
  padding-right: 10px;
  padding-top: 6px;
}
.footer__social-link {
  font-size: 20px;
}
.footer-p{
  font-size: 15px;

}

/* .footer-link-section{
  padding-left: 150px!important;
} */
/* footer section end */
/*=============== BUTTONS ===============*/
.button{
  display: inline-block;
  background: #063353;
  color: #FFF;
  padding: 1rem 1.75rem;
  border-radius: .5rem;
  transition: .3s;
}

.button:hover{
  background-color: #d5ab55;;
}

.button__icon{
  transition: .3s;
}

.button:hover .button__icon{
  transform: translateX(.25rem);
}

.button--flex{
  display: inline-flex;
  align-items: center;
  column-gap: .5rem;
}

.button--link{
  color: var(--first-color);
  font-weight: var(--font-medium);
}

.button--link:hover .button__icon{
  transform: translateX(.25rem);
}

/*=============== ABOUT ===============*/
.about__container{
  row-gap: 2rem;
}

.about__img{
  width: 280px;
  justify-self: center;
}

.about__title{
  margin-bottom: var(--mb-1);
}

.about__description{
  margin-bottom: var(--mb-2);
}

.about__details{
  display: grid;
  row-gap: 1rem;
  margin-bottom: var(--mb-2-5);
}

.about__details-description{
  display: inline-flex;
  column-gap: .5rem;
  font-size: var(--small-font-size);
}

.about__details-icon{
  font-size: 1rem;
  color: #29a73e;
  margin-top: .15rem;
}

/*=============== STEPS ===============*/
.steps__bg{
  background-color: var(--first-color-lighten);
  padding: 3rem 2rem 2rem;
  border-radius: 1rem;
}

.steps__container{
  gap: 2rem;
  padding-top: 1rem;
}



.steps__card{
  background-color: var(--container-color);
  padding: 2.5rem 3rem 2rem 1.5rem;
  border-radius: 1rem;
}
.steps__card:hover{
  background-color: rgb(122, 63, 243);
  color: #FFF;
}

.steps__card-number{
  display: inline-block;

  color: #FFF;
  padding: .5rem .75rem;
  border-radius: .25rem;
  font-size: var(--h2-font-size);
  margin-bottom: var(--mb-1-5);
  transition: .3s;
}

.steps__card-title{
  font-size: var(--h3-font-size);
  margin-bottom: var(--mb-0-5);
}

.steps__card-description{
  font-size: var(--small-font-size);
}

.steps__card:hover .steps__card-number{
  transform: translateY(-.25rem);
}

/*=============== we do ===============*/





.wedo_cards{
 display: grid;
 column-gap: 2rem;
}

/*=============== bussiness con ===============*/





.business_con{
  display: grid;
  column-gap: 2rem;
  row-gap: 2rem;
  
 }
 
 .business_con_content{
   background-color: #F7F7F7;
   border-radius: 10px;
   text-align: center;
   padding: 5px;
 }
 .business_con_content:hover{
   box-shadow: rgba(50, 50, 93, 0.25) 0px 6px 12px -2px, rgba(0, 0, 0, 0.3) 0px 3px 7px -3px;
   cursor: pointer;
   background-color: #c37ae6;
 }
/*=============== QUESTIONS ===============*/
.questions{
  background-color: var(--first-color-lighten);
}

.questions__container{
  gap: 1.5rem;
  padding: 1.5rem 0;
}

.questions__group{
  display: grid;
  row-gap: 1.5rem;
}

.questions__item{
  background-color: var(--container-color);
  border-radius: 10px;
  box-shadow: rgba(0, 0, 0, 0.1) 0px 1px 3px 0px, rgba(0, 0, 0, 0.06) 0px 1px 2px 0px;
  background: #063353;
  color: #fff;
}

.questions__item-title{
  font-size: 1.1rem;
  font-weight: 400;
  padding-top: 0.2rem;
}

.questions__icon{
  font-size: 1.25rem;
  color: var(--title-color);
}

.questions__description{
  font-size: var(--smaller-font-size);
  padding: 0 1.25rem 1.25rem 2.5rem;
}

.questions__header{
  display: flex;
  align-items: center;
  column-gap: .5rem;
  padding: .75rem .5rem;
  cursor: pointer;
  border-radius: 10px 10px 0px 0px;
}

.questions__content{
  overflow: hidden;
  height: 0;
}

.questions__item,
.questions__header,
.questions__item-title,
.questions__icon,
.questions__description,
.questions__content{
  transition: .3s;
}

.questions__item:hover{
  box-shadow: 0 2px 8px hsla(var(--hue), 4%, 15%, .15);
}

/*Rotate icon, change color of titles and background*/
.accordion-open .questions__header,
.accordion-open .questions__content{
  background-color:#063353;
  
}
.questions__content{
  border-radius: 0px 0px 10px 10px;
}
.accordion-open .questions__item-title,
.accordion-open .questions__description,
.accordion-open .questions__icon{
  color: #FFF;
  font-size: 1rem;
}

.accordion-open .questions__icon{
  transform: rotate(45deg);
}

/*=============== CONTACT ===============*/
.contact__container{
  row-gap: 3.5rem;
}

.contact__data{
  display: grid;
  row-gap: 2rem;
}

.contact__subtitle{
  font-size: var(--normal-font-size);
  font-weight: var(--font-medium);
  color: var(--text-color);
  margin-bottom: var(--mb-0-5);
}

.contact__description{
  display: inline-flex;
  align-items: center;
  column-gap: .5rem;
  color: var(--title-color);
  font-weight: var(--font-medium);
}
.contact__description a{
  color: rgb(0, 0, 0);
}
.contact__icon{
  font-size: 1.25rem;
}

.contact__inputs{
  display: grid;
  row-gap: 2rem;
  margin-bottom: var(--mb-2-5);
}

.contact__content{
  position: relative;
  height: 3rem;
  border-bottom: 1px solid var(--text-color-light);
}

.contact__input{
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  padding: 1rem 1rem 1rem 0;
  background: none;

  color: var(--text-color);

  
  border: none;
  outline: none;
  z-index: 1;
}

.contact__label{
  position: absolute;
  top: .75rem;
  width: 100%;
  font-size: var(--small-font-size);
  color: var(--text-color-light);
  transition: .3s;
}

.contact__area{
  height: 7rem;
}

.contact__area textarea{
  resize: none;
}

/*Input focus move up label*/
.contact__input:focus + .contact__label{
  top: -.75rem;
  left: 0;
  font-size: var(--smaller-font-size);
  z-index: 10;
}

/*Input focus sticky top label*/
.contact__input:not(:placeholder-shown).contact__input:not(:focus) + .contact__label{
  top: -.75rem;
  font-size: var(--smaller-font-size);
  z-index: 10;
}

/*=============== FOOTER ===============*/
.footer__container{
  row-gap: 3rem;
}

.footer__logo{
  /* display: inline-flex; */
  align-items: center;
  column-gap: .5rem;
  color: var(--title-color);
  text-transform: uppercase;
  font-weight: 700;
  letter-spacing: -1px;
  margin-bottom: var(--mb-2-5);
  transition: .3s;
}
.footer-logo{
  position: relative;
  bottom: 10px;
}

.footer__logo-icon{
  font-size: 1.15rem;
  color: var(--first-color);
}

.footer__logo:hover{
  color: var(--first-color);
}

.footer__title{
  font-size: var(--h3-font-size);
  margin-bottom: var(--mb-1-5);
}

.footer__subscribe{
  background-color: var(--first-color-lighten);
  padding: .75rem;
  display: flex;
  justify-content: space-between;
  border-radius: .5rem;
}

.footer__input{
  width: 70%;
  padding: 0 .5rem;
  background: none;
  color: var(--text-color);
  border: none;
  outline: none;
}

.footer__button{
  padding: 1rem;
}

.footer__data{
  display: grid;
  row-gap: .75rem;
}


.footer__information{
  font-size: var(--small-font-size);
}

.footer__social{
  display: inline-flex;
  column-gap: 1.5rem;
  padding-top: 30px;
}

.footer__social-link{
  /* font-size: 1rem; */
  /* color: var(--text-color); */
  transition: .3s;
  color: #063353;
}

.footer__social-link:hover{
  transform: translateY(-.25rem);
  color: #063353;
}

.footer__cards{
  display: inline-flex;
  align-items: center;
  column-gap: .5rem;
}
.footer__card{
  width: 100px;
  

border-radius: 5px;

}
.footer__card:hover{
  cursor: pointer;

}
.footer__copy{
  text-align: center;
  font-size: var(--smaller-font-size);
  color: var(--text-color-light);
  margin: 5rem 0 1rem;
  margin: 0rem 0 0rem;
    background: #063353;
    color: #fff;
    padding-top: 1rem;
    padding-bottom: 1rem;
}

/*=============== SCROLL UP ===============*/
.scrollup{
  position: fixed;
  background-color: var(--first-color);
  right: 1rem;
  bottom: -30%;
  display: inline-flex;
  padding: .5rem;
  border-radius: .25rem;
  z-index: var(--z-tooltip);
  opacity: .8;
  transition: .4s;
}

.scrollup__icon{
  font-size: 1rem;
  color: #FFF;
}

.scrollup:hover{
  background-color: var(--first-color-alt);
  opacity: 1;
}

/* Show Scroll Up*/
.show-scroll{
  bottom: 3rem;
}

/*=============== SCROLL BAR ===============*/
::-webkit-scrollbar{
  width: .6rem;
  background: hsl(var(--hue), 4%, 53%);
}

::-webkit-scrollbar-thumb{
  background: hsl(var(--hue), 4%, 29%);
  border-radius: .5rem;
}

/*=============== BREAKPOINTS ===============*/
/* For small devices */
@media screen and (max-width: 320px){
  .container{
    margin-left: var(--mb-1);
    margin-right: var(--mb-1);
  }

  .home__img{
    width: 180px;
  }
  .home__title{
    font-size: var(--h1-font-size);
  }

  .steps__bg{
    padding: 2rem 1rem;
  }
  .steps__card{
    padding: 1.5rem;
  }

  .product__container{
    grid-template-columns: .6fr;
    justify-content: center;
  }
  .wedo_cards{
    grid-template-columns: 1fr 1fr;
  }
  .business_con{
    grid-template-columns: 1fr 1fr;
  }
}


@media screen and (max-width: 576px){
  .wedo_cards{
    grid-template-columns: 1fr 1fr;
  }
  .business_con{
    grid-template-columns: 1fr 1fr;
  }
}

/* For medium devices */
@media screen and (min-width: 576px){
  .steps__container{
    grid-template-columns: repeat(2, 1fr);
  }

  .product__description{
    padding: 0 4rem;
  }
  .product__container{
    grid-template-columns: repeat(2, 170px);
    justify-content: center;
    column-gap: 5rem;
  }

  .footer__subscribe{
    width: 400px;
  }
  .wedo_cards{
    grid-template-columns: repeat(3,1fr);
  }
  .business_con{
    grid-template-columns: repeat(3,1fr);
  }

}

@media screen and (min-width: 767px){
  body{
    margin: 0;
  }

  .nav{
    height: calc(var(--header-height) + 1.5rem);
    column-gap: 1rem;
  }
  .nav__toggle,
  .nav__close{
    display: none;
  }
  .nav__list{
    flex-direction: row;
    column-gap: 3rem;
  }
  .nav__menu{
    margin-left: auto;
  }

  .home__container,
  .about__container,
  .questions__container,
  .contact__container,
  .footer__container{
    grid-template-columns: repeat(2, 1fr);
  }
  
  .home{
    /* padding: 10rem 0 5rem; */
  }
  .home__container{
    align-items: center;
  }
  .home__img{
    width: 280px;
    order: 1;
  }
  .home__social{
    /* top: 30%; */
  }

  .questions__container{
    align-items: flex-start;
  }

  .footer__container{
    column-gap: 3rem;
  }
  .footer__subscribe{
    width: initial;
  }
  .wedo_cards{
    grid-template-columns: repeat(3,1fr);
  }
  .business_con{
    grid-template-columns: repeat(3,1fr);
  }
  .about-lottie{
    padding-top: 40px;
  }
}

/* For large devices */
@media (min-width:992px) and (max-width:1999px){
  .container{
    margin-left: auto;
    margin-right: auto;
  }
  /* .banner-section{
    height: 92vh!important;
  } */
  
  /* .slide-sections {
    display: inline-block;
    position: relative;
    left: 50px;
    top: 140px;
  }
  .home__social {
    position: absolute;
  
    display: flex;
    gap: 2.5rem;
    bottom: 16px;
    left: 29px;
} */
/* .owl-dots {
  text-align: center;
  position: absolute;
  top: 550px;
} */


  .section{
    padding: 8rem 0 1rem;
  }
  .section__title,
  .section__title-center{
    font-size: var(--h1-font-size);
  }

  .home{
    /* padding: 11rem 0 5rem; */
  }
  .home__img{
    width: 350px;
  }
  .home__description{
    padding-right: 7rem;
  }

  .about__img{
    width: 380px;
  }

  .steps__container{
    grid-template-columns: repeat(3, 1fr);
  }
  .steps__bg{
    padding: 3.5rem 2.5rem;
  }
  .steps__card-title{
    font-size: var(--normal-font-size);
  }

  .product__description{
    padding: 0 16rem;
  }
  .product__container{
    padding: 4rem 0;
    grid-template-columns: repeat(3, 185px);
    gap: 4rem 6rem;
  }
  .product__img{
    width: 160px;
  }
  .product__circle{
    width: 110px;
    height: 110px;
  }
  .product__title,
  .product__price{
    font-size: var(--normal-font-size);
  }

  .questions__container{
    padding: 1rem 0 4rem;
  }
  .questions__title{
    text-align: initial;
  }
  .questions__group{
    row-gap: 2rem;
  }
  .questions__header{
    padding: 1rem;
  }
  .questions__description{
    padding: 0 3.5rem 2.25rem 2.75rem;
  }

  .footer__logo{
    font-size: var(--h3-font-size);
  }
  .footer__container{
    grid-template-columns: 1fr 1fr 1fr;
  }
  .footer__copy{
    margin: 0rem 0 0rem;
  }
  .wedo_cards{
    grid-template-columns: repeat(6,1fr);
  }
  .business_con{
    grid-template-columns: repeat(3,1fr);
  }
  .blog-slider__text {
    color: #4e4a67;
    margin-bottom: 30px;
    line-height: 1.5em;
    width: 84%;
  }
  

}




/* slider */

@keyframes scroll {
  0% {
      transform: translateX(0);
 }
  100% {
      transform: translateX(calc(-250px * 7));
 }
}
.slider {
  
  /* box-shadow: 0 10px 20px -5px rgba(0, 0, 0, .125);
  height: 100px;
  margin: auto;
  overflow: hidden;
  position: relative;
 
  border-radius: 10px; */
}
.slider::before, .slider::after {
  
  content: "";
  height: 100px;
  position: absolute;
  width: 200px;
  z-index: 2;
}
.slider::after {
  right: 0;
  top: 0;
  transform: rotateZ(180deg);
}
.slider::before {
  left: 0;
  top: 0;
}
.slider .slide-track {
  animation: scroll 20s linear infinite;
  display: flex;
  width: calc(250px * 14);
}
.slider .slide {
  height: 100px;
  width: 250px;
}


 
/*Whatsapp button*/

  
.wtsp {
  border-radius: 50%;
  bottom: 3%;
  color: #fff;
  display: inline;
  background-color: #25d366;
  font-size: 30px;
  line-height: 50px;
  height: 50px;
  font-family:'Poppins', sans-serif;
  padding: 5px 0;
  position: fixed;
  right: 30px;
  text-align: center;
  text-decoration: none;
  box-shadow: 0 5px 10px rgba(0, 0, 0, 0.3);
  width: 50px;
  z-index: 999;
  -webkit-transition: all 0.5s ease 0s;
  -moz-transition: all 0.5s ease 0s;
  -ms-transition: all 0.5s ease 0s;
  -o-transition: all 0.5s ease 0s;
  transition: all 0.5s ease 0s;
  }
  .wtsp:hover{
  border-radius: 50%;
  bottom: 3%;
  color: #fff;
  display: inline;
  background-color: green;
  
  }
  .wtsp i {
  display: block;
  margin-top: 5px;
  }
  .wtsp span {
  display: block;
  text-transform: uppercase;
  font-size: 14px;
  font-weight: bold;
  }
  
  .wtsp:hover,
  .wtsp:focus {
  color: #fff;
  text-decoration: none;
  }





 @media (min-width:1326px){
   .banner-section{
     display: block;
   }
   .banner-section-mobile{
     display: none;
   }
   .corevista-1{
    display: block;
  }
  .corevista-2{
    display: none;
  }
 }




  @media (min-width:1200px) and (max-width:1326px){
    .banner-section{
      display: block;
    }
    .banner-section-mobile{
      display: none;
    }
    .corevista-1{
      display: block;
    }
    .corevista-2{
      display: none;
    }

  }


  

  @media (min-width:992px) and (max-width:1199px){
    .banner-section{
      display: block;
    }
    .banner-section-mobile{
      display: none;
    }


.blog-slider {
  max-width: 877px!important;
}
.home__social {
  position: absolute;
  /* display: grid; */
  display: flex;
  gap: 3rem;
  bottom: 40px;
  left: 46px;
}
.footer-p{
  font-size: 0.9rem;
  width: 102%;
}
.footer-ul{
  font-size: 0.9rem;
}
.company{
  font-size: 14px;
  width: 111%;
}
.contact-touch {
  width: 500px;
}
#feature {
  padding-top: 15px;
}
.base-lottie{
  margin-left: 39px;
}
.content__container__list {
 
  padding-left: 240px;
  font-size: 1.9rem;

}
.content__container__text {
  font-size: 1.7rem;
}
.base-section {
  padding-top: 70px;
}
.corevista-1{
  display: block;
}
.corevista-2{
  display: none;
}
  }



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


.mobilebanner {
    display: block;
    position: absolute;
    bottom: 6px;
    width: 70%;
    right: 0;
}

.slide-sections p {
   
    width: 70% !important;

}


  .banner-section{
    display: block;
  }
  .banner-section-mobile{
    display:none ;
  }
  .logo-image{
    display: inline-block;
    position: relative;
   
  }
  .slide-sections h2{
    font-size: 2.5rem;
  }
  .banner-section{
    height: 74vh!important;
  }
/*  .slide-sections{
    position: absolute;
   
  }*/
  .slide-sections p {
    color: #fff;
    width: 43%;
    font-size: 14px;
}
.home__social-links {
  display: flex;
  gap: 1.2rem;
  margin-left: 3rem;
  color: #063353;
  font-size: 1.2rem;
  color: #063353!important;
}
.home__social-follow {
  color: #063353;
  position: relative;
  /* transform: rotate(90deg); */
  font-size: 1rem;
}
.home__social {
  position: absolute;
  /* display: grid; */
  display: flex;
  gap: 3rem;
  bottom: 124px;
  left: 17px;
}
/*.owl-dots {
  text-align: center;
  position: absolute;
  top: 10px;
  left: 50%;
}*/
.about-text h2 {
  font-size: 1.5rem;
  font-weight: 500;
}
.about-span {
  color: #063353;
  font-size: 1.5rem;
  font-weight: 600;
}

.about-text p{
  font-size: 14px;
}

.questions__item-title {
  font-size: 1rem;
  font-weight: 400;
}
.mission-vission {
  padding-top: 35px;
}
.feature-h2 {
  font-size: 1.5rem;
  font-weight: 500;
}
.card-text h2 {
  font-size: 1.1rem;
}
.card-text p{
  font-size: 14px;
}
.blog-slider{
  max-width: 640px!important;
}
.blog-slider__title {
  font-weight: 500;
  font-size: 1.2rem;
  margin-bottom: 0px;
}
.blog-slider__text {
  color: #4e4a67;
  margin-bottom: 12px;
  line-height: 1.5em;
  width: 90%;
  text-align: justify;
  font-size: 14px;
}
.blog-slider__button{
  padding: 10px 25px;
}
.slide-h2{
  font-size: 1.5rem;
}
.stand-h2{
  font-size: 1.5rem;
}
.dots-img {
  max-width: 149px!important;
  position: absolute;
  left: 15px;
  top: 150px;
}
.slider-section {
  margin-top: 50px;
}
.client-h2{
  font-size: 1.5rem;
}
.client-underline{
  margin-left: 8.5rem;
}
.contact-h2{
  font-size: 1.5rem;
}
.contact-underline{
  position: absolute;
  left: 43%;
  top: 59px;
}
.contact-touch {
  width: 390px;
}
.button{
  padding: 0.8rem 0.8rem;
  border-radius: 0.5rem;
  transition: .3s;
  font-size: 14px;
}
.contact__inputs {
  display: grid;
  row-gap: 1rem;
}
.form-box{
  adding: 1rem 1rem!important;
}
.footer__logo{
  margin-bottom: 10px;
}
.footer-p{
  padding-top: 11px;
  font-size: 14px;
  text-align: justify;
}
.footer_title h3{
  font-size: 1.5rem;
}
.footer-li{
  font-size: 14px;
}
.footer-link-section {
  padding-left: 130px!important;
}
.company{
  font-size: 14px;
}
.footer__copy{
  margin: 0rem 0 0rem;
}
.service-footer{
  margin-left: -50px;
}
.company{
  width: 145%;
  font-size: 13px;
}
.input-section {
  width: 35%;
}
.letter-section h2 {
  font-size: 1.6rem;
}
.letter-btn{
  font-size: 14px;
}

.base-lottie{
  width: 340px;
  margin-left: 0px;
  position: relative;
  bottom: 50px;
}
.content__container__list {
  margin-top: 0;
  padding-left: 182px;
  font-size: 1.4rem;
}
.content__container__text {
  font-size: 1.3rem;
}
.base-section {
  padding-top: 35px;
  font-size: 14px;
}
#base {
  padding-top: 70px;
}
.work-text-section {
  padding: 3rem!important;
 
  font-size: 14px;
}
.work-text-section h3 {
  font-size: 1.2rem;
}

.slide-underline{
  position: absolute;
    top: 11%;
}
.contact-container {
  padding: 0rem;
}
#newsletter {
  padding-top: 100px;
}
.footer-ul{
  font-size: 13px;
  width: 124%;
}
.corevista-1{
  display: block;
}
.corevista-2{
  display: none;
}



}


@media (min-width:576px) and (max-width:767px){
/*  .banner-section{
    height: 56vh!important;
    display: block;
  }*/
  .corevista-1{
    display: none;
  }
  .corevista-2{
    display: block;
  }
  .banner-section-mobile{
    display: none;
  }
/*  .slide-sections h2{
  font-size: 1.8rem;
  width: 60%;
  }*/
/*  .slide-sections{
    position: relative;
    left: 35px;

  }*/
/*  .btn-enquiry {
    color: #fff;
    background: #d5ab55;
    padding: 0.5rem 1.2rem;
    border-radius: 6px;
    position: absolute;
    left: 0%;
    font-size: 14px;
}*/
.home__social-follow{
  font-size: 13px;
}
.home_social-link {
  color: #063353;
  font-size: 14px;
}
.home__social-links {
  display: flex;
  gap: 1.1rem;
}
.home__social {
  position: absolute;
 
  display: flex;
  gap: 1rem;
  bottom: 13px;
  left: 14px;
}
.home {
  padding: 0rem 0 2rem;
}
/*.owl-dots {
  text-align: center;
  position: absolute;
  top: 10px;
  left: 50%;
}*/
.about-text{
  order: -1;
}
.about-text h2 {
  font-size: 1.3rem;
  font-weight: 500;
}
.about-span {
  color: #063353;
  font-size: 1.3rem;
}
.underline-about {
  width: 18%;
}
.about-text{
  padding-top: 40px;
}
.about-text p{
  font-size: 14px;
}
.mission-vission {
  padding-top: 30px;
}
.feature-h2 {
  font-size: 1.3rem;
}
.card-text h2 {
  font-size: 1rem;
}
.card-1-p{
  font-size: 14px;
}
.eclips-3 {
  position: absolute;
  top: 80%;
  right: 6%;
  z-index: 2;
}
.slide-h2 {
  text-align: center;
  font-size: 1.3rem;
  font-weight: 500;
  z-index: 2;
}
.slide-underline {
  display: inline-block;
  border: 1px solid #063353;
  position: absolute;
  width: 9%!important;
  top: 5%;
  left: 46.1%;
  z-index: 2;
}
.blog-slider__text{
  width: 100%;
 
}
.blog-slider {
  width: 100%!important;
  position: relative;
  top: 200px;
}
.stand-h2 {
  font-size: 1.3rem;
}
.stand-row{
  row-gap: 1rem;
  padding-bottom: 135px;
}
.client-h2 {
  font-size: 1.3rem;
  font-weight: 500;
  padding-top: 18px;
}
.slider-section{
  margin-top: 40px;
}
.client-underline {
  width: 16%;
  border: 1px solid #063353;
  margin-left: 13.7rem;
  margin-top: 1.2rem;
}
#client{
  padding-bottom: 60px;
}
.contact-h2{
  font-size: 1.3rem;
}
.contact-touch {
  width: 500px;
}
.form-box {
  box-shadow: rgb(0 0 0 / 8%) 0px 4px 12px;
  padding: 2rem;
  background: #fff;
  position: relative;
  /* right: 50px; */
  border-radius: 15px;
  padding: 1.5rem 2rem!important;
  width: 80%!important;
  left: 10%;
  margin-top: 20px!important;
}
.button {
  display: inline-block;
  background: #063353;
  color: #FFF;
  padding: 1rem 1.2rem;
  border-radius: 0.5rem;
  transition: .3s;
  font-size: 14px;
}
.footer_title h3 {
  padding-left: 0rem;
}
.footer-link-section {
  padding-left: 14px!important;
}
ol,ul{
  padding-left: 0px!important;
}
.footer-p{
  padding-top: 22px;
  max-width: 54%;
}
.footer-link-section{
  padding-top: 25px;
}
.footer__copy{
  margin: 0rem 0 0rem;
}
.eclips-16 {
  position: absolute;
  top: 29%;
  left: 57%;
}
.slide-sections p {
  color: #fff;
  width: 61%;
  font-size: 14px;
}
.letter-btn{
  padding: 0.8rem 1.75rem;
  font-size: 14px;
}
.input-section{
  width: 35%;
  font-size: 14px;
}
.letter-section h2 {
  font-size: 1.3rem;
}
.menu-footer{
  padding-top: 22px;
}
.company{
  width: 52%;
}
.base-lottie{
  margin-left: 60px;
  position: relative;
  bottom: 40px;
}
.content__container__list {
  font-size: 1.2rem;
  padding-left: 158px!important;
}
.content__container__text {
  font-size: 1.1rem;
}
.content {
  position: absolute;
  top: 10%;
  left: 30%;
}
.base-section {
  padding-top: 40px;
}
.base-text-1{
  font-size: 14px;
}
.main-text p {
  font-size: 14px;
}
.work-text-section {
  padding: 2.5rem!important;
}
.work-text-section h3 {
  font-size: 1.2rem;
}
.dropbtn {
  padding: 0px;
}

}


@media (min-width:332px) and (max-width:575px){
  .container {
    max-width: 350px;
  }
  .container {
    max-width: 350px;
   
  }
  .corevista-1{
    display: none;
  }
  .corevista-2{
    display: block;
  }
  /*.banner-section{
    display: none;
  }*/
  .banner-section-mobile{
    display: block;
  }

  
  .home__social-follow{
    font-size: 13px;
  }
  .home_social-link {
    color: #063353;
    font-size: 14px;
  }
  .home__social-links {
    display: flex;
    gap: 1.1rem;
  }

 
  .about-text h2 {
    font-size: 1.1rem;
  }
  .about-span {
  
    font-size: 1.1rem;
  }
  .about-text p{
    font-size: 14px;
  }
  .mission-vission {
    padding-top: 40px;
    row-gap: 1rem;
}
.feature-h2 {
  font-size: 1.1rem;
}
.underline-1{
  position: relative;
  left: 40%;
  width: 20%;
}
.card-text h2 {
  font-size: 1rem;
}
.card-1-p{
  font-size: 14px;
}
.eclips-1 {
  position: absolute;
  top: 11%;
  left: 10%;
  z-index: 2;
}
.eclips-2 {
  position: absolute;
  top: 88%;
  z-index: 9;
  left: 11%;
}
.blog-slider__text{
  width: 100%;
}
.blog-slider__title {
  font-size: 1.1rem;
}
.blog-slider__text{
  font-size: 14px;
}
.blog-slider{
  position: relative;
    top: 180px;
}
.slide-h2 {
  font-size: 1.1rem;
}
.slide-underline {
  display: inline-block;
  border: 1px solid #063353;
  position: absolute;
  width: 15%!important;
  top: 5%;
  left: 43.1%;
}
.stand-h2 {
  font-size: 1.1rem;
}
.dots-img {
  max-width: 150px!important;
  position: absolute;
  left: 0px;
  top: 140px;
}
.card-img-down {
  position: relative;
  top: 0%;
}
.stand-row {
  row-gap: 1rem;
  padding-bottom: 60px;
}
.dropbtn {
  padding: 0px;
}
.client-h2 {
  font-size: 1.1rem;
}
.client-underline{
  margin-left: 7.8rem;
}
.client-p {

  width: 100%;
  font-size: 14px;
}
.slider-section{
  margin-top: 40px;
}
#client{
  padding-bottom: 60px;
}
.contact-h2 {
  font-size: 1.1rem;
}
.contact-underline {
  width: 32%;
 
  position: absolute;
  left: 34%;
  top: 98px;
}
.contact-touch {
  width: 310px;
}
.form-box{
  position: relative;
  right: 0px;
}
.button {
  display: inline-block;
  background: #063353;
  color: #FFF;
  padding: 0.8rem 0.8rem;
  border-radius: 0.5rem;
  transition: .3s;
  font-size: 14px;
}
.footer-p{

  font-size: 14px;
  padding-top: 20px;
}
footer {
  padding-top: 50px;
}
.footer-link-section {
  padding-left: 17px!important;
  padding-top: 25px;
  font-size: 14px;
}
ol, ul {
  padding-left: 0rem!important;
}
.footer_title h3 {
  padding-left: 0rem;
}
.company{
  font-size: 14px;
}

.home {
  padding: 4.5rem 0 2rem;
}

.about-text{
  padding-top: 20px;
}
.btn-enquiry{
  padding: 0.4rem 1.2rem;
  font-size: 14px;
}
.home {
  padding: 0rem 0 2rem;
}
#about {
  padding-top: 25px;
}
.contact-container {
  background: none;
}
#newsletter {
  padding-top: 50px;
}
.letter-section h2 {
  font-size: 1.1rem;
}
.letter-section p{
  font-size: 14px;
}
.letter-section p {
  padding-bottom: 20px;
}
.input-section {
 
  width: 50%;
 
  padding-left: 15px;
  font-size: 12px;
}
.letter-btn {
 
  padding: 0.8rem 1rem;
 
  margin-left: 24px;
  font-size: 12px;
}
.menu-footer{
  padding-top: 22px;
    font-size: 14px;
}
.footer_title h3 {
  
  font-size: 1.1rem;
}
.footer-ul{
  font-size: 14px;
}

.base-section p {
  font-size: 14px;
}
p.content__container__text {
    display: inline;
    float: left;
    margin: 0;
    font-size: 1.05rem;
    font-weight: 500;
}
.base-lottie{
  width: 300px;
  position: relative;
  bottom: 40px;
  margin-left: 0px;
}
.base-underline {
  position: relative;
  left: 40%;
  width: 20%;
}
#base {
  padding-top: 80px;
}
.base-h2 {
  font-size: 1.1rem;
}.stand-underlien{
  border: 1px solid #063353;
    width: 26%;
    position: absolute;
    left: 38.5%;
    top: 9.5rem;
}
.base-section {
  padding-top: 20px;
}
.content {
  width: 100%;
  position: absolute;
  top: 11%;
  left: 42%;
}
.work-text-section h3 {
  font-size: 1rem;
}
.main-text p {
  font-size: 14px;
}
.work-text-section {
  padding: 1.5rem!important;
}
.content__container__list {
  margin-top: 0;
  padding-left: 140px!important;
  font-size: 1.1rem;
}
/* .base-lottie {
  width: 300px;
  margin-left: 0px;
  position: relative;
  bottom: 40px;
} */



}