
html, body {
    box-sizing: border-box;
    background:#000000;
    text-transform: capitalize;
    overflow-x: hidden;
    font-family: -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
    font-size: 17px;
      line-height: 1.47059;
      font-weight: 400;
      letter-spacing: -.022em;
      margin: 0;
      margin-top: 0px;
      margin-right: 0px;
      margin-bottom: 0px;
      margin-left: 0px;
      padding: 0;
      padding-top: 0px;
      padding-right: 0px;
      padding-bottom: 0px;
      padding-left: 0px;
    /* scroll-behavior: smooth; */
  }
  .video__section2{
    height: 100%;
    width: 100%;
    object-fit: cover;
    z-index: 10;
  }

  .h1, .h2, .h3{
    position: absolute;
    font-size:1em;
    font-weight:500;
    display:block;
    line-height:120%;
    text-align:center;
    max-width:100%;
    left: 50%;
    top: 50%;
    transform: translate(-50%, -50%);
  
  }
   #heading-part{
    margin-top: 10vh;
   }

section{
  height: 100vh;
}




  .section2__header{
    color: white;
    height: 100vh;
    width: 100vw;
    position: absolute;
    display: flex;
    flex-direction: column;
    justify-content: center;
    align-items: center;
  }
.position__abs{
    position: absolute;
  }
  
  
  .section2__header > div{
    text-align: center;
    width: 70%;
  }
  
  #heading h1{
    font-size:8rem;
    max-width: 100vw;;
    margin: 0 auto; 
    text-align: center;
    
  }
  .h1-1 ,.h1-2{
    font-size: 5rem;
    margin: 0 auto; 
    text-align: center;
    max-width: 50vw;
  } 
  #heading-part{
    font-size: 30px;
    top:10;
    /* max-width: 50vw; */
    margin: 0 auto; 


  }
 .p-1 , .p-2{
   font-size: 2.5em;;
    font-size: 30px;
     max-width: 30em;
     margin: 0 auto;  
    

  }
  
  canvas {
    position: fixed;
    object-fit: fill;
    background-position-y: 30%;
    left: 40%;
    top: 40%;
    transform: translate(-40%, -40%);
    max-width: 100vw;
    max-height: 100vh;
    z-index: 0;
  }
  
 #main {
  max-width:150vw;
  color:#ffffff;
  height:100vh;
  left: 50%;
  top: 50%;
  transform: translate(-50%, -50%);
}

.section4  {
  display:block;
  background-color: #ffffff;

  position: absolute;
  width:100vw;
  height:100vh;
}

.block1 {
  width: 10%;
  z-index:3;
}

#image-a {
  position: absolute;
  background-repeat: no-repeat;
  z-index: 2;
}

.image-a-small {
 
  position:absolute;
 
  z-index: 2;
}

.laptop-img {
  display:absolute;
  object-fit: cover;
  position:absolute;
  width:65%;
  height: 65%;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);

}

.laptop-comb{
  display:block;
  object-fit: cover;
  position:absolute;
  width:65%;
  height: 65%;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);

}



.section4  {
  display:block;
  background-color: #000000;
  position: absolute;
  width:100vw;
}

.block1{
  display:absolute;
  object-fit: cover;
  position:absolute;
  width:65%;
  height: 65%;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  opacity:0
}

.block2 {
  display:absolute;
  object-fit: cover;
  position:absolute;
  width:65%;
  height: 65%;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  opacity:0
}

.block3 {
  display:flexbox;
  object-fit: cover;
  position:absolute;
  width:65%;
  height: 65%;
  left:50%;
  top:50%;
  transform: translate(-50%, -50%);
  opacity:0
}

.text-block1{
  position: absolute;
   font-size:3em;
  font-weight:600;
  display:grid;
  line-height:200%;
  text-align:center;
  max-width:100%;
  left:25%;
  top:30%;
  transform: translate(-50%, -50%);
  z-index:3;
}

.text-block2{
  position: absolute;
  font-size:2.5em;
 font-weight:600;
 display:grid;
 line-height:200%;
 text-align:center;
 max-width:100%;
 left:65%;
 top:30%;
 transform: translate(-50%, -50%);
 z-index:3;
}
.text-block3{
  position: absolute;
  font-size:3em;
 font-weight:600;
 display:grid;
 line-height:200%;
 text-align:center;
 max-width:100%;
 left:50%;
 top:50%;
 transform: translate(-50%, -50%);
 z-index:3;
}

.para-block1 {
  position: absolute;
  font-size:1.5em;
 font-weight:500;
 display:block;
 line-height:150%;
 text-align:center;
 max-width:100%;
 left:25%;
 top:50%;
 transform: translate(-50%, -50%);
 z-index:3;
}

.para-block2, .para-block2-2{

  position: absolute;
  font-size:1.5em;
 font-weight:500;
 display:block;
 line-height:150%;
 text-align:center;
 max-width:100%;
 left:65%;
 top:50%;
 transform: translate(-50%, -50%);
 z-index:3;
}

.para-block3{
  position: absolute;
  font-size:2em;
 font-weight:500;
 display:block;
 line-height:150%;
 text-align:center;
 max-width:100%;
 left:65%;
 top:50%;
 transform: translate(-50%, -50%);
 z-index:3;
}

#footer {

  left: 0;
  TOP:100%;
  width: 100%;
  background-color: rgb(255, 1, 1);
  color: white;
  text-align: center;
}
