@import url("https://fonts.googleapis.com/css2?family=Inter:wght@100;200;300;400;500;600;700;800;900&family=Poppins:ital,wght@0,100;0,200;0,300;0,400;0,600;0,700;0,800;0,900;1,300;1,400;1,700&display=swap");

body {
  background-color: black;
  color: black;
}
* {
  color: white !important;
}

* {
  margin: 0px;
  padding: 0px;
}
.navbar-toggler .navbar-toggler-icon {
  background-image: url("data:image/svg+xml,%3csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 30 30'%3e%3cpath stroke='rgba%28255, 255, 255, 1%29' stroke-linecap='round' stroke-miterlimit='10' stroke-width='2' d='M4 7h22M4 15h22M4 23h22'/%3e%3c/svg%3e");
}

.navbar-brand {
  color: #fff;
  font-family: Poppins;
  font-size: 18px;
  font-style: normal;
  font-weight: 600;
  line-height: 22px; /* 122.222% */
  letter-spacing: 1px;
}

.navItems li {
  color: #fff;
  font-family: Poppins;
  font-size: 12px;
  font-style: normal;
  font-weight: 400;
  line-height: 12px; /* 100% */
  letter-spacing: 1.5px;
}

.bgDark {
  background-color: black;
}
.section1 {
  color: #fff;
}

.thenewContainer {
  border-radius: 200px;
  background: rgba(255, 255, 255, 0.1);
  width: fit-content;
}

.NEW {
  width: 46px;
  height: 26px;
  border-radius: 200px;
  background: #25ab75;

  color: #fff;
  font-family: Poppins;
  font-size: 10px;
  font-style: normal;
  font-weight: 600;
  line-height: 18px; /* 180% */
  letter-spacing: 1.5px;

}
.NEW p {
  
  margin-left: 5px;
}
.left {
  z-index: 1;
}
.left h1 {
  color: #fff;
  font-family: Poppins;
  font-size: 200px;
  font-style: normal;
  font-weight: 600;
  line-height: 170px; /* 85% */
  letter-spacing: -2px;
}

.left p {
  color: #fff;
  font-family: Poppins;
  font-size: 16px;
  font-style: normal;
  font-weight: 400;
  line-height: 29px; /* 181.25% */
  letter-spacing: 0.5px;
}

.btnStarted {
  padding: 14px 43px;
  justify-content: center;
  align-items: center;
  gap: 10px;

  border-radius: 10px;
  background: #22ab72;

  margin-right: 20px;
}

.btnPreview {
  padding: 14px 43px;
  justify-content: center;
  align-items: center;
  gap: 10px;

  border-radius: 10px;
  background: rgba(255, 255, 255, 0.1);
}

.right img {
  margin-left: -90px;
}

.slide {
  width: 373px;
  height: 296px;
  position: relative;
}

.gradient {
  height: 100%;
  width: 100%;
  border-radius: 10px;
  background: linear-gradient(180deg, rgba(0, 0, 0, 0) 0%, #000 100%);
  position: absolute;
  /*  top: 100px; */
}

.slide img {
  width: 373px;
  height: 250px;
  object-fit: cover;
  display: block;
  border-radius: 10px;
}

.slide .content {
  position: absolute;

  z-index: 2;
}

.time {
  position: absolute;

  top: 220px;
  left: 320px;
  width: 72px;
  height: 29px;
  background-color: #000;
  padding: 10px;
}

.para1 {
  color: #fff;
  font-family: Poppins;
  font-size: 50px;
  font-style: normal;
  font-weight: 600;
  line-height: 45px; /* 90% */
  letter-spacing: 0.3px;

  margin-top: -30px;
  margin-left: 10px;
}

.para2 {
  color: #fff;
  font-family: Poppins;
  font-size: 13px;
  font-style: normal;
  font-weight: 400;
  line-height: 14px; /* 107.692% */
  letter-spacing: 0.5px;
  opacity: 0.67;
}

.left {
  position: relative;
}

.section3 {
  overflow: hidden;
  position: relative;
}

.left1 p {
  color: #fff;
  font-family: Poppins;
  font-size: 120px;
  font-style: normal;
  font-weight: 600;
  line-height: 120px; /* 100% */
  letter-spacing: -2px;

  padding: 50px;

  position: relative;
}
.left1 img {
  margin-top: -150px;

  z-index: -1;
  position: relative;
}

.right1 p {
  color: #fff;
  font-family: Poppins;
  font-size: 25px;
  font-style: normal;
  font-weight: 400;
  line-height: 50px; /* 200% */
  letter-spacing: 0.5px;
  opacity: 0.7;

  margin-top: 59px;
}

.box {
  position: absolute;

  min-width: 999px;
  height: 533px;

  opacity: 0.1;
  background: #fff;

  left: 650px;
}

.section4{
  margin-top: -150px;
}


.testimonial-grid {
  display: grid;

  grid-template-columns: repeat(3, 1fr);

  grid-template-rows: repeat(2, 1fr);
}

.text1 {
  grid-column-start: 1;
  grid-row-start: 2;
}

.text3 {
  grid-column-start: 3;
  grid-row-start: 2;
}
.img1 {
  margin-top: 193px;
}
.img2 {
  grid-column-start: 2;
  grid-row-start: 2;
}
.img3 {
  grid-column-start: 3;
}


.align-to-left{
  width: 447px;
}

/* Extra large devices (large laptops and desktops, 1200px and Down) */
@media (max-width: 1200px) {
}

/* Large devices (laptops/desktops, 992px and Down) */
@media (max-width: 992px) {
  .right img {
    margin-left: 50px;
    width: 100%;
  }

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

  .testimonial-grid {
    display: grid;

    grid-template-columns: repeat(1, 1fr);

    grid-template-rows: repeat(5, auto);
  }

  .img1 {
    margin-top: 0px;
  }

  .text1 {
    grid-column-start: 1;
    grid-row-start: 2;
  }

  .text3 {
    grid-column-start: 1;
    grid-row-start: 5;
  }

  .img2 {
    grid-column-start: 1;
    grid-row-start: 3;
    /* grid-row-start: 2; */
  }
  .img3 {
    grid-column-start: 1;
  }

  .img1 img {
    width: 558.101px;
    height: 514px;
  }

  .img2 img {
    width: 558.101px;
    height: 514px;
  }
}

/* Medium devices (landscape tablets, 768px and Down) */
@media (max-width: 768px) {
  .left h1 {
    font-size: 150px;
  }
}

/* Small devices (portrait tablets and large phones, 600px and Down) */
@media (max-width: 600px) {
  .left h1 {
    font-size: 100px;
  }

  .left1 p {
    font-size: 100px;
  }
}

/* Extra small devices (phones, 600px and down) */
@media (max-width: 600px) {
  .right img {
    width: 100%;
  }
}