.bg-transparent-to-black{
  background: linear-gradient(to bottom, transparent 0, #00000042 100%);
  width: 100%;
  height: 100%;
  position: absolute;
}

.btn-tautan-situs{
  padding: 0px 32px;
}

.div-nav-modul{
  padding: 16px 32px;
}

.desc-sumber-lain{
/*  line-height: 1.8;*/
/*  letter-spacing: 1px;*/
}

.img-online-learning-1 {
  max-width: 100%;
  object-fit: contain;
}

.div-nav-modul.active::before {
  content: url(../img/static/cursor2.png);
  position: absolute;
  left: -5px;
  top: -10px;
  z-index: 2;
  transform: scale(1.5);
}

.fs-nav-modul{
  font-size: 30px;
}
.fs-nav-modul-2{
  font-size: 35px;
}

.img-materi{
  width: 100%;
  height: 270px;
  overflow: hidden;
  position: relative;
}

.title-online-learning{
  font-size: 55px;
  letter-spacing: 5px;
}

.title-online-learning-2{
  font-size: 65px;
}

.btn-arrow{
  width: 75%;
}
.btn-arrow:hover {
  transform: rotate(-2deg);
}

/*REBEL 1*/
.rbl-online-learning-1 {
  width: 100%;
  height: 0;
  padding-top: 48%;
  position: relative;
}

.rbl-online-learning-1 > div {
  position: absolute;
  transform-origin: top left;
}

.rbl-online-learning-1-wrapper {
  width: 100%;
  position: relative;
}

.rbl-online-learning-1-content {
  position: absolute;
  top: 0;
  left: 0;
  transform-origin: top left;
  line-height: 1;
}
.rbl-online-learning-1-1 {
  height: 300px;
  font-size: 100px;
  letter-spacing: 13px;
  top: 50px;
  left: 0;
  font-weight: 800;
}
.rbl-online-learning-1-2 {
  font-size: 150px;
  top: 40px;
  left: 240px;
  font-weight: 400;
}
.rbl-online-learning-1-3 {
  font-size: 160px;
  top: 133px;
  left: 70px;
  font-weight: 400;
  letter-spacing: -8px;
}
.rbl-online-learning-1-4 {
  font-size: 93px;
  letter-spacing: 17px;
  top: 220px;
  left: 250px;
  font-weight: 800;
}

/*END REBEL 1*/


/*REBEL 2*/
.txt-simak-berikut{
  font-size: 4rem;
  line-height: 0.2;
  letter-spacing: 0.5rem;
}
.txt-video-asyik{
  font-size: 6rem;
  line-height: 0.2;
}

/*END REBEL 2*/


.btn-materi{
  bottom: 30px;
  width: 100%;
  margin-left: -15px;
}

.btn-download-materi{
  bottom: -10px;
  width: 100%;
  margin-left: -15px;
}
.object-cover {
    object-fit: cover;
    width: 100%;
    height: 100%;
}
.ls-desc-materi {
/*  letter-spacing: 1px;*/
  font-size: 20px;
}


/* `sm` applies to x-small devices (portrait phones, less than 576px) */
@media (max-width: 575.98px) {
  div span.title-online-learning-2{
    display: inline;
  }

  div.d-block-mobile.d-flex{
    display: block !important;
  }

  .d-block-mobile .FloodStd{
    line-height: .5 !important;
  }
}

/* `md` applies to small devices (landscape phones, less than 768px) */
@media (max-width: 767.98px) {
  .rbl-online-learning-1-content{
    transform: scale(0.74);
  }
  .ls-desc-materi{
    font-size: 18px;
  }

  div span.title-online-learning{
    font-size: 30px;
  }

  div span.title-online-learning-2{
    font-size: 40px;
  }
  .txt-simak-berikut{
    line-height: 0;
    font-size: 1.6rem;
  }
  .txt-video-asyik{
    line-height: 0;
    font-size: 2.2rem;
  }
  .btn-arrow{
    width: 60%;
  }
  /*.rbl-online-learning-1-wrapper{
    height: 300px;
  }*/
  .rbl-online-learning-1{
    padding-top: 45%;
  }
  .fs-nav-modul-2{
    font-size: 30px;
  }

}

/* `lg` applies to medium devices (tablets, less than 992px) */
@media (max-width: 991.98px) {
  span.fs-nav-modul {
    font-size: 25px;
  }

  span.title-online-learning{
    font-size: 35px;
  }

  span.title-online-learning-2{
    font-size: 65px;
  }
}

/* `xl` applies to large devices (desktops, less than 1200px) */
@media (max-width: 1199.98px) {
  .fs-nav-modul{
    font-size: 28px;
  }

  .title-online-learning{
    font-size: 50px;
  }

  .title-online-learning-2{
    font-size: 80px;
  }
}

/* `xxl` applies to x-large devices (large desktops, less than 1400px) */
@media (max-width: 1399.98px) {
  
}