
/* Order Page */

.rounded a H3{
  background-color: #D2691E;
  margin: 20px;
  text-align: center;
  border-radius: 20px;
  color: white;
  font-family: 'Gill Sans', 'Gill Sans MT', Calibri, 'Trebuchet MS', sans-serif;
}
.rounded a H3:hover{
    background-color: #8d4817;
}


.main-banner-mnco {
  position: relative;
  /* height: 153.5rem; */
}

.main-banner-mnco .caption {
  text-align: center;
  position: absolute;
  width: 80%;
  left: 50%;
  top: 50%;
  transform: translate(-50%,-50%);
}

.main-banner-mnco .caption h6 {
  margin-top: 0px;
  font-size: 100%;
  /* text-transform: uppercase; */
  font-weight: 800;
  color: #fff;
  letter-spacing: 0.5px;
}

.main-banner-mnco .caption h2 {
  margin-top: 20px;
  margin-bottom: 20px;
  font-size: 420%;
  /* text-transform: uppercase; */
  font-weight: 800;
  color: #fff;
  letter-spacing: 1px;
}

.main-banner-mnco .caption h2 em {
  font-style: normal;
  color: #ed563b;
  font-weight: 900;
}

.roadmap h4{
  text-align: center;
  color: white;

}

.maps-sekolahpajak{
  background-color: #000;
}
    

.bg-img{
    min-width: 100%;
    /* min-height: 100vh; */
    max-width: 100%;
    padding-bottom: 9px;
    /* width:20px; */
    /* max-height: 100vh; */
    /* height: 20px; */
    object-fit: cover;
    z-index: -1;
}

/* Order Page End */

/*Artikel*/
.Artikel{
  width: 18rem;
  height: 29rem;
  margin: 0.5rem;
}
/* Artikel End */

/* Sekolah Pajak MNCO */
.subjudul{
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  text-align: center;
  background-color: #122872;
  height: 3rem;
  padding-top: 0;
  margin-top: 1rem;
  margin-bottom: 1rem;
  
}

.subjudul-sub{
  font-family: system-ui, -apple-system, BlinkMacSystemFont, 'Segoe UI', Roboto, Oxygen, Ubuntu, Cantarell, 'Open Sans', 'Helvetica Neue', sans-serif;
  text-align: center;
  /* background-color: #122872; */
  color: #122872;
  height: 3rem;
  padding-top: 0;
  margin-top: 1rem;
  margin-bottom: 1rem;
}
.subjudul-sub H2{
  font-weight:800;
}


.subjudul-sub H2 em{
  color: #D2691E;
  font-style: normal;
}





.coro img{
  width: 22.5%;
  margin: 1%;
  /* margin-left:; */
  max-width: 100%;
  border-radius: 2rem;

}



.video-container {
  position: relative;
  padding-bottom: 56.25%; /* 16:9 aspect ratio */
  height: 0;
  overflow: hidden;
  max-width: 90%;
  background: #000;
  margin-left: 60px;
  margin-top: 3rem;
}

.video-container iframe {
  position: absolute;
  top: 0;
  left: 0;
  width: 100%;
  height: 100%;
  border: 0;
}

.video {
  width: 100%;
  border-radius: 20px;

}

.carousel-item {
  min-height: 250px;
}
.testimonial-text {
  font-size: 1.2rem;
  font-family: 'Segoe UI', Tahoma, Geneva, Verdana, sans-serif;
  font-size: 2rem;
  color: #000;
  line-height: 1;
  margin-top: 1rem;
}
.testimonial-author {
  font-weight: bold;
  margin-top: 15px;
  color: #2d2d2d;
}

.testi{
  background-color: #122872;
  padding-top: 1rem;
  padding-bottom: 1rem;
}

.whatsapp-container {
  position: fixed;
  bottom: 20px;
  right: 20px;
  z-index: 100;
  font-family: Arial, sans-serif;
  text-align: center;
}
.float{
  float: left;
}

.card.bg-dark-transparent-botom {
    background-color:rgb(11, 6, 67, 0.5); /* warna biru transparan */
    color: rgb(255, 255, 255);
    margin-bottom: 40px;
    margin-top: 20px;
}

.card.bg-dark-transparent-botom H2 {
    text-align: center;
    font-weight: bold;
    margin-bottom: 2rem;
}

.card.bg-dark-transparent-botom a {
    text-align: center;
    font-weight: bold;
    color: #fff;
}

.bg-dark-transparent-botom a:hover {
  color: #D2691E;

}

.card.bg-dark-transparent-botom a h3 {
    text-align: center;
    font-weight: bold;
    color: #fff;
}

.card.bg-dark-transparent {
    background-color: rgb(11, 6, 67, 0.5); /* warna biru transparan */
    color: rgb(255, 255, 255);
    height: 520px;
    margin-bottom: 40px;
    margin-top: 40px;
}

.bg-dark-transparent-footer {
    background-color: rgba(32, 26, 88, 0.432); /* warna biru transparan */
    color: rgb(255, 255, 255);
    height: 23rem;
    margin-bottom: 40px;
    margin-top: 40px;
    border-radius: 15px;
}

.bg-dark-transparent-footer p a {
    color: #fff;
    /* margin-top: 1rem; */
}

.bg-dark-transparent-footer p a:hover {
    color: #D2691E;
}

.card.bg-dark-transparent-left {
    background-color: rgb(11, 6, 67, 0.5); /* warna biru transparan */
    color: rgb(255, 255, 255);
    height: 520px;
    margin-bottom: 40px;
    margin-top: 40px;
}

.card.bg-dark-transparent-left H3{
    color: rgb(255, 255, 255);
    text-align: left;
}

.card.bg-dark-transparent-left ul li{
    color: rgb(255, 255, 255);
    text-align: left;
}
.card.bg-dark-transparent-left ul li em{
    float: right;
}

.card.bg-dark-transparent-persyaratan {
    background-color: rgb(11, 6, 67, 0.5); /* warna biru transparan */
    color: rgb(255, 255, 255);
    height: auto;
    margin-bottom: 40px;
    margin-top: 70px;
}
.card.bg-dark-transparent-persyaratan-bottom {
    background-color: rgb(11, 6, 67, 0.5); /* warna biru transparan */
    color: rgb(255, 255, 255);
    height: auto;
    margin-bottom: 40px;
    margin-top: 40px;
    height: 34rem;
}

.card.bg-dark-transparent-persyaratan-bottom ul li em {
 float: right;
}

.card.bg-dark-transparent-persyaratan-left {
    background-color: rgb(11, 6, 67, 0.5); /* warna biru transparan */
    color: rgb(255, 255, 255);
    height: auto;
    margin-bottom: 40px;
    margin-top: 70px;
}

.card.bg-dark-transparent ul li {
    text-align: left;
    /* line-height: 0.5; */
}

.card.bg-dark-transparent ul li em {
    float: right;
}

.card.bg-dark-transparent-persyaratan ul li em {
    float: right;
}

.card.bg-dark-transparent-persyaratan-left p {
    color: #fff;
    margin-left: 0.5rem;
}

.card.bg-dark-transparent-persyaratan-left h4 {
    background-image: url(../images/sekolahpajak/list.png);
    background-size: cover;
    background-repeat: no-repeat;
    color: #122872;
}

.card.bg-dark-transparent-persyaratan-left p a {
    color: #fff;
}

.card.bg-dark-transparent-persyaratan-left p i {
    margin-left: 0.5rem;
}

.card.bg-dark-transparent h3 {
    text-align: left;
}

.card.bg-dark-transparent h3 em {
    color: transparent;
}
.bg-img{
  /* background-image: url(../images/sekolahpajak/lab.png); */
  background-color: rgb(11, 6, 67, 0.5); /*warna biru transparan */
  border-radius: 50px;
  border-radius: 10px;

}

.bg-img img{
 width: 50%;
}

.img-coretax img{
  width: 100%;
  margin-top: 3rem;;
}

.area-media{
  width: 50%;
  height: auto;
  float: left;

}

.card-adjust{
  height: 20rem;
}

.biaya-img img{
  width: 150%;
  margin-right: 20rem;

}

.table-rounded {
  border-radius: 15px;
  overflow: hidden; /* agar sudutnya terlihat saat ada border */
}

/* Label H3 tersembunyi awalnya */
.whatsapp-label {
  display: none;
  align-items: center;
  justify-content: center;
  background-color: #25d366;
  color: white;
  padding: 8px 12px;
  border-radius: 8px;
  font-size: 1rem;
  margin-bottom: 10px;
  margin-right: 8px;
  transition: opacity 0.3s ease;
}

/* Tombol WhatsApp */
.whatsapp-float img {
  width: 70px;
  height: 70px;
  border-radius: 20%;
  box-shadow: 0 2px 10px rgba(0,0,0,0.3);
  transition: transform 0.2s ease;
  padding: 5%;
}

.whatsapp-float:hover img {
  transform: scale(1.1);
}

/* Tampilkan H3 saat hover */
.whatsapp-container:hover .whatsapp-label {
  display: inline-flex;
}

.footer-ld-page{
  margin-top: 2rem;
}

.footer-ld-page h3{
  color: #fff;
  font-weight: bold;
  font-style: normal;
  margin: 2rem;
  text-align: center;
}

.footer-ld-page h4{
  color: white;
  float: left;
  margin-left: 16%;
}

.footer-ld-page h4:hover{
  color: #D2691E;
}

.footer-ld-page img{
  margin-top: 2rem;
  width: 100%;
  border-radius: 2rem;
  padding-bottom: 2rem;
}

.video-wrapper {
    position: relative;
    width: 100%;
    max-width: 1500px;
    margin: auto;
    background-color: #000;
    border-radius: 20px;
    /* background-image: url(../images/Logo-mnco-sekolah-pajak.png);
    background-size: 1500px; */
}

.video-wrapper .overlay-play {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%);
  z-index: 2;
  cursor: pointer;
  background-color: rgba(0, 0, 0, 0.5);
  border-radius: 50%;
  padding: 20px;
}

.video-wrapper video {
  width: 100%;
  height: auto;
  border-radius: 20px;
}

.video-wrapper .overlay-play svg {
  width: 50px;
  height: 50px;
  fill: white;
}
/* Halaman Sekolah Pajak MNCo End */

.img-footer img{
  width: 100%;
  margin-top: 10%;
}

.img-footer a h2{
  color: rgb(255, 255, 255);
  float: left;
  margin-left: 18%;
  margin-top: 20px;
}

.img-footer a h2:hover{
  color:#D2691E;
}

.col-md-2 a p{
  color: #fff;
  margin-left: 30px;
  margin-top: 10px;
  font-size: 13px;
}

.col-md-2 a p:hover{
  color:#D2691E;
}

.ldpage{
  margin-top: 2rem;
}

.col-md-3 .ldpage h3{
  color: #fff;
  font-weight: bold;
  text-align: center;
  margin: 1rem;
}

.col-md-3 .ldpage h4{
   color: #122872;
  background-color: #fff;
  text-align: center;
  margin: 1rem;
  border-radius: 1rem;
}

.col-md-3 .ldpage h4:hover{
  color: #fff;
  background-color: #D2691E;
  text-align: center;
  margin: 1rem;
  border-radius: 1rem;
}

.img-education{
  width: 100%;
  box-shadow: 0 4px 10px rgba(0, 0, 0, 0.3);
}


  @media screen and (max-width:576px) {
    .coro img{
        width: 45%;
        margin-left: 2%;
        border-radius: 6px;
    }

    .video-container {
        margin-left: 20px;
    }
    .Artikel{
      width: 10rem;
      margin-right: 0.1rem;
      margin-left: 2rem;
      height: 23rem;

    }

      .Artikel H5{
      font-size: 15px;
      text-align: center;
    }

    .main-banner-mnco {
    position: relative;
    }

    .biaya-img img{
    width: 100%;
    margin-right: 20rem;
    }
    .card.bg-dark-transparent {
    height: 800px;
    }

    .card.bg-dark-transparent-left {
    height: 400px;
    }
    .main-banner-mnco .caption H2 {
    margin-top:0px;
    font-size: 300%;
    /* text-transform: uppercase; */
    font-weight: 900;
    color: #fff;
    }
    .bg-img img{
      width: 100%;
    }

    .h3roadmap{
    margin-top: 100px;
}
}

 @media screen and (max-width:425px) {
     .h3roadmap{
  margin-top: 100px;
     }
 }
  