@import url('https://fonts.googleapis.com/css2?family=Open+Sans:wght@300;400;700&display=swap');







.yt-container {
  position: absolute; /* Postion relative to section */
  /* Make it full size ↓ */
  bottom: 0;
  left: 0;
  right: 0;
  top: 0;
  overflow: hidden; /* Prevent video overflow */
  pointer-events: none; /* Prevent user interaction */
  z-index: -2; /* Make YouTube container underneath section content */
}

.yt-background {
  position: absolute; /* Postion relative to .yt-container */
  /* center it ↓ */
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  /* make it full height ↓ */
  height: 100%;
}

/* Make a hidden sizer SVG to take up full size of the .yt-background */
.yt-sizer {
  display: inline-block;
  width: auto;
  max-width: none;
  height: 100%;
  border: none;
  vertical-align: top;
}

.yt-video {
  position: absolute; /* Postion relative to .yt-background */
  /* Postion at the top and make it full size ↓ */
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  /* cover image, if video is failed to load */
  background: url(url/to/a/cover-image.webp) no-repeat center;
  background-size: cover;
}









* {
  box-sizing: border-box;
}

body {
  min-height: 100%;
  margin: 0;
  padding: 0;
  /*background-color: #22242d;*/
  background-color: #00091B;
  /*background-image: url(https://images.unsplash.com/photo-1549880338-65ddcdfd017b?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1350&q=80);*/
  /* background-image: url(https://bukanmanusiabiasa.com/img/mic-pod-cast.jpg); */
  /* background-image: url(https://bukanmanusiabiasa.com/img/dark-chair-shadow.jpg); */
  background-image: url(https://bukanmanusiabiasa.com/img/bg-BMB.jpg);
  /* background-size: 100% auto; */
  background-size: cover;
  background-repeat: no-repeat;
  background-position: top center;
  overflow: hidden;
  /*font-family: 'Open Sans', sans-serif;*/
  font-family: 'Poppins', sans-serif;
}

a{
  text-decoration: none;
  color: inherit;
}


.sooz-container{
  position: relative;
  /*height: 95vh;*/
  width: 100%;
  margin: 0 auto;
  filter: blur(2px);
}

.sooz-inner{
  position: absolute;
  height: 100%;
  width: 1624px;
  top: 0px;
  left: 50%;
  transform: translateX(-50%);
  /*background-image: url(https://images.unsplash.com/photo-1500462918059-b1a0cb512f1d?ixlib=rb-1.2.1&ixid=eyJhcHBfaWQiOjEyMDd9&auto=format&fit=crop&w=1534&q=80);*/
  background-size: contain;
  background-repeat: no-repeat;
  background-position: top center;
}


.overlay-container{
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 32px;
  background-color: rgba(0, 0, 0, 0.5);
}


.soon-container{
  width: 100%;
  position: fixed;
  bottom: -20px;
  background-size: contain;
  background-repeat: no-repeat;
  background-position: bottom center;
}

.soon-inner{
  display: flex;
  align-items: center;
  justify-content: center;
  background-color: #00091B;
  padding: 0 50px 50px 50px;

}

.soon-wave{
  margin-bottom: -150px;
}

.soon-a{
  flex: 1;
  padding-right: 25px;
  width: 50%;
}

.soon-a-img{
  max-width: 200px;
  margin-left: auto;
  margin-right: 0;
}

.soon-a img{
  display: block;
  width: 100%;
}

.soon-b{
  flex: 1;
  color: #FFFFFF;
  /*text-transform: uppercase;*/
  padding-left: 25px;
  width: 50%;


}

.soon-b-h3{
  margin: 0;
  letter-spacing: 5px;
  font-size: 1.2rem;
  font-weight: 400;
}

.soon-b-h3 a:hover{
  text-decoration: underline;
  color: #004d9f;
}

.soon-b-h1{
  margin: 0;
  font-size: 3rem;
  font-weight: 900;
  white-space: nowrap;
}

.soon-info{
  background-color: #fff;
  padding: 0px 50px 50px 50px;
}

.soon-info-txt{
  font-size: 10px ;
  /*color: darkgray;*/
  color: #FFFFFF;
  margin: 0 auto;
  letter-spacing: 1px;
  max-width: 150ch;
}



@media only screen and (min-width: 200px){

    .soon-inner{
      display: flex;
      align-items: center;
      justify-content: center;
      background-color: green;
      padding: 0 0 0 0;

    }

    .soon-a{
        padding: 0;
        margin-bottom: 25px;
        width: auto;
    }

      .soon-a-img{
        max-width: 500px;
      }

      .soon-wave{
        margin-bottom: -10px;
      }

      .soon-b-h3{
        font-size: 1.2rem;
      }

      .soon-b-h1{
        font-size: 1.7rem;
      }
}



@media only screen and (min-width: 501px){

  .soon-inner{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #bd171b;
    padding: 0 0 0 0;
  }

  .soon-inner{
    flex-direction: column;
  }

  .soon-wave{
    margin-bottom: -90px;
  }

  .soon-a{
    padding: 0;
    margin-bottom: 30px;
    width: auto;
  }


    .soon-container
    {
      padding-bottom:20px;
      /* bottom: 0px; */
    }

  .soon-a-img{
    max-width: 300px;
  }

  .soon-b{
    padding: 0;
    text-align: center;
    width: auto;
  }

  .soon-b-h1{
    font-size: 1.5rem;
    margin-bottom:15px;
  }

  .soon-b-h3{
    font-size: 1.75rem;
    margin-bottom:25px;
  }


}




@media only screen and (min-width: 1000px){

  .soon-inner{
    display: flex;
    align-items: center;
    justify-content: center;
    background-color: #bd171b;
    padding: 0 0 0 0;
  }

  .soon-wave{
    margin-bottom: -160px;
  }

  .soon-b-h1{
    font-size: 1.3rem;
    margin-bottom:15px;
  }

  .soon-b-h3{
    font-size: 1.55rem;
    margin-bottom:15px;
  }

    .soon-container
    {
        padding-bottom: 0px;
        bottom: 0px;
    }

    .soon-a-img{
      max-width: 170px;
      margin-left: auto;
      margin-right: 0;
      margin-bottom:-20px;
    }

}