body {
    padding-right: 2px;
    padding-left: 2px;
    background-color: #ffffff!important;
  }
  .col-lg{
    width: 100%, im !important;
    padding-right: 0px!important;
    padding-left: 0px!important;
  }
  .col-md-6{
    width: 100%, im !important;
    padding-right: 0px!important;
    padding-left: 0px!important;
  }
.jumbotron{
  background-color: rgba(114, 255, 154, 0.816)!important;
  background: radial-gradient(circle, #94FFD8 20%, rgba(93, 23, 23, 0) 95%);
  margin-top: 50%;
  padding-bottom: 15px;
}

.custom-background-shop {
  background-color: #E8FFF7;
  fill-opacity: 0,5;
  /* Gantilah 'assets/background.jpg' dengan path ke gambar latar belakang Anda */
  background-size: cover;
  background-repeat: no-repeat;
  /* Anda dapat menambahkan properti CSS lainnya seperti background-color, background-position, dsb. */
  width: 100%;
  height: auto;
  /* Gantilah nilai tinggi sesuai kebutuhan Anda */
}
.custom-background-home {
    background-image: url('img/bg.jpg');
    /* Gantilah 'assets/background.jpg' dengan path ke gambar latar belakang Anda */
    background-size: cover;
    background-repeat: no-repeat;
    /* Anda dapat menambahkan properti CSS lainnya seperti background-color, background-position, dsb. */
    width: 100%;
    height: auto;
    /* Gantilah nilai tinggi sesuai kebutuhan Anda */
}
.custom-background-product {
    background-image: url('img/bg2.png');
    /* Gantilah 'assets/background.jpg' dengan path ke gambar latar belakang Anda */
    background-size: cover;
    background-repeat: no-repeat;
    /* Anda dapat menambahkan properti CSS lainnya seperti background-color, background-position, dsb. */
    width: 100%;
    height: auto;
    margin:3rem 0;
    /* Gantilah nilai tinggi sesuai kebutuhan Anda */
}
.custom-background-tarif {
    background-color: #f0ddff;
    /* Gantilah 'assets/background.jpg' dengan path ke gambar latar belakang Anda */
    background-size: cover;
    background-repeat: no-repeat;
    /* Anda dapat menambahkan properti CSS lainnya seperti background-color, background-position, dsb. */
    width: 100%;
    height: auto;
    /* Gantilah nilai tinggi sesuai kebutuhan Anda */
}
.custom-background-terakhir {
    background-image: url('img/bg3.png');
    /* Gantilah 'assets/background.jpg' dengan path ke gambar latar belakang Anda */
    background-size: cover;
    background-repeat: no-repeat;
    /* Anda dapat menambahkan properti CSS lainnya seperti background-color, background-position, dsb. */
    width: 100%;
    height: auto;
    /* Gantilah nilai tinggi sesuai kebutuhan Anda */
}

.bg-nav {
    background-image: url('img/bg.jpg');
    /* Gantilah 'assets/img/rectangle-130.png' dengan path ke gambar Anda */
    background-size: cover;
    background-repeat: no-repeat;
    background-position: center;
    height: 100px;
    /* Sesuaikan tinggi navbar dengan gambar Anda */
}

.navbar {
    transition: background-color 0.3s ease;
    /* Efek transisi perubahan background */
}

/* Latar belakang standar navbar */
.navbar-default {
    background-color: transparent;
}

/* Latar belakang navbar saat di-scroll */
.navbar-scrolled {
    background-color: #141515;
    /* Atur warna latar belakang navbar saat di-scroll sesuai kebutuhan Anda */
}
.btn{
    color: #ffffff;
    font: 700 15px "Poppins", sans-serif;
    text-align: center;
    padding: 0%;
}
a{
    color: #ffffff!important;
    font: 700 15px "Poppins", sans-serif;
}
.navbar-nav{
    padding-left:15%!important;
}
.gbr-navbar{
    width:200px;
}
.logo-navbar{
    padding-left:15%;
}
.gbr-home{
    width: 90%;
}
.tulisan-home{

    font-size: 300%!important;
    color: #ffffff;
    width: 80%;
    text-align: center;
}
h1,
h2,
h3,
h4,
h5,
h6
{
    font-family:Poppins, sans-serif!important;
    font-weight: bold!important;
}
.h6{
    font-size: 100%!important;
}
.h5{
    font-size: 100%!important;
}
.h2{
  font-size: 100%!important;
}
.h4-tarif{
  font-weight:normal!important;
}
.kotak-tulisan-home{
    padding: 17rem ;
    font-size: 6vh;
}
.with-border {
    border-bottom: 5px solid #535252!important; /* Warna dan ketebalan garis sesuaikan dengan kebutuhan Anda */
  }
  .card-aa{
    font-size: 12px;
    color:#555458;
    font-weight: bold;
  }
  .card-ab{
    font-size: 18px;
    color: #048ED1;
  }
  .card-ac{
    font-size: 20px;
    color: #048ED1;
  }
  .card-ad{
    font-size: 10px;
    color:#555458;
    font-weight: bold;
  }
  .card-produk{
    border-radius: 25px!important;
    margin: 2% !important;
  }
    .card-produk1{
    border-radius: 15px!important;
    margin: 1rem !important;
  }
    .col-produk{
    border-radius: 25px!important;
    padding: 3% !important;
  }
  .tulisan-produk{
    height:60%!important;
  }
  .keunggulan1{
        background: #ffeddd;
        width: 100%;
        height: 100%;
  }
  .btn-pesan-produck{
    width:80%;
  }
  .keunggulan2{
    background: #dce2ff;
  border-radius: 37px 36px 35px 0px;
  width: 253px;
  height: 189px;
  box-shadow: -12px 25px 53px 0px rgba(186, 181, 216, 0.25);
  }
  .keunggulan3 {
    background: #f0ddff;
    border-radius: 37px 0px 35px 31px;
    width: 50%;
    height: 80%;
    box-shadow: -12px 25px 53px 0px rgba(186, 181, 216, 0.25);
    -webkit-border-radius: 37px 0px 35px 31px;
    -moz-border-radius: 37px 0px 35px 31px;
    -ms-border-radius: 37px 0px 35px 31px;
    -o-border-radius: 37px 0px 35px 31px;
}
  .keunggulan4 {
    background: #e5f9ff;
    border-radius: 0px 36px 35px 31px;
    width: 253px;
    height: 142px;
    box-shadow: -12px 25px 53px 0px rgba(186, 181, 216, 0.25);
  }
  .kata-kostimer{
    border-radius: 0px;
    position: relative;
    transform: translate(-65.22px, -27.97px);
    overflow: visible;
  }
  .bergabung{
    background: #1a9fff;
    width: 100%;
    height: auto;
  }
  h2{
    font: Poppins, sans-serif!important; 
  }
  .atas{
    margin: 2rem 2rem;
  }
  .img-produk{
    border-radius:25px;
    width:100%;
}
  .card-costumer{
    margin-left:20%;
    margin-right:20%;
    border-bottom-right-radius:60px!important;
    border-top-left-radius: 80px !important;
  }
  .con-revew-costumer{
   padding-left:15% !important;
   padding-right:15% !important; 
   padding-top:5% !important; 
   padding-bottom:5% !important;
}
  .h5-gabung{
    color: #2ba3fa;
  }
  .h6-layanan{
    color: #8a898e;
    text-align: center;
    font-weight:normal;
    letter-spacing:0.1rem;
  }
  .card-home{
    border-radius: 5vh !important;
    width:100%;
    /* margin-left:%; */
    margin-top:-30px;
}
  .card-kaki-layanan{
    background-color: #ffffff !important;
    border-top:0 !important;
    border-radius: 28px !important;
  }
  .tombol-kaki-pesan-layanan{
    margin-bottom:4% !important;
    width: 60% !important;
    background: #2ba3fa !important;
    border-radius: 10px !important;
  }
  .btn-primary{
    background: #2ba3fa !important;
  }
  .bg-trif{
    width:100%;
  }

@media screen and (max-width: 991px) {
    .navbar-nav{
        padding-left:0%!important;
    }
    .jumbotron{
      background-color: rgba(114, 255, 154, 0.816)!important;
      background: radial-gradient(circle, #94FFD8 20%, rgba(93, 23, 23, 0) 95%);
      margin-top: 75%;
      padding-bottom: 40px;
    }
    .kotak-tulisan-home{
  padding: 16rem;
}
    .gbr-home{
  margin-top: 5%;
  padding-left:10%;
}
  .img-produk{
    border-radius:25px;
    width:100%;
}
    .h6{
        font-size: 90%!important;
    }
    .h5{
        font-size: 90%!important;
    }
    .h2{
      font-size: 90%!important;
  }
  .card-aa{
    font-size: 11px;
    color:#555458;
    font-weight: bold;
  }
  .card-ab{
    font-size: 18px;
    color: #048ED1;
  }
  .card-ac{
    font-size: 19px;
    color: #048ED1;
  }
  .card-ad{
    font-size: 9px;
    color:#555458;
    font-weight: bold;
  }
  .con-revew-costumer{
    padding-left:10% !important;
    padding-right:10% !important;
 }
 .bg-trif{
  width:80%;
}
 }
 @media screen and (max-width: 768px) {
  .custom-div {
    width: 724px !important; /* Atur lebar sesuai kebutuhan Anda */
    margin: 0 auto; /* Untuk mengatur div ke tengah layar */
  }
.gbr-home{
  margin-top: 5%;
  padding-left:10%;
}
.kotak-tulisan-home{
  padding: 16rem;
}
.tulisan-home{
  padding-left:10%;
  font-size: 250%!important;
}
.btn-jargon{
  margin-left:7%;
}
.h-keunggulan{
  font-size: 100%!important;
}
.h3{
  font-size: 90%!important;
}
  .img-produk{
    border-radius:25px;
    width:100%;
}
.card-costumer{
  margin-left:10%;
  margin-right:10%;
}
.bg-trif{
  width:60%;
}
.h2-bergabung{
  font-size:150%;
}
.h4-tarif{
  font-size:110%;
}

}

 @media screen and (max-width: 440px) {

    .logo-navbar{
        padding-left:0%!important;
    }
    .jumbotron{
      background-color: rgba(114, 255, 154, 0.816)!important;
      background: radial-gradient(circle, #94FFD8 20%, rgba(93, 23, 23, 0) 95%);
      margin-top: 50%;
      padding-bottom: 15px;
    }
    .kotak-tulisan-home{
      padding: 14rem;
      font-size: 5vh;
    }
    .con-revew-costumer{
      padding-left:3% !important;
      padding-right:3% !important; 
   }
   .card-aa{
    font-size: 11px;
    color:#555458;
    font-weight: bold;
  }
  .card-ab{
    font-size: 15px;
    color: #048ED1;
  }
  .card-ac{
    font-size: 17px;
    color: #048ED1;
  }
  .card-ad{
    font-size: 7px;
    color:#555458;
    font-weight: bold;
  }
    .img-produk{
    border-radius:25px;
    width:100%;
}
   .tulisan-home{
    font-size: 150%!important;
  }
  .h2,.h3,.h4,.h6{
    font-size: 90%!important;
  }
  .h1{
    font-size:95%!important;
  }
  .card-home{
    width:70%;
    margin-left:10%;
     margin-top:-30px;
  }
  .bg-trif{
    width:40%;
  }
 }

  @media screen and (max-width: 360px) {

    .logo-navbar{
        padding-left:0%!important;
    }
    .jumbotron{
      background-color: rgba(114, 255, 154, 0.816)!important;
      background: radial-gradient(circle, #94FFD8 20%, rgba(93, 23, 23, 0) 95%);
      margin-top: 50%;
      padding-bottom: 15px;
    }
    .con-revew-costumer{
      padding-left:1% !important;
      padding-right:1% !important; 
   }
    .kotak-tulisan-home{
    padding: 13rem;
    font-size: 5vh;
  }
   .card-aa{
    font-size: 11px;
    color:#555458;
    font-weight: bold;
  }
  .card-ab{
    font-size: 13px;
    color: #048ED1;
  }
  .card-ac{
    font-size: 15px;
    color: #048ED1;
  }
  .card-ad{
    font-size: 6px;
    color:#555458;
    font-weight: bold;
  }
    .img-produk{
    border-radius:25px;
    width:100%;
}
   .tulisan-home{
    font-size: 150%!important;
  }
  .h2,.h3,.h4,.h6{
    font-size: 50%!important;
  }
  .bg-trif{
    width:20%;
  }

 }