/* start css for prevent page moving right, left */
html, body {width: auto!important; overflow-x: hidden!important}
/* end css for prevent page moving right, left */
/* frequently ask question css start  */
.faq {

    background-color: #ffffff;
}
/* frequently ask question css end  */

/* start css for banner image */

.hero-area .hero-image img {
    width:unset !important;
}
/* end css for banner image */

/* feature section css start*/
.freatures .image img {
    padding: 0px 136px 0px 136px;
    transform: rotate(345deg);
}

@media only screen and (min-width: 992px) and (max-width: 1200px) {
    .freatures .image img {
    padding: 0px 60px 0px 60px;

}
    }

/* feature section css end */

/* start Why Ads Calendar cards section */
.services .single-service {
    min-height: 330px;
}
/* end Why Ads Calendar cards section */

/* Start css for Pricing-Table */
.table-heights{
min-height: 180px;
}
/* End css for Pricing-Table */

/* Start css for Accept/ Deny Cookies */
.cookies {
    grid-column-gap: 1rem;
    grid-row-gap: 1rem;

    flex-direction: column;
    /* align-items: flex-start; */
    width: 100%;
    max-width: 25.375rem;
    /* padding: 1rem; */
    display: flex;
    position: fixed;

    opacity: 1;
    display:flex;
    max-width: 450px;
      justify-content: end;
      align-items: center;
      padding: 20px;
      display: none;
      text-align: center;
      top: 0;
      left: 0;
      width: 100%;
      height: 100%;
      z-index: 9999;
      inset: auto 1rem 1rem ;
  }
  .cookie-content {
      display: flex;
      flex-direction: column;
      align-items: center;
      gap: 5px;
      max-width: 600px;
      width: 100%;
       background: white;
      padding: 20px;
      border-radius: 8px;

  }
  .image-text {
      display: flex;
      align-items: center;
      gap: 16px;
      text-align: left;
      flex-wrap: wrap;

  }

  .image-text img {
      width: 100px;
      height: auto;
      flex-shrink: 0;
  }

  .image-text p {
      flex: 1;
      margin: 0;
  }




  .body-14 {
      font-size: .875rem;
      font-weight: 400;
      line-height: 135.714%;
      flex: 1;
  }

  .button-holder.gap-8 {
      grid-column-gap: .5rem;
      grid-row-gap: .5rem;
      justify-content: flex-start;
  }

  .button-holder {

      flex-direction: row;
      margin-top: 16px;
      align-items: stretch;
      display: flex;
      margin-left: 71px;
      gap: 8px;
      justify-content: center;
      flex-wrap: wrap;
  }
  .btn-secondary-small {
      border-radius: 10px;
      background-color: #2ed06e;
      color: white;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: .75rem 1.25rem;
      text-decoration: none;
      transition: background-color .25s;
      display: flex;

  }
  .w-inline-block {
      max-width: 100%;

  }
  .btn-outline-small:hover {
      border-color: #2ed06e;
  }
  .btn-outline-small {
      border-radius: 10px;
      color: black;
      background-color: #5423e700;
      border: 1px solid #0003;
      flex-direction: column;
      justify-content: center;
      align-items: center;
      padding: .75rem 1.25rem;
      text-decoration: none;
      transition: border .25s;
      display: flex
  ;
  }
  .w-inline-block {
      max-width: 100% !important;

  }
  /* End css for Accept/ Deny Cookies */


/* Start CSS for right side bottom green scroll icon */
.scroll-top {
    bottom: 130px;
}
/* End CSS for right side bottom green scroll icon */

/* Start CSS for Testmonial Cards  */
.testimonials .single-testimonial {
    min-height: 354px;
}
.paratext{
    min-height: 281px;
}
.testimonials .single-testimonial .quote-icon i {

    bottom: 40px;
}

@media only screen and (min-width: 768px) and (max-width: 992px) {
    .testimonials .single-testimonial {
    min-height: 410px;
}
.paratext {
    min-height: 252px;
}
    }

/* End CSS for Testmonial Cards */

@media only screen and (min-width: 280px) and (max-width: 480px) {
    .cookies {
    inset: auto 0rem 6rem !important;
    }

    .freatures .image img {
        padding: 0px 72px 0px 82px;

    }
    .button-holder {

        margin-left: 0px;

    }

}


/* Start CSS for redesign of home page */
.floating-container {

    position: relative;
    width: 610px;
    height: 460px;
    overflow: hidden;
  }

  .floating-image {
    position: absolute;

    border-radius: 10px;

    animation: float 4s infinite ease-in-out, zoom 6s infinite ease-in-out;
  }

  /* Custom positions for images */
  .img1 {
      width: 110px;
    top: 20%;
    left: 0%;
    z-index: 1;
    animation-delay: 0s, 0s;
  }
  .img2 {
      /* height: 50vh; */
      width: 400px;
    top: 20%;
    left: 20%;
    z-index: 3;
    animation-delay: 1s, 1s;
    border-radius: 20px;

  }
  .img3 {
      width: 180px;
      /* height: 29vh; */
      bottom: 4%;
    left: 0%;
    z-index: 4;
    animation-delay: 2s, 2s;
  }
  .img4 {
      width: 15vw;
      height: 100px;
    top: 25%;
    right: 0%;
    z-index: 2;
    animation-delay: 3s, 3s;
  }

  /* Floating animation */
  @keyframes float {
    0%, 100% {
      transform: translateY(0);
    }
    50% {
      transform: translateY(-10px);
    }
  }


/* End CSS for redesign of home page */

/* start CSS for watch video section background moving images by AC*/


.intro-video-area {
    position: relative;
    overflow: hidden;
    height: 100vh;

}

.imgdiv{
    position: absolute;
    top: 0;
    left: 0;
    right: 0;
    bottom: 0;
    z-index: 0;
}

.marquee{
    display: flex;
    flex-direction: row;
    animation: marquee 30s linear infinite;
    margin: 7px 0px 7px 0px;
}

.marquee.reverse {
    animation: marqueeReverse 30s linear infinite;
}

.marquee-track {
    display: flex;

}

.marquee img{
    margin: 0.25rem;
    height: 25vh;
   border-radius: 10px;

}

.intro-video-area::before {
  position: absolute;
  content: "";
  left: 0;
  bottom: 0;
  height: 20vh;
  width: 100%;
  background-color: #F4F7FA;
  z-index: 99;
}
@keyframes marquee {
    0% {
        transform: translateX(0);
    }
    100% {
        transform: translateX(-50%);
    }
}

@keyframes marqueeReverse {
    0% {
        transform: translateX(-50%);
    }
    100% {
        transform: translateX(0);
    }
}


@media only screen and (width: 3840px) and (height: 2160px){
    .intro-video-area {
        height:42vh;
    }
    .marquee img {
        height: 12vh;
    }


}
@media only screen and (width: 3200px) and (height: 1800px){
    .intro-video-area {
        height:49vh;
    }
    .marquee img {
        height: 16vh;
    }


}



@media only screen and (width: 1920px) and (height: 1080px){
    .intro-video-area {
        height:70vh;
    }
    .marquee img {
        height:15vh;
    }

}



@media only screen  and (width: 1440px) and (width: 1920px) and (height: 867px) and (height: 900px){
    .intro-video-area {
        height:80vh;
    }
    .marquee img {
        height:19vh;
    }
}


@media only screen and  (max-width: 470px){
    .xyz{
        display: none;
    }
    .hero-area{
        background-image: linear-gradient(135deg, transparent 0%, transparent 13%,rgba(87, 146, 234,0.6) 13%, rgba(87, 146, 234,0.6) 58%,transparent 58%, transparent 65%,rgba(34, 81, 222,0.6) 64%, rgba(34, 81, 222,0.6) 100%),linear-gradient(45deg, transparent 0%, transparent 2%,rgb(87, 146, 234) 2%, rgb(87, 146, 234) 46%,rgb(114, 178, 239) 74%, rgb(114, 178, 239) 54%,transparent 54%, transparent 83%,rgb(7, 48, 216) 63%, rgb(7, 48, 216) 100%),linear-gradient(90deg, rgb(255,255,255),rgb(255,255,255));
    }
}
@media only screen and  (max-width: 767px) {
    .intro-video-area {
        height: 60vh;
    }
    .marquee img {
        height: 11vh;
    }
    .xyz{
        display: none;
    }
    .hero-area{
        background-image: linear-gradient(135deg, transparent 0%, transparent 17%,rgba(87, 146, 234,0.6) 17%, rgba(87, 146, 234,0.6) 59%,transparent 59%, transparent 64%,rgba(34, 81, 222,0.6) 64%, rgba(34, 81, 222,0.6) 100%),linear-gradient(45deg, transparent 0%, transparent 2%,rgb(87, 146, 234) 2%, rgb(87, 146, 234) 46%,rgb(114, 178, 239) 68%, rgb(114, 178, 239) 54%,transparent 54%, transparent 76%,rgb(7, 48, 216) 63%, rgb(7, 48, 216) 100%),linear-gradient(90deg, rgb(255,255,255),rgb(255,255,255));
    }

}
@media only screen and (min-width: 768px) and (max-width: 991px) {
    .intro-video-area {
        height: 69vh;
    }
    .marquee img {
        height: 14vh;
    }
    .xyz{
        display: none;
    }
    .hero-area{

        background-image: linear-gradient(135deg, transparent 0%, transparent 17%,rgba(87, 146, 234,0.6) 17%, rgba(87, 146, 234,0.6) 59%,transparent 59%, transparent 64%,rgba(34, 81, 222,0.6) 64%, rgba(34, 81, 222,0.6) 100%),linear-gradient(45deg, transparent 0%, transparent 2%,rgb(87, 146, 234) 2%, rgb(87, 146, 234) 46%,rgb(114, 178, 239) 68%, rgb(114, 178, 239) 54%,transparent 54%, transparent 76%,rgb(7, 48, 216) 63%, rgb(7, 48, 216) 100%),linear-gradient(90deg, rgb(255,255,255),rgb(255,255,255));
    }

}

@media only screen and (min-width: 992px) and (max-width: 1199px) {
    .intro-video-area {
        height: 95vh;
    }
    .marquee img {
        height: 23vh;
    }
}



@media only screen and (min-width: 1864px) and (max-width: 1865px) {
    .intro-video-area {
        height:100vh;
    }
    .marquee img {
        height:20vh;
    }
}

@media only screen and (min-width: 2048px) and (max-width: 2560px)  {
    .intro-video-area {
        height: 60vh;
    }
    .marquee img {
        height: 19vh;
    }

}

/* Specific Landscape Orientation Queries */
@media screen and (width: 667px) and (height: 375px) and (orientation: landscape) {
    .intro-video-area {
        height: 120vh;
    }
    .marquee img {
        height: 28vh;
    }
}

@media screen and (width: 720px) and (height: 540px) and (orientation: landscape) {
    .intro-video-area {
        height: 83vh;
    }
    .marquee img {
        height: 18vh;
    }
}

@media screen and (width: 740px) and (height: 360px) and (orientation: landscape) {
    .intro-video-area {
        height: 125vh;
    }
    .marquee img {
        height: 30vh;
    }
}

@media screen and (width: 844px) and (height: 390px) and (orientation: landscape) {
    .intro-video-area {
        height: 140vh;
    }
    .marquee img {
        height: 35vh;
    }
}

@media screen and (width: 882px) and (height: 344px) and (orientation: landscape) {
    .intro-video-area {
        height: 163vh;
    }
    .intro-video-area::before{
        height: 40vh;
    }
    .marquee img {
        height: 36vh;
    }

}
@media screen and (width: 896px) and (height: 414px) and (orientation: landscape) {
    .intro-video-area {
        height: 133vh;
    }
    .intro-video-area::before{
        height: 40vh;
    }
    .marquee img {
        height: 27vh;
    }

}

@media screen and (width: 914px) and (width: 915px) and (height: 412px) and (orientation: landscape) {
    .intro-video-area {
        height: 133vh;
    }
    .marquee img {
        height: 33vh;
    }
}



@media screen and (width: 932px) and (width: 1024px) and (height: 430px) and (height: 600px) and (orientation: landscape) {
    .intro-video-area {
        height: 128vh;
    }
    .marquee img {
        height: 32vh;
    }
}


@media screen and (width: 1024px) and (height: 768px) and (orientation: landscape) {
    .intro-video-area {
        height: 100vh;
    }
    .marquee img {
        height: 24vh;
    }
}

@media screen and (width: 1280px) and (height: 800px) and (orientation: landscape) {
    .intro-video-area {
        height: 87vh;
    }
    .marquee img {
        height: 20vh;
    }
}
@media screen and (width: 1280px) and (height: 853px) and (orientation: landscape) {
    .intro-video-area {
        height: 83vh;
    }
    .marquee img {
        height: 19vh;
    }
}

@media screen and (width: 1366px) and (height: 1024px) and (orientation: landscape) {
    .intro-video-area {
        height: 70vh;
    }
    .marquee img {
        height: 15vh;
    }
}

@media screen and (width: 1368px) and (height: 912px) and (orientation: landscape) {
    .intro-video-area {
        height: 80vh;
    }
    .marquee img {
        height: 18vh;
    }
}

/*End CSS for watch video section background moving images */

/* Start Css for Product Hunt Section */

.cardborder{
  border: 2px solid #2ed06e;
}
.huntcss{
color: #2ed06e;
}
/* End Css for Product Hunt Section */

/* Start css for Testimonial uknown stop btn hide*/

.tns-outer [aria-controls],.tns-outer [data-action] {
    cursor: pointer;
    display: none;
}

/* End css for Testimonial uknown stop btn hide*/

/* Start css for download our app section*/

.call-action {
    background-color: #F4F7FA;
}

/* End css for download our app section*/