*{
  margin: 0px;
	padding: 0px;
}

body{
    background-color: #04001D;
    max-width: 1920px;
    width: 100%;
    overflow-x: hidden;
}

html, body {
  height: 100%;
  scroll-behavior: smooth;
  overflow: auto; /* ✅ This allows scroll-container to work */
  margin: 0;
  padding: 0;
}

p{
  line-height: 1.1;
  font-size: 18px;
}

.p-small{
  font-size: 16px;
}

.scroll-container {
  height: 100vh;
  overflow-y: scroll;
  scroll-snap-type: y mandatory;
  scroll-behavior: smooth;
}

.container-fluid{
  padding: 90px 120px;
}

#sectionOne, #sectionTwo, #sectionThree, #sectionFour, #sectionFive, #sectionSix, #sectionSeven, #sectionEight {
  /* height: 100vh; */
  scroll-snap-align: start;
}

#sectionOne, #sectionTwo{
  height: 100vh;
}

#sectionTwo{
  margin-bottom: 10%;
  padding: 0px;
}

#sectionThree{
  height: 100vh;
  /* border: 2px solid pink; */
  /* padding: 0px; */
  padding-left: 0px;
  padding-right: 0px;
}

#sectionFour{
  background-image: url(../images/bg-image\ 3.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-color: #fff;
}

#sectionFive{
  height: 100vh;
  display: flex;
  justify-content: center;  
  align-items: center;
  width: 100%;
  padding: 10px 0;
  box-sizing: border-box;
}

#sectionSix{
  display: flex;
  flex-direction: column;
  justify-content: center; 
  align-items: center;     
  background-color: #FFF;
}

#sectionSeven{
  height: 100vh;
  padding: 10% 0px;
}

#sectionEight{
  position: relative;
}

.header{
  margin-top: 0px;
}

.navbar.navbar-expand-lg{
  border-radius: 62px;
  padding: 0px 40px;  
  background-color: #efefef !important;
}

.nav-item .nav-link{
  padding-right: 20px !important;
  padding-left: 20px !important;
}

.nav-item.build-in-apps{
  background-color:#FFF ;
  border-radius: 17px;
  margin-right: 18px;
  box-shadow: 0 3px 4px rgba(0, 0, 0, 0.3);
}

.nav-item.sign-in{
  background-color:#FF8500 ;
  border-radius: 17px;
  box-shadow: 0 3px 4px rgba(0, 0, 0, 0.3);
}

.nav-item.sign-in .nav-link{
  color: #FFF;
}

.main-logo{
  width: 90px;
}

.navbar-collapse .navbar-nav{
  margin-right: 0px !important;
}

/* carouselBanner */

#carouselBanner{
  padding: 0px 0px 0px 0px;
  display: flex;
  align-items: center;
}

#carouselBanner .carousel-inner{
  width: 80%;
  margin-left: auto;
  padding: 3% 0%;
}
#carouselBanner .carousel-item{
  margin-left: auto;
  width: 100%!important;
  max-width: 100%;
}

@keyframes slideInLeft {
  0% {
    transform: translateX(-100%);
    opacity: 0;
  }
  100% {
    transform: translateX(0%);
    opacity: 1;
  }
}

.carousel-item img.animated-slide {
  animation: slideInLeft 0.6s ease-out;
}
.carousel-inner {
  transition: none !important;
}
.carousel-item {
  transition: none !important;
}

.nav-link{
  color: #fff;
}

.carouselBanner-text-new{
  position: absolute;
  left: 0px;
  color: #FFF;
  z-index: 10;
  top: 15%;
  width: 100% !important;
  text-align: left;
  padding: 50px 90px;
}
.carouselBanner-text-new h2{
  color: #F5A623;
  /* font-size: 45px; */
  margin-bottom: 0px;
}

.carouselBanner-text-new h1{
  margin-bottom: 15px;
  font-size: clamp(39px, 6vw, 86px);
}

.carouselBanner-text-new h5{
  font-weight: normal;
  margin-bottom: 0px;
  font-size: 25px;
}

.carouselBanner-text-new h5 img{
  width: 20px;
  height: 20px;
  margin-right:8px;
}

.carouselBanner-text-new p{
  width: 40%;
}

h1.display-1 .letter{
  font-size: clamp(60px, 6vw, 88px);
  /* line-height: 0; */
  
}

#heroCarousel,
#heroCarousel .carousel-item {
  height: 100vh; 
  min-height: 400px; 
}

.hero-img {
  object-fit: cover; 
  height: 100%;
}

/* end carouselBanner */


/* ------- hero-carousel section ----------- */

.carouselSection{
  display: flex;
  align-items: center;
  width: 100%;
}

.carouselSection .carousel.slide{
   width: 50%;
}

#carouselExample3{
  width: 100%;
}

.carouselSection .carousel.text{
   width: 50%;
   display: grid;
   place-items: center;
   padding-left: 50px;
}

.carousel-text{
    display: flex;
    align-items: center;
}

h1{
    color: #FFC300;
    /* font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; */
    font-family: Impact, 'Anton', Haettenschweiler, 'Arial Narrow Bold', sans-serif;
    font-size: 3.75rem;
    font-size: clamp(60px, 6vw, 60px);
    /* text-transform: capitalize; */
    line-height: 1.0;
}

#fourth-section h1{
  font-size: clamp(45px, 6vw, 67.2px);
  color: #FF5F2C;
}

.header-large{
    font-size: 97px;
}

.carouselSection{
  position: relative;
  margin-top: -60px;
  top: -50px;
}

.carouselSection-contoller-btns{
  position: absolute;
  right: 10%;
  bottom: 75%;
}

.carouselSection-contoller-btns button{
  border: none !important;
}

/* .carouselSection-contoller-btns .carousel-control-next, .carouselSection-contoller-btns .carousel-control-prev{
    width: 90% !important;
} */



.hero-carousel{
    width: 100%;
    position: relative;
    padding: 50px 0px;
}

.hero-carousel-static-div{
    position: absolute;
    width: 50%;
    top: 20px;
}

.hero-carousel-static-div img{
    width: 748px;
    height: 822px;
}

.hero-carousel-content{
    display: flex;
    align-items: center;
}

.hero-carousel-content img{
    width: 719px !important;
    height: 564px !important;
}

.carouselSection .carousel.text{
    width: 100%;
    display: flex;
    justify-content: space-between;
    padding: 0px;
}

.hero-carousel-content-text-monetisation{
  padding-top: 0px;
  padding-bottom: 48px;
  margin: 0px auto;
}

.monetisation-section-blocks{
  padding-bottom: 48px;
}

.hero-carousel-content-text{
    padding: 0px 50px;
}


@keyframes slideInLeft {
  from {
    transform: translateX(-100%);
    opacity: 0;
  }
  to {
    transform: translateX(0%);
    opacity: 1;
  }
}

.animated-slide {
   animation: slideInLeft 0.6s ease-in-out;
}

/* ------- End hero-carousel section ----------- */



/* ------- hero-banner section ----------- */

#Onesection{
  background-color: #fff;
  background-image: url(../images/hero-banner\ 2-min.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  padding: 160px 120px !important;
}

.hero-banner-text-section{
  left: 10px;
  top:0px;
  bottom: 0px;
}

.app-subtitle{
  /* font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; */
  font-family: Impact, 'Anton', Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  font-size: clamp(30px, 6vw, 48px);
  line-height: 1;
}

/* .app-subtitle span{
 font-size: clamp(30px, 6vw, 48px); 
} */


/* ------- End hero-banner section ----------- */


/* ------- Monetisation (Secondsection) section ----------- */

.monetisation-section-blocks .col-12 img{
  max-height: 500px;
  width: 160px;
}

.monetisation-section-blocks .col-12 .monetisation-section-caption{
  color: #FFC300;
  /* font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; */
  font-family: Impact, 'Anton', Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  font-size: 1.35rem;
  font-weight: normal;
  text-transform: uppercase;
}


.monetisation-section-blocks .col-12 .monetisation-section-text{
  color: #FFF;
  text-transform: capitalize;
  font-size: 15px;
}

.hero-carousel-content-text p{
  color: #FFC300;
  font-size: 21px;
  text-transform: capitalize;
  margin: 0 auto;

}


/* -------End of Monetisation section ----------- */


/* ------- E-Commerce section ----------- */

#Thirdsection{
  background-image: url(../images/image\ 145-min.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-attachment: fixed; 

}

.content-block h4{
  font-size: 29px;
  color: #000000;
  font-weight: bold;
}

.content-block p{
  font-size: 17px;
  width: 50%;
}

.hero-carousel-content-icons{
   text-align: center;
   margin-bottom: 48px;
}

.hero-carousel-content-icons h4{
  color: #FF8000;
  /* font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; */
  font-family: Impact, 'Anton', Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  font-size: 1.5rem;
  text-transform: uppercase;
  letter-spacing: 0.5px;
  font-weight: normal !important;
  line-height: 0.9;
  min-height: 40px;
}

.hero-carousel-content-icons h4 {
  margin-bottom: 20px;
}

.hero-carousel-content-icons p{
 text-transform: capitalize;
 font-size: 15px;
 margin-bottom: 0px;
 padding-bottom: 0px;
}

.hero-carousel-content-icons-col{
  align-items: center;
}

/* ------- End of E-Commerce section ----------- */


/* ------- Corporate SME section ----------- */

#Forthsection{
  background-image: url(../images/image\ 146-min.png);
  background-repeat: no-repeat;
  background-size: cover;
  background-attachment: fixed; 
}

.corporate-sme-personal-solutions-col{
  margin-top: 0px;
  margin-bottom: 0px;
}

/* ------- End of Corporate SME section ----------- */


#Fifthsection{
  background-image: url(../images/image\ 5-min.png);
  background-repeat: no-repeat;
  background-position: center;
  background-size: cover;
  background-attachment: fixed;

}


/* ------- Flexible Drag & Drop section ----------- */

.flexible-drag-and-drop-section .col-12 h1{
  /* line-height: 1.0; */
}

.flexible-drag-and-drop-text h4{
  margin-bottom: 0.1rem;
  font-size: 1.3rem;
}

.flexible-drag-and-drop-text p{
  margin-bottom: 0.9rem;
  font-size: 15px;
}

.explore-btn{
  text-align: left;
}

/* ------- End of Flexible drag & drop section ----------- */

.howitWorksSection{
   width: 100%;
   color: #000000;
   display: flex;
   flex-direction: column;
   align-items: center !important;
}

#howitworks{
   position: relative;
}

.laptop-screen {
    position: relative;
    width: 100%;
    /* max-width: 605px; */
    margin: 0 auto;
    overflow: hidden;
    margin-right: 0;
}

.animated-gif-img {
    position: absolute;
    top: 5%;              
    left: 22%;            
    width: 102% !important;           
    height: auto;
    max-width: none;
}

.laptop {
    display: block !important;
    width: 100%;
    height: auto;
}

#howitworks , #howitworks-Left{
    width: 100%;
}

#howitworks-Left h4{
    font-size: 31px;
    color: #FFF;
    text-transform: uppercase;
}

.howitworks-text-section{
    padding: 20px 0px 0px 0px;
    width: 60%;
}

.howitworks-blocks{
    padding: 15px 0px 0px 0px;
}

.howitworks-blocks h3{
    margin: 10px 0px;
    padding: 0px;
    font-size: 27px;
    font-weight: 700;
}

.howitworks-blocks p{
  text-transform: capitalize;
}

.testimonialSection{
    width: 100%;
    margin: 0px auto;
    color: #FFF;
    max-width: 1320px;
}

.testimonial-slider .carousel-inner{
    width: 100%;
    margin: 0px auto;
    text-align: center;
    border-radius: 20px;
}

.testimonialsection-inner{
    width: 100%;
}

.testimonialsection-inner h4{
  margin-bottom: 0px;
}

.testimonialsection-inner .testimonial-comment{
    width: 70%;
    text-align: left;
}

.testimonialsection-inner .testimonial-img{
    width: 30%;
}

.testimonialsection-inner .testimonial-img img{
    border-radius: 20px;
    width: 100%;
}

.testimonialsection-inner h5{
    font-size: 17px;
    font-weight: 400;
}

.testimonial-btns{
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: -39px; 
}

.testimonial-btns .carousel-control-next, .testimonial-btns .carousel-control-prev{
    width: 95% !important;
}

.getupSection{
    width: 100%;
    display: flex;
    gap: 70px;
    align-items: center;
}

.getup-Inner-section h2{
    font-size: 42px;
}

.getup-Inner-section img{
   width: 15%;
}

.getupSection h5{
    text-transform: uppercase;
    font-weight: 900;
}

.getup-Inner-section img{
  filter: invert(66%) sepia(41%) saturate(878%) hue-rotate(351deg) brightness(101%) contrast(92%);
}

.btn-orange{
    color: #FFF;
    background-color: #FF8500;
    padding: 5px 30px;
}

.btn-orange:hover{
    color: #FFF;
    background-color: #FF8500;
}

.featureImageSection{
    color: #FFF;
    border-radius: 40px;
    background: #363157;
    display: flex;
    align-items: center;
    padding: 0px;
    /* width: 100%; */
}

.featureImg_left{
   padding: 0px 0px;
   width: 50%;
   display: grid;
   place-content: center;
}

.featureImg_left img{
   width: 80%;
}


.featureImg_right{
   padding: 20px;
   width: 50%;
}

.featureImg_right h4{
   font-size: 34px;
   margin-bottom: 15px;
}

.buttons-wrapper{
  padding-top: 0px;
}

.buttons-wrapper .btn-orange{
    width: 230px;
    margin: 15px 0px;
}

.footer{
    padding: 0px 0px 40px 0px;
    justify-content: space-between;
}

.footer h6{
    color: #FFF;
    font-size: 20px;
    text-transform: uppercase;
    margin-bottom: 20%;
}

.footer ul{
    list-style: none;
    padding-left: 0px;
}

.footer li{
    padding: 10px 0px;
}

.footer li a{
    color: #FFF;
    text-decoration: none;
    font-size: 16px;
}

.footer-bottom {
    margin: 0px auto;
    text-align: center;
    font-size: 13px;
    color: #FFF;
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: 10px;
}

.footer-bottom a{
    color: #FFF;
    text-decoration: none;
    font-size: 15px;
}

.footer-contact-form label{
    color: #fff;
}

.btn:hover{
    color: #FFF;
    background-color: #ff840000;
    
}
.btn-orange:hover{
    color: #FFF;
    background-color: #FF8500;
}

.animated-slide {
  animation: slideFade 1s ease-in-out;
}

.animated-text {
  animation: fadeInUp 1s ease-in-out;
}

@keyframes slideFade {
  from {
    opacity: 0;
    transform: translateX(50px);
  }
  to {
    opacity: 1;
    transform: translateX(0);
  }
}

@keyframes fadeInUp {
  from {
    opacity: 0;
    transform: translateY(40px);
  }
  to {
    opacity: 1;
    transform: translateY(0);
  }
}

.hero-carousel-content-text {
  animation: none !important;
  transform: none !important;
  opacity: 1 !important;
}

#sectionMainSlide .navbar.navbar-expand-lg{
  background: linear-gradient(to right, rgb(255 255 255 / 81%) 0%, rgba(0, 0, 0, 0.6) 60%, rgba(0, 0, 0, 0.8) 100%) !important;
  border-radius: 0px !important;
  padding: 0px !important;
}

.build-in-apps a{
  color: #000;
}

.build-in-apps a:hover{
  color: #000;
}

.hero-carousel-content-text h3{
  color: #FFF;
  font-size: 33px;
  font-weight: 400;
  width: 60%;
}

.animation-text .letter {
  display: inline-block;
  opacity: 0;
}

.testimonialSection-contoller-btns{
  position: relative;
  margin: auto;
  width: 10%;
  top: 65px;
}

.testimonialSection-contoller-btns {
  display: flex;
  justify-content: center; 
  gap: 20px; 
  margin-top: 0px; 
}

.testimonialSection-contoller-btns .carousel-control-prev,
.testimonialSection-contoller-btns .carousel-control-next {
  position: static; 
  width: auto;
  height: auto;
}

.testimonialsection-inner  p{
  font-size: 15px;
}

.testimonialsection-inner {
  display: flex;
  padding: 0px 30px 0px 0px;
}

.testimonial-img {
  flex: 0 0 50%;    
}

.testimonial-img img {
  width: 100%;      
  height: auto;     
  object-fit: cover; 
}

.testimonial-content {
  flex: 0 0 50%;    
  display: flex;
  flex-direction: column;
  justify-content: center; 
}

#carouselExample3 {
  direction: ltr !important;
}

#carouselExample3 .carousel-inner {
  direction: ltr !important;
}

#carouselExample3 .carousel-item {
  transition: transform 0.6s ease-in-out;
  float: left !important; 
}

#carouselExample3 .carousel-inner {
  display: flex !important;
  flex-direction: row !important;
  direction: ltr !important;
}

#carouselExample3 .carousel-item {
  float: none !important;
}

.dropdown-toggle::after{
  display: none !important;
}


.new-section {
  background-color: #04001D; /* or any background */
  color: #fff;
  padding: 20px 10px;
  min-height: 780px;
  
}

.laptop-wrapper {
  position: relative;
  width: 100%;          /* responsive */
  max-width: 670px;     /* match laptop mockup width */
  margin: 0px;
}

.laptop-frame {
  width: 100%;
  height: auto;
  display: block;
}

/* Position screen area based on ratios from 500x549 laptop */
.laptop-screens {
  position: absolute;
  top: 90px;    /* distance from top of frame */
  left: 15px;   /* distance from left of frame */
  width: 470px; /* actual screen width */
  height: 370px;/* actual screen height */
  overflow: hidden;
}

/* Make overlay responsive */
.laptop-screens {
  top: calc(19 / 549 * 100%);      /* 90px relative to 549px height */
  left: calc(0 / 500 * 100%);     /* 15px relative to 500px width */
  width: calc(483 / 500 * 100%);   /* 470px relative to 500px width */
  height: calc(370 / 549 * 100%);  /* 370px relative to 549px height */
}

.laptop-screens img {
  width: 100%;
  height: 100%;
  object-fit: cover;   /* Fill the screen nicely */
  display: block;
}

.carouselWrapper {
  display: flex;
  flex-direction: column;
  padding-right: 0px;
  padding-top: 90px;
}

#carouselHeading{
  color: #F5A623;
  /* font-family: Impact, Haettenschweiler, 'Arial Narrow Bold', sans-serif; */
  font-family: Impact, 'Anton', Haettenschweiler, 'Arial Narrow Bold', sans-serif;
  font-size: clamp(35px, 6vw, 80px);
  width: 75%;
}

#carouselText{
  color: #fff;
  font-size: clamp(25px, 6vw, 41px);
  width: 75%;
}

/*  */


@media (max-width: 575.98px) { 

  .main-logo {
    width: 60px;
  }

  nav .container-fluid{
    padding: 0px 10px;
  }

  #heroCarousel{
    height: 54vh;
    min-height: 400px;
  }

  #heroCarousel, #heroCarousel .carousel-item {
    height: 54vh;
    min-height: 400px;
  }

  .carouselBanner-text-new{
    top: 24%;
  }

  .carouselBanner-text-new h1 {
    margin-bottom: 6px;
  }

  h1 {
    font-size: clamp(48px, 6vw, 60px);
  }

  .carouselBanner-text-new p {
    width: 80%;
    font-size: 14px;
    margin-bottom: 13px;
  }

  .carouselBanner-text-new h5 {
    font-size: 13px;
  }

  .carouselBanner-text-new h5 img {
    width: 12px;
    height: 12px;
    margin-right: 8px;
  }

  #carouselText{
    width: 100%;
  }

  .carouselSection{
    display: none;
  }

  .container-fluid {
    padding: 60px 50px 60px 50px;
  } 

  .hero-carousel-static-div{
    width: 100%;
    top: 33px;
  }

  #Onesection{
    background-image: url(../images/hero-banner\ mobile.png);
    background-position: top center;
    padding: 160px 10px !important;
  }

  #fourth-section{
    position: relative;
    top: 134px;
  }

  #fourth-section h1, .app-subtitle{
    text-align: center;
  }

  .monetisation-section-blocks {
    padding-bottom: 10px;
  }

  .hero-carousel-static-div img {
    height: auto;
    width: 85%;
  }

  .hero-carousel-content img {
    width: 410px !important;
    height: auto !important;
  }

  .hero-carousel-content{
    display: block;
  }

  .hero-carousel-content-text{
    padding: 0px;
  }

  #carouselHeading{
    width: 100%;
  }

  .monetisation-section-blocks .col-12 img{
    width: 60px;
  }

  .content-block p {
    width: 100%;
  }

  .hero-carousel-content-icons-col{
    align-items: flex-start;
    margin-bottom: 20px;
  }

  .hero-carousel-content-icons-col img{
    width: 40%;
  }

  .hero-carousel-content-icons .col-12{
    padding-right: 0rem !important;
    padding-left: 0rem !important;
  }

  .hero-carousel-content-icons{
    margin-bottom: 0px;
  }

  .content-block h1{
    text-align: center;
  }

  .content-block h4, .content-block p{
    text-align: center;
  }

  .flexible-drag-and-drop-section .col-12 h1, .flexible-drag-and-drop-section .col-12 h4, .flexible-drag-and-drop-section .col-12 p{
    text-align: center;
  }

  .explore-btn{
    text-align: center;
  }
  
  #sectionFour{
    text-align: center;
    padding: 30px 0px;
    padding: 60px 0px 60px 0px;
  }

  .howitworks-text-section{
    width: 100%;
  }

  .featureImageSection{
    padding: 30px 20px;
  }

  .new-section{
    min-height: 600px;
  }

  .carouselWrapper {
    padding-top: 0px;
  }

  .getup-Inner-section img {
    margin-top: 10px;
    width: 25%;
    margin-bottom: 13px !important;
  }

  .getupSection {
    margin-bottom: 0px !important;
  }

  #howitworks-Left{
    padding: 0px 50px 30px 50px;
  }

  .testimonial-content{
    text-align: center;
  }

  .testimonialsection-inner .testimonial-img {
    width: 100%;
  }

  .testimonialsection-inner {
    padding: 0px 0px 0px 0px;
  }

  #Thirdsection{
    background-image: url(../images/image\ 145-min-mobile.png);
    background-position: 74% 0%;
    background-attachment: scroll;
  }

  #Forthsection{
    background-position: 46% 0%;
    background-attachment: scroll;
  }

  #Fifthsection{
    background-image: url(../images/image\ 5-min-mobile.png);
    background-position: 72% 0%;
    background-attachment: scroll;
  }

  .nav-item.build-in-apps, .nav-item.sign-in{
    margin-bottom: 10px;
  }

  .navbar-nav .nav-link{
    color: #000!important;
  }

  .navbar-collapse{
    background-color:#ffffffc9;
    padding: 10px 4px;
  }

 .corporate-sme-personal-solutions-col{
  margin-bottom: 30px;
  }

  .hero-carousel-content-icons p {
    margin-bottom: 10px;
  }

  .hero-carousel-content-icons .basic-crm{
    margin-bottom: 10PX;
  }

  .hero-carousel-content-icons h4{
    margin-bottom: 10px;
  }

  .testimonialSection-contoller-btns{
    top: 24px;
  }

  .getup-Inner-section.discover{
    margin-bottom: 30px;
  }

  .messaging-col{
    margin-bottom: 0px !important;
  }

  #Fifthsection .hero-carousel-content-icons{
    margin-bottom: 20px;
  }

  #Fifthsection .hero-carousel-content-icons .col-12{
    margin-bottom: 20px;
  }

  .customisable-col{
    margin-bottom: 0px !important;
  }

}

@media (max-width: 360px){
    h1 {
        font-size: clamp(38px, 6vw, 60px);
    }
}


@media (min-width: 576px) and (max-width: 767.98px)  { 

  .container-fluid {
    padding: 30px 10px;
  }  

  #Onesection{
    padding: 30px 10px !important;
  }

  .main-logo{
    width: 60px;
  }

  #heroCarousel,
  #heroCarousel .carousel-item {
    height: 70vh; 
  }

  .carouselBanner-text-new p {
    width: 100%;
  }

  /* .carouselSection-contoller-btns {
    position: absolute;
    left: 0px;
    right: 0px;
    bottom: -6%;
  } */

   #sectionOne{
    height: auto;
  }

   #carouselBanner{
    margin-bottom: 10px;
    height: 450px;
  }
   
   #sectionTwo {
    height: auto;
   }

   .hero-carousel {
    padding: 0px 0px;
   }  

   .carouselBanner-text{
     width: 100% !important;
     top: 16%;
     left: 3%;
    }

    /* h1 {
     font-size: 57px;
    } */

    .carouselBanner-text h2 {
     font-size: 30px;
    }  

   .carouselBanner-text h1 {
    font-size: 48px;
    margin-bottom: 10px;
    line-height: 56px;
   }

   .carouselBanner-text h5 {
    font-size: 22px;
   }
 
   .hero-carousel-static-div {
    position: absolute;
    width: 100%;
    top: -13px;
    } 
    
    .hero-carousel-content-text p{
      width: 100%;
    }

    .content-block p{
      width: 100%;
    }

    /* .hero-carousel-content-text {
    padding: 0px 20px;
    top: 95px;
    position: relative;
    } */

    .header-large {
    font-size: 65px;
    }

    .btn-orange {
    padding: 5px 30px;
    }

    .hero-carousel-content img{
      width: auto !important;
      height: 264px !important;
    }

    .hero-carousel-static-div img{
      width: 349px;
      height: 388px;
    }

    .hero-carousel-content {
      display: block;
      align-items: center;
    }

    #carouselBanner .carousel-inner , #carouselExample .carousel-inner {
      padding: 10px;
      width: 100%;
    }

    .carouselSection .carousel.slide , .carouselSection .carousel.text{
      width: 100%;
    }

    .testimonialsection-inner{
      display: block !important;
    }

    .poweringAppsSection-container-fluid{
     padding: 16% 10px;
    }

    .powering-apps-left , .powering-apps-right{
      padding-left: 0px;
    }

    .powering-apps-left{
      padding: 0px 20px;
    }

   .poweringAppsSection h2 {
     font-size: 57px;
     color: #FFF;
   }

   .powering-apps-right {
     height: 420px;
     width: 100% !important;
     padding-top: 0%;
   }

   .img-dance-chid {
      position: relative;
      top: 80px;
      z-index: 4;
      left: 0px;
      right: 0px;
      width: 60%;
      margin: 0 auto;
   }

   .img-mobile-phone {
     position: relative;
     top: -185px;
     left: 0px;
     width: 60%;
     margin: 0 auto;
   }

    #howitworks-Left {
     padding-left: 20px;
     padding-right: 20px;
    }

    .testimonial-slider .carousel-inner{
    border: none;
   }

    #sectionFive{
      padding: 10px;
    }

    #sectionSix{
      display: block;
      height: auto;
      padding: 10px 20px;
    }

    .getup-Inner-section {
      margin-bottom: 20px;
      padding: 5px 0px;
    }

    .testimonialsection-inner .testimonial-comment, .testimonialsection-inner .testimonial-img{
      width: 100%;
      margin-bottom: 40px;
    }

    .testimonialsection-inner .testimonial-img img{
      width: 70%;
      margin: auto;
    }

    .featureImageSection{
      padding: 20px 0px;
    }

    .featureImg_left img {
      width: 100%;
    }

    .footer h6 {
      margin-bottom: 10%;
    }

    .howitworks-text-section {
      padding: 20px 0px;
      width: 100%;
    }   

    #howitworks-Left h4{
      text-align: center;  
    }

   .laptop-screen {
     max-width: 95%;
   }

    .animated-gif-img {
      top: 5%;
      left: 21%;
      width: 80%;
    }

    .nav-item.build-in-apps, .nav-item.sign-in{
      margin-bottom: 15px;
    }

    .navbar.navbar-expand-lg{
      border-radius: 45px;
      padding: 0px 15px;
    }

    .footer {
      padding: 6% 0px;
    }

    .footer-bottom{
      bottom: 4px;
    }
}

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

@media (min-width: 768px) and (max-width: 991.98px) { 
  
  .container-fluid {
    padding: 30px 70px;
  } 

  .carouselBanner-text-new{
    top: 25%;
  }

  .hero-carousel-static-div img{
    width: 500px;
    height: auto;
  }

  .howitWorksSection {
    flex-direction: row; 
  }

  .hero-carousel-static-div img {
    width: 504px;
    height: auto;
  }

  #howitworks-Left,
  #howitworks {
    width: 50%;
  }

  .howitworks-text-section{
    width: 80%;
  }

  #Onesection{
    padding: 160px 20px !important;
  }

  .btn-orange {
    padding: 5px 13px;
  }

}

@media (min-width: 992px) and (max-width: 1199.98px) {

  .container-fluid {
    padding: 90px 70px;
  }

  .howitWorksSection {
    flex-direction: row; 
  }

  #Onesection{
    padding: 160px 20px !important;
  }

  #howitworks-Left,
  #howitworks {
    width: 50%;
  }

  .howitworks-text-section{
    width: 80%;
  }

  .nav-item .nav-link {
    padding-right: 10px !important;
    padding-left: 10px !important;
  }

  .btn-orange {
    padding: 5px 30px;
   }



}

 @media (min-width: 1200px) and (max-width: 1399.98px){
    .poweringAppsSection {
        min-height: 100vh;
    }
    #carouselBanner {
    padding: 3% 0%;
   } 
   .carouselBanner-text {
        top: 12%;
    }
   .powering-apps-right {
        height: 67vh;
    }
    .img-mobile-phone {
        top: -264px;
    }
}

/*Media Queries for iPad Mini*/
@media only screen and (min-width: 768px) and (max-width: 991.98px) and (orientation: portrait) {
  
   .carouselBanner-text{
    top: 5%;
    width: 100% !important;
   }

   #carouselBanner{
     height: 553px;
   }

  .powering-apps-right {
    height: 370px;
  }

  .powering-apps-left, .powering-apps-right {
    height: 800px;
    padding-left: 7%;
  }

  .hero-carousel-content {
    display: block;
    height: 1160px;
  }

  .howitworks-text-section {
    padding: 20px 0 0 0;
    width: 100%;
  }

  .poweringAppsSection{
    background-image: none;
  }

  .howitWorksSection{
    padding-top: 20%;
  }

  .img-dance-chid{
    position: relative;
    top: -9px;
    z-index: 3;
    left: -50px;
    width: 100% !important;
  }

  .hero-carousel-static-div {
   min-height: 730px !important;
   height: 730px !important;
   width: 100%;
  }

  .img-mobile-phone{
    position: relative;
    top: -153px;
    width: 100% !important;
    right: 20px;   
  }

  .hero-carousel-content img {
    width: 718px !important;
    height: 497px !important;
  }

  .hero-carousel-content-text {
    padding: 0px 50px;
    top: 253px;
    position: relative;
   }

   .hero-carousel-static-div img {
    width: 748px;
    height: 729px;
  }

  .testimonial-slider .carousel-inner{
    padding: 40px 40px;
  }   

  .featureImg_left {
    padding: 20px;
    width: 50% !important;
    display: flex;
    place-content: center;
  }

  .nav-item.build-in-apps, .nav-item.sign-in{
    margin-bottom: 15px;
  }

}

/*Media Queries for iPad Mini*/
@media only screen and (min-width: 992px) and (max-width: 1024px) and (orientation: landscape) {

    .hero-carousel-static-div {
     position: absolute;
     width: 50%;
     top: 73px;
    }

    .hero-carousel-static-div img {
     width: 489px;
     height: 563px;
    }

    .hero-carousel-content img {
     width: 519px !important;
     height: auto !important;
    }

    .powering-apps-right {
     height: 650px;
    }

    .howitworks-text-section {
     padding: 20px 0px;
     width: 90%;
    }

    .new-section {
     min-height: 700px;
    }

    /* .carouselSection-contoller-btns {
     position: absolute;
     left: 70%;
     right: 0px;
     bottom: 10%;
     top: 118%;
    } */

}

 /* Styles for iPad portrait */
@media only screen and (min-width: 768px) and (max-width: 1024px) and (orientation: portrait) {

  #sectionOne, #sectionTwo, #sectionThree, #sectionFour, #sectionFive{
    height: auto;
  }

  #sectionTwo {
    margin-bottom: 0%;
  }

  #carouselBanner {
    height: 453px;
  }
 
  .carouselBanner-text {
    top: 15%;
    width: 50% !important;
  }

  .carouselBanner-text h2 {
     font-size: 1.813rem;
  }

  .carouselBanner-text h1 {
      font-size: 65px;
  }

  .carouselBanner-text h5 {
      font-size: 20px;
  }

  .hero-carousel-static-div {
    min-height: 668px !important;
    height: 642px !important;
   }

  .powering-apps-right {
      height: 550px;
      padding-left: 1%;
  }

  .powering-apps-left{
    height: auto;
    padding-left: 5%;
  }

  .poweringAppsSection h2 {
     font-size: 56px;
  }

  .img-dance-chid {
     width: 86% !important;
     top: 7px;
  }

  .img-mobile-phone{
     width: 86% !important;
  }

  .howitWorksSection {
     padding-top: 5%;
     padding-bottom: 5%;
  }


}

/* CSS for iPad Air 4 portrait */
@media screen and (width: 820px) and (height: 1180px) {

  #sectionOne, #sectionTwo , #sectionSix , #sectionFour, #sectionFive, #sectionThree{
    height: auto;
  }

  .carouselBanner-text h2 {
    color: #F5A623;
    font-size: 26px;
  }
 
  .carouselBanner-text h1 {
    font-size: 58px !important;
    line-height: 59px;
  }

  .carouselBanner-text h5 {
    font-size: 22px;
  }

  #carouselBanner .carousel-inner{
    padding: 50px 0px 20px 0px !important;
  }  

  #carouselBanner{
     height: auto;
     padding: 10% 0px 10% 0px !important;
  }
  
  .carouselBanner-text {
    top: 5%;
    width: 59% !important;
  } 
  
  .poweringAppsSection {
     min-height: 80vh !important;
  }

  .btn-orange {
    padding: 5px 20px;
  }

}

/* CSS for iPad Air 4 landscape */
@media screen and (min-width: 1180px) and (max-width: 1190px) and (min-height: 820px) and (max-height: 830px) and (orientation: landscape) {

  #carouselBanner {
    padding: 13% 0px 13% 0px !important;
    
  }

 #carouselBanner .carousel-inner{
    padding: 0px 0px 0px 32px;
    width: 90%;
 }   

 #sectionTwo {
    margin-bottom: 3%;
 }

 /* .hero-carousel-content-text {
    padding: 0px 20px;
 } */

 .hero-carousel-static-div img {
    width: 658px;
    height: 783px;
  }

 .hero-carousel-content img {
    width: 630px !important;
    height: 508px !important;
 }

 .img-dance-chid {
    position: relative;
    top: 79px;
    z-index: 4;
    left: -65px;
  }

  .img-mobile-phone {
    position: relative;
    top: -220px !important;
  }

 .header-large {
    font-size: 80px;
 }

 .testimonial-slider .carousel-inner{
   padding: 55px 50px;
   width: 85%;
 }

 #carouselBanner{
    margin-bottom: 20px;
    margin-top: 20px;
 }

 .howitworks-text-section {
    padding: 20px 0px;
    width: 90%;
 }

}

/* 13-inch MacBook Pro */
@media only screen and (min-width: 1280px) and (max-width: 1280px) {
  
    .poweringAppsSection{
      min-height: 130vh; 
    }
}

/*MacBook Pro 15" Retina */
@media only screen and (min-width: 1440px) and (max-width: 1440px){

  .main-logo {
    width: 83px;
  }

  .carouselBanner-text-new {
    top: 22%;
  }

  .new-section {
    height: 80vh;
  }

  .howitWorksSection {
    flex-direction: row;
  }

  .carouselBanner-text {
    top: 27%;
    width: 45% !important;
  }

  #carouselBanner .carousel-inner{
    padding: 3% 0%;
  }

  #carouselBanner .carousel-inner {
    width: 100%;
  }

  .hero-carousel-static-div img {
    width: 684px;
    height: auto;
  }

  .hero-carousel-content img {
    width: 660px !important;
    height: auto !important;
  }

  .powering-apps-right{
    height: 65vh;
  }

  .testimonial-slider .carousel-inner{
    padding: 75px 100px;
  }

  .getupSection {
    margin-bottom: 70px;
  }

  .featureImg_right {
    padding: 40px 20px;
  }

}

@media (max-width: 1440px){

  .carouselBanner-text{
    top: 15%;
    width: 45% !important;
  }

  .carouselBanner-text h1 {
    font-size: 73px;
    line-height: 77px;
  }

  .carouselBanner-text h5 {
    font-size: 24px;
  }

  .hero-carousel-static-div {
    top: 27px;
  }

  /* .hero-carousel-static-div img {
    width: 584px;
    height: auto;
  } */

  .hero-carousel-content img {
    width: 560px ;
    height: auto ;
  }

  .powering-apps-right {
    height: 85vh;
  }

  .getup-Inner-section h2 {
    font-size: 38px;
  }

  .poweringAppsSection h2 {
    font-size: 65px;
  }

  .header-large {
    font-size: 80px;
  }

  .img-mobile-phone {
    top: -298px;
  }

  .testimonialSection{
    max-width: 1140px;
  }

  .getupSection{
    margin-bottom: 30px;
  }

  .laptop-screen {
    max-width: 582px;
  }

}

@media (min-width: 1441px) {

  .howitWorksSection{
    padding-top: 0px;
  }

  .howitWorksSection {
        flex-direction: row;
  }

}

/* 14-inch MacBook Pro */
@media only screen and (min-width: 1512px) and (max-width: 1512px) {

    #carouselBanner .carousel-inner {
      width: 100%;
    }

    .new-section {
      height: 80vh;
    }

    .carouselBanner-text-new {
      top: 24%;
    }

    #carouselBanner{
      padding-top: 100px;
      margin-bottom: 0%;
    }

    .carouselBanner-text{
      top: 30%;
    }

    #sectionTwo{
      margin-bottom: 0%;
    }

    .img-dance-chid {
      top: 0px;
    }

    .img-mobile-phone {
      top: -353px;
    }

    .powering-apps-right {
      height: 67vh;
    }

    .testimonial-slider .carousel-inner {
      padding: 65px 100px;
    }

    .howitworks-blocks {
     padding: 30px 0px 0px 0px;
    }

    #howitworks-Left h4 {
     font-size: 42px;
    }
    
    .testimonialsection-inner h4 {
     font-size: 42px;
    }

    .laptop-screen {
     max-width: 735px;
    }

    .poweringAppsSection{
      background-image: url(../images/poweringappsection_bg_img.png);
      min-height: 100vh;
      padding: 0px;
      /* border: 3px solid red; */
    }

    .getup-Inner-section img {
      width: 19%;
    }

    .featureImageSection{
      padding: 3% 0%;
    }

    .featureImg_left img {
      width: 100%;
    }
}

/* 16-inch MacBook Pro */
@media only screen and (min-width: 1728px) and (max-width: 1728px) {
  
   .getupSection{
     max-width: 1440px;
   }

   .carouselBanner-text-new{
    top: 27%;
   }

   .new-section {
    height: 70vh;
   }

    #carouselBanner .carousel-inner {
      width: 100%;
    }

    #carouselBanner{
      padding-top: 100px;
      margin-bottom: 0%;
    }

    .carouselBanner-text{
      top: 30%;
    }

    #sectionTwo{
      margin-bottom: 0%;
    }

    .img-dance-chid {
      top: 36px;
      width: 70% !important;
    }

    .img-mobile-phone {
      top: -480px;
      width: 70% !important;
    }

    .testimonial-slider .carousel-inner {
      padding: 100px 100px;
    }

    .howitworks-blocks {
     padding: 30px 0px 0px 0px;
    }

    #howitworks-Left h4 {
     font-size: 42px;
    }
    
    .testimonialsection-inner h4 {
     font-size: 42px;
    }

    .laptop-screen {
     max-width: 735px;
    }

    /* h1 {
     font-size: 67px;
    } */

    .poweringAppsSection{
      background-image: url(../images/poweringappsection_bg_img.png);
      min-height: 100vh;
      padding: 0px;
      /* border: 3px solid red; */
    }

    .powering-apps-right {
      height: 799px;
    }

    .getupSection{
      margin-bottom: 100px;
    }

    .getup-Inner-section img {
     width: 19%;
    }

    .featureImageSection{
      padding: 3% 0%;
    }

    .featureImg_left img {
      width: 100%;
    }

    .hero-carousel-static-div img {
      width: 798px;
      height: auto;
    }

    .hero-carousel-content img {
      width: 769px !important;
      height: 576px !important;
    }

}

@media (min-width: 1600px) {

  .howitWorksSection{
    padding-top: 30px;
  }

  .carouselBanner-text-new {
    top: 28%;
  }

  .new-section{
    height: 75vh;
  }

  #Onesection{
    padding: 200px 120px !important;
  }

  .img-mobile-phone {
    position: relative;
    top: -450px;
  }

  .powering-apps-right {
    height: 60vh;
  }

  .img-dance-chid {
    position: relative;
    top: 0px;
    z-index: 4;
    left: -15px;
    width: 61% !important;
  }

  .img-mobile-phone {
    width: 61% !important;
  }

}

@media screen and (min-width: 1800px) {
 
  #carouselBanner{
    padding: 0px 0px;
    height: 100%;
  }

  .carouselBanner-text{
    top: 27%;
  }

  .header-large {
    font-size: 94px;
  }

  .img-mobile-phone {
    position: relative;
    top: -499px !important;
  }
  
  #carouselBanner .carousel-inner{
    padding: 0px 0px 0px 0px;
    width: 100%;
  }

  .hero-carousel-static-div img {
    width: 945px;
    height: auto;
  }

  .hero-carousel-content img {
    width: 907px !important;
    height: auto !important;
  }

  .laptop-screen {
    max-width: 805px;
  }

  .getupSection{
    margin-bottom: 90px;
  }

  .featureImageSection{
    padding: 30px 0px;
  }

}

@media (min-width: 2560px) {
    .laptop-wrapper{
      max-width: 715px !important;
    }
}

@media (min-width: 1920px) {
    .poweringAppsSection{
      min-height: 100vh;
    }

    .new-section {
      height: 85vh;
    }

    .laptop-wrapper{
      max-width: 970px;
    }

}

@media (min-width: 1919px) {
    .laptop-wrapper{
      max-width: 730px !important;
    }
}

@media screen and (min-width: 1920px) and (-webkit-min-device-pixel-ratio: 2) {
  /* Large Retina Mac displays only */
  #carouselBanner{
    padding: 60px 0px 60px 0px;
  }
  
  #carouselBanner .carousel-inner{
    padding: 60px 0px 0px 0px;
    width: 100%;
  }

}

@media (min-width: 2560px){

  #carouselBanner{
    padding: 60px 0px 60px 0px;
  }
  
  #carouselBanner .carousel-inner{
    padding: 60px 0px 0px 0px;
    width: 100%;
  }
  
}



@media (min-width: 768px) {
  #testimonialCarousel .carousel-item .row > [class*="col-"] {
    flex: 0 0 50%;
    max-width: 50%;
  }
}