/* jenis text */
.text-lobster {
  font-family: 'Lobster' , cursive, sans-serif !important;
}

.text-roboto {
  font-family: 'Roboto' , sans-serif !important;
}

.text-nunito {
  font-family: 'Nunito' , sans-serif !important;
}

.text-georgia {
  font-family: Georgia, 'Times New Roman', Times, serif !important;
}

.text-cousine {
  font-family: 'Cousine' , monospace !important;
}

/* text align start */
.text-justify {
  text-align: justify !important;
}

/* cursor-pointer */

.cursor-pointer {
  cursor: pointer;
}

/* font size */
.fs-075 {
  font-size: 0.75rem;
}

.fs-085 {
  font-size: 0.85rem;
}

.bor-bot-jad-dok {
  border-bottom: 1px solid rgba(33, 37, 41, 0.25);
  padding-bottom: 1rem;
}



/* footer sosmed start */

.sosmed-text {
  font-size: 1.5rem;
}

div.footer-sosmed .fa-facebook {
  border: 1px solid white;
  padding: 8px 12px;
  color: white;
  border-radius: 50%;
  font-size: 1.5rem;
}

div.footer-sosmed .fa-facebook:hover {
  border: 1px solid white;
  color: #0d6efd; 
  background-color: white;
}

div.footer-sosmed .bi-youtube,
div.footer-sosmed .bi-instagram {
  border: 1px solid white;
  padding: 7px 9px;
  color: white;
  border-radius: 50%;
  font-size: 1.5rem;
}

div.footer-sosmed .bi-youtube:hover,
div.footer-sosmed .bi-instagram:hover {
  border: 1px solid white;
  color: #0d6efd; 
  background-color: white;
}

div.footer-sosmed .fa-instagram {
  color: white;
  font-size: 1.75rem;
  /*border: 1px solid white;
  padding: 10px 10px;
  
  border-radius: 50%;
  
  */
}

div.footer-sosmed .fa-youtube {
  color: white;
  font-size: 1.75rem;
  /*border: 1px solid white;
  padding: 10px 10px;
  
  border-radius: 50%;
  
  */
}


div.footer-sosmed .fa-youtube:hover,
div.footer-sosmed .fa-instagram:hover {
    
  
  /* border: 1px solid white;
      background-color: white;
      color: #0d6efd;
  */
}


div.footer-sosmed .bi-tiktok {
  border: 1px solid white;
  padding: 6px 9px;
  color: white;
  border-radius: 50%;
  font-size: 1.3rem;
}


div.footer-sosmed .bi-tiktok:hover {
  border: 1px solid white;
  color: #00a170; /* 0d6efd */
  background-color: white;
}


/* footer sosmed end */




/* overlay jaddok */

.overlay-jaddok-img-container {
  position:  relative;
  /* width: 50%; */
}

.overlay-jaddok-text {
  position: absolute;
  top:  0;
  bottom: 0;
  left: 0;
  right: 0;
  height: 100%;
  width: 100%;
  opacity: 0;
  transition: 1.25s ease;
  background-color: #008cba;
}

.overlay-jaddok-img-container:hover .overlay-jaddok-text {
  opacity: 1;
}

.overlay-text {
  color: white;
  font-size:  1.25rem;
  position: absolute;
  top:  50%;
  left:  50%;
  transform: translate(-50%,-50%);
}

.overlay-jaddok-text-slide-from-top {
  position: absolute;
  /* top:  0; */
  bottom: 100%;
  left: 0;
  right: 0;
  height: 0; /* 100% */
  width: 100%;
  opacity: 0;
  transition: 1.15s ease;
  background-color: #008cba;
  overflow:  hidden; /* add */
}

.overlay-jaddok-img-container:hover .overlay-jaddok-text-slide-from-top {
  bottom:  0;
  height: 100%;
}




/* padding add*/
.pad-0 {
  padding: 0 !important;
}

.pad-t-0,
.pad-y-0 {
  padding-top: 0 !important;
}

.pad-r-0,
.pad-x-0 {
  padding-right: 0 !important;
}

.pad-b-0,
.pad-y-0 {
  padding-bottom: 0 !important;
}

.pad-l-0,
.pad-x-0 {
  padding-left: 0 !important;
}

.pad-1 {
  padding: 0.25rem !important;
}

.pad-t-1,
.pad-y-1 {
  padding-top: 0.25rem !important;
}

.pad-r-1,
.pad-x-1 {
  padding-right: 0.25rem !important;
}

.pad-b-1,
.pad-y-1 {
  padding-bottom: 0.25rem !important;
}

.pad-l-1,
.pad-x-1 {
  padding-left: 0.25rem !important;
}

.pad-2 {
  padding: 0.5rem !important;
}

.pad-t-2,
.pad-y-2 {
  padding-top: 0.5rem !important;
}

.pad-r-2,
.pad-x-2 {
  padding-right: 0.5rem !important;
}

.pad-b-2,
.pad-y-2 {
  padding-bottom: 0.5rem !important;
}

.pad-l-2,
.pad-x-2 {
  padding-left: 0.5rem !important;
}

.pad-3 {
  padding: 1rem !important;
}

.pad-t-3,
.pad-y-3 {
  padding-top: 1rem !important;
}

.pad-r-3,
.pad-x-3 {
  padding-right: 1rem !important;
}

.pad-b-3,
.pad-y-3 {
  padding-bottom: 1rem !important;
}

.pad-l-3,
.pad-x-3 {
  padding-left: 1rem !important;
}

.pad-4 {
  padding: 1.5rem !important;
}

.pad-t-4,
.pad-y-4 {
  padding-top: 1.5rem !important;
}

.pad-r-4,
.pad-x-4 {
  padding-right: 1.5rem !important;
}

.pad-b-4,
.pad-y-4 {
  padding-bottom: 1.5rem !important;
}

.pad-l-4,
.pad-x-4 {
  padding-left: 1.5rem !important;
}

.pad-5 {
  padding: 3rem !important;
}

.pad-t-5,
.pad-y-5 {
  padding-top: 3rem !important;
}

.pad-r-5,
.pad-x-5 {
  padding-right: 3rem !important;
}

.pad-b-5,
.pad-y-5 {
  padding-bottom: 3rem !important;
}

.pad-l-5,
.pad-x-5 {
  padding-left: 3rem !important;
}


.pad-6 {
  padding: 4rem !important;
}

.pad-t-6,
.pad-y-6 {
  padding-top: 4rem !important;
}

.pad-r-6,
.pad-x-6 {
  padding-right: 4rem !important;
}

.pad-b-6,
.pad-y-6 {
  padding-bottom: 4rem !important;
}

.pad-l-6,
.pad-x-6 {
  padding-left: 4rem !important;
}

.pad-7 {
  padding: 6rem !important;
}

.pad-t-7,
.pad-y-7 {
  padding-top: 6rem !important;
}

.pad-r-7,
.pad-x-7 {
  padding-right: 6rem !important;
}

.pad-b-7,
.pad-y-7 {
  padding-bottom: 6rem !important;
}

.pad-l-7,
.pad-x-7 {
  padding-left: 6rem !important;
}

/* padding - end*/


.row::after {
  content: "";
  display: table;
  clear: both;
}


.clearfix::after {
  content: "";
  clear: both;
  display: table;
}



.line-under-text {
  width: 50px !important;
  height: 5px;
  /* background-color: #adb5bd; */
  background-color: #FA8BFF;
  background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BFF88 90%);
  border-radius: 6px;
  margin: 0 auto;
}

.line-divider {
  width: 100% !important;
  height: 1px;
  background-color: rgba(0, 0, 0, 0.15);
  border-radius: 5px;
  margin: 1rem 0;
}


.rajal-list {
  padding: 0.65rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  margin: 0.5rem 0;
  padding-left: 1rem !important;
}
.ranap-list {
  padding: 0.65rem;
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  margin: 0.5rem 0;
  padding-left: 1rem !important;
}

.btn-rajal {
  display: inline-block;
  font-weight: 400;
  line-height: 1.5;
  color: #212529;
  text-align: center;
  text-decoration: none;
  vertical-align: middle;
  cursor: pointer;
  -webkit-user-select: none;
  -moz-user-select: none;
  user-select: none;
  background-color: transparent;
  border: 1px solid transparent;
  padding: 0.375rem 0.75rem; /* 0.75rem */
  font-size: 1rem;
  border-radius: 0.25rem;
  transition: color 0.15s ease-in-out, background-color 0.15s ease-in-out, border-color 0.15s ease-in-out, box-shadow 0.15s ease-in-out;
}



/* bg-color  --------------------- start ---------------------------------- */
.bg-whitesmoke {
  background-color: whitesmoke !important;
}

.bg-gray-100 {
  background-color: #f8f9fa !important;
}
.bg-gray-200 {
  background-color: #e9ecef !important;
}

.bg-blue-38C3FB {
  background-color: #38C3FB;
}

.bg-blue-2F88FD {
  background-color: #2F88FD;
}

.bg-blue-1063CF {
  background-color: #1063CF;
}

.bg-linear-blue-purple {
  background: linear-gradient(to right, #00cc99 0%, #00ffff 100%);
}

.bg-footer-color {
  background-color: #1063CF; /* 1063CF blueBS->0d6efd e9ecef   */
}

.bg-linear-01-45 {
  background-color: #FA8BFF;
  background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BFF88 90%);
}

.bg-linear-01-225 {
  background-color: #FA8BFF;
  background-image: linear-gradient(225deg, #FA8BFF 0%, #2BD2FF 52%, #2BFF88 90%);
}

.bg-linear-02-225 {
  background-color: #FF3CAC;
  background-image: linear-gradient(225deg, #FF3CAC 0%, #784BA0 50%, #2B86C5 100%);
}

.bg-linear-uig-moonlit-asteroid {
  background: #0F2027;  /* fallback for old browsers */
  background: -webkit-linear-gradient(to right, #2C5364, #203A43, #0F2027);  /* Chrome 10-25, Safari 5.1-6 */
  background: linear-gradient(to right, #2C5364, #203A43, #0F2027); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-linear-uig-skyline {
  background-color: #1488cc;  /* fallback for old browsers */
  background-image: -webkit-linear-gradient(90deg, #0F2027, #2b32b2, #1488cc);  /* Chrome 10-25, Safari 5.1-6 */
  background-image: linear-gradient(90deg, #0F2027 0%, #2b32b2 51%, #1488cc 100%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}

.bg-linear-uig-skyline-180 {
  background-color: #1488cc;  /* fallback for old browsers */
  background-image: -webkit-linear-gradient(90deg, #0F2027, #2b32b2, #1488cc);  /* Chrome 10-25, Safari 5.1-6 */
  background-image: linear-gradient(90deg, #0F2027 0%, #2b32b2 51%, #1488cc 100%); /* W3C, IE 10+/ Edge, Firefox 16+, Chrome 26+, Opera 12+, Safari 7+ */
}
.bg-linear-sky-01 {
  background: rgb(195,202,237);
  background: linear-gradient(90deg, rgba(195,202,237,1) 0%, rgba(0,212,255,1) 44%, rgba(0,108,255,1) 100%);
}
.bg-linear-sky-02  {
  background: rgb(239,241,250);
  background: linear-gradient(90deg, rgba(239,241,250,1) 0%, rgba(0,212,255,1) 70%, rgba(29,118,238,1) 100%);
}
.bg-linear-sky-03 {
  background: rgb(239,241,250);
background: linear-gradient(90deg, rgba(239,241,250,1) 0%, rgba(0,212,255,1) 100%);
}


/* bg-color  ---------------------end ---------------------------------- */




ul.lab-list-padding > li {
  padding: 0.5rem 0 !important;
  list-style: none;
  padding-left: 0 !important;
}

/* nav-li-bt border top start */
.nav-li-bt {
  border-top: 3px solid transparent;
  padding: 0px 0.55rem;
}

.nav-li-bt:hover {
  border-top: 3px solid #212529;
  transition: 0.8s ease;
}

 /*nav-li-bt border top end */


 /* nav-list-border-bottom start */
.nav-list-border-bottom {
  border-bottom: 2px solid transparent;
  padding: 0px 0.55rem; /*0.55rem*/
}

.nav-list-border-bottom:hover {
  border-bottom: 2px solid rgba(0, 0, 0, 0.75); /* #212529 */
  transition: 1.2s ease;
  /* add animasi */
}

 /*nav-list-border-bottom end */



.kartu-box-shadow-primary {
  box-shadow: 0px 0px 30px 2px rgba(13, 110, 253, 0.2);
}
.kartu-box-shadow-purple {
  box-shadow: 0px 0px 30px 2px rgba(111,66,193, 0.2);
}

.kartu-box-shadow-orange {
  box-shadow: 0px 0px 30px 2px rgba(255, 193, 7, 0.2);
}
.kartu-box-shadow-success {
  box-shadow: 0px 0px 30px 2px rgba(25, 135, 84, 0.2);
}

.kartu-box-shadow-secondary {
  box-shadow: 0px 0px 30px 2px rgba(108, 117, 125, 0.25);
  border-radius: 0.5rem;
}


.list-border-bottom-jadwal-dokter {
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
  
  padding: 0.5rem 0;
}

.border-bottom-jam-praktek {
  border-bottom: 1px solid rgba(0, 0, 0, 0.15);
}


/* carousel 3d --------------------- start  -------------------------- */
.container-slide-3d {
  position: relative;
  width: 320px; /* 320px */
  margin: 0 auto ; /* 100px 0 auto 0 */
  margin-top: 6rem;
  perspective: 3000px; /* 1000px */
}

.carousel-slide-3d {
  position: absolute;
  width: 100%;
  height: 100%;
  transform-style: preserve-3d;
  animation: rotate360 160s infinite forwards linear ;
}

.image-3d {
  position: absolute;
  width: 300px;
  height: 187px;
  top: 20;
  left: 10;
  right: 10;
  background-size: cover;
  box-shadow: inset 0 0 0 2000px rgba(0, 0, 0, 0.4);
  display: flex;
}

.span-3d {
  margin: auto;
  font-size: 2rem;
}

@keyframes rotate360 {
  from {
    transform: rotateY(0deg);
  }
  to {
    transform: rotateY(-360deg);
  }
}

.image-3d:nth-child(1) {
  background-image: url("image-url");
  transform: rotateY(0deg) translateZ(430px);
}
.image-3d:nth-child(2) {
  background-image: url("image-url");
  transform: rotateY(40deg) translateZ(430px);
}
.image-3d:nth-child(3) {
  background-image: url("image-url");
  transform: rotateY(80deg) translateZ(430px);
}
.image-3d:nth-child(4) {
  background-image: url("image-url");
  transform: rotateY(120deg) translateZ(430px);
}
.image-3d:nth-child(5) {
  background-image: url("image-url");
  transform: rotateY(160deg) translateZ(430px);
}
.image-3d:nth-child(6) {
  background-image: url("image-url");
  transform: rotateY(200deg) translateZ(430px);
}
.image-3d:nth-child(7) {
  background-image: url("image-url");
  transform: rotateY(240deg) translateZ(430px);
}
.image-3d:nth-child(8) {
  background-image: url("image-url");
  transform: rotateY(280deg) translateZ(430px);
}
.image-3d:nth-child(9) {
  background-image: url("image-url");
  transform: rotateY(320deg) translateZ(430px);
}

/* carousel 3d -------------------------- end -------------- */


.layanan-flex-card {
  border: 1px solid rgba(33, 37, 41, 0.25);
  background-color: #fff;
}

.layanan-flex-card:hover {
  box-shadow: 0px 0px 30px 0px rgba(33, 37, 41, 0.2); /* box-shadow: 0px 0px 15px 1px rgba(33, 37, 41, 0.25); */
  transition: 1s;
}

.fasilitas-flex-card {
  border: 1px solid rgba(33, 37, 41, 0.25);
  background-color: whitesmoke;
}
.fasilitas-flex-card:hover {
  box-shadow: 0px 0px 30px 0px rgba(33, 37, 41, 0.2); /* box-shadow: 0px 0px 10px 1px rgba(33, 37, 41, 0.25); */
  transition: 1s;
}

.artikel-bs-card:hover {
  box-shadow: 0px 0px 30px 0px rgba(33, 37, 41, 0.2);
  transition: 1s;
}

/* small */
@media (min-width: 576px) {
  
}

/* medium */
@media (min-width: 768px) {
  
}

/* large */
@media (min-width: 992px) {
  
}

/* extra large */
@media (min-width: 1200px) {
  
}


/* extra extra large */
@media (min-width: 1400px) {
  
}


h1.fasilitas-kami {
  font-family: "Arial Black" !important;
  font-weight: ;
  background: -webkit-linear-gradient(#00cc99, #00ffff);
  -webkit-background-clip: text;
  -webkit-text-fill-color: transparent;
}



/* Gototopbtn --start color #0d6efd */
#idGoToTopBtn {
  display: none; /* none */
  position: fixed;
  z-index: 99;
  bottom: 20px;
  right: 10px;
  border: 1px solid #1488cc; /* none */
  outline: none;
  cursor: pointer;
  background-color: white ;
  color: #1488cc; /* #0d6efd */
  padding: 5px;
  border-radius: 5px;
  font-size: 22px;
  opacity: 0.75;

}
#idGoToTopBtn:hover {
  background-color: white;
  opacity: 1;
}

/* Gototopbtn --end */


.w-66 {
  width: 66.66% !important;
}

.w-33 {
  width: 33.33% !important;
}


/* medium */
@media (min-width: 768px) {
  .w-medium-66 {
    width: 66.66% !important;
  }
  .w-medium-33 {
    width: 33.33% !important;
    
  }
}

.navbar-shadow-grey {
  box-shadow: 0px 3px 12px 1px rgba(0, 0, 0, 0.15);
}


/* breadcrrumb -- start -- */
.breadcrumb-isi {
  font-size: 0.9rem;
  
}

nav.breadcrumb-isi a {
  text-decoration: none;
}

.breadcrumb-position {
  padding-left: 1rem;
  padding-top: 4.5rem;
}
/* breadcrrumb -- end -- */


#semuaArtikelBaris02 {
  display: none;
}
.artikel-button-01 {
  display: block;
}

#semuaArtikelBaris03 {
  display: none;
}
.artikel-button-02 {
  display: block;
}

.artikel-button-style {
  padding: 0.5rem 3rem;
  text-align: center;
  background-color: rgba(0, 0, 0, 0.15);
  border: none;
  border-radius: 8px;
  width: 100%;
  color: #000;
  cursor: pointer;
  text-decoration: none;
  font-size: 1rem;
}

/* kartu */
.kartu-no-border {
  position: relative;
  display: flex;
  flex-direction: column;
  min-width: 0;
  word-wrap: break-word;
  background-color: #fff;
  background-clip: border-box;
  /* border: 1px solid rgba(0, 0, 0, 0.125); */
  border-radius: 0.25rem; /* 0.25 */
}



/* max-medium */
@media (max-width: 767px) {
  
  .artikel-img-sm-hide{
    display: none !important;
  }
  /*
  .artikel-text-bg-color {
  background-color: #FA8BFF;
  background-image: linear-gradient(45deg, #FA8BFF 0%, #2BD2FF 52%, #2BFF88 90%);
  }
  */

  .artikel-border-left-baris-01 {
  border-left: 4px solid #0d6efd;  
  }

  .artikel-border-left-baris-02 {
    border-left: 4px solid #ffc107;  
  }

}


.image-w-100-h-200px {
  width: 100%;
  height: 200px !important;
  display: block;
}


.artikel-img-license {
  position: absolute;
  left: 5px;
  bottom: 5px;
  font-size: 0.75rem;
}



.artikel-flex-container {
  display: flex;
  flex-wrap: nowrap;
  /* border: 1px solid rgba(0, 0, 0, 0.2); */
  /* padding: 0.15rem; */
  border-radius: 0.5rem; /* 0.25rem */
  box-shadow: 0px 0px 30px 0px rgba(0, 0, 0, 0.2); /*  box-shadow: 0px 0px 20px 2px rgba(0, 0, 0, 0.125); */
  margin-left: 0 !important;
  margin-right: 0 !important;
}

.artikel-img-abc {
  border-radius: 0.5rem 0 0 0.5rem;
}

.artikel-flex-left {
  
  flex: 33%;
  
}

.artikel-flex-right {
  
  flex: 67%;  
  position: relative;
}

.artikel-small-text {
  position: absolute;
  top: 50%;
  left: 14px;
  transform: translate(0%,-50%);  
  /* border: 1px solid grey; */
   /*
  
  
  
  white-space: nowrap; */
}

.artikel-flex-right a.artikel-a-link {
  color: #212529;
}

.img-artikel-border-radius-top {
  border-top-left-radius: 0.25rem;
  border-top-right-radius: 0.25rem;
}

.artikel-all-page-a-link {
  display: block;
  text-align: center;
  color: #212529;
  text-decoration: none;
}

.artikel-all-page-a-link:hover {
  color: #212529;
  opacity: 0.8;
  transition: 0.4s;
}

.jangmed-all-page-a-link {
  display: block;
  text-align: center;
  color: #212529;
  text-decoration: none;
}

.jangmed-all-page-a-link:hover {
  color: #212529;
  opacity: 0.8;
  transition: 0.4s;
}




.main-artikel-top-img-container {
  box-shadow: 0 0 20px 2px rgba(0, 0, 0, 0.15);
}

.main-artikel-top-img-sm {
  width: 100%; 
  /* border: 1px solid rgba(0, 0, 0, 0.125); */
  height: auto; /*  height: 200px; */
  background-color: ;
   margin: 0 auto;
  margin-top: 5.5rem; 
  box-shadow: 0 0 25px 2px rgba(0, 0, 0, 0.15);
  border-radius: 0.35rem;
}

.box-shadow-grey-15 {
  box-shadow: 0 0 25px 2px rgba(0, 0, 0, 0.15);
}

/* map google */

/* Set the size of the div element that contains the map */
#map {
  height: 400px; /* The height is 400 pixels */
  width: 100%; /* The width is the width of the web page */
}