@import url('https://fonts.googleapis.com/css2?family=Lato:ital,wght@0,300;0,400;0,700;1,300;1,400;1,700&display=swap');
body {
  font-family: 'Lato', sans-serif!important;
  font-size: 14px;
  color: #444;
}
video[poster]{
  object-fit: cover;
} 
.icon-video{
  background: #530058;
  position: absolute;
  top:0px;
  left: 0px;
  z-index: 2;
  padding:4px 8px;
  color: #fff;
  font-size: 10px;
  display: inline-block;
}
.icon-video i{color: #fff!important;font-size: 12px!important;}
a{text-decoration: none!important;color: #444;}
a:hover{
  color: #8364a9;
}
.lazyload {
    opacity: 0;
} 
.lazyloading {
    opacity: 1;
    transition: opacity 300ms;
    background: #f7f7f7 url('../../svg/rolling-1s-32px.svg') no-repeat center;
}
.box-testimonials{
  padding: 30px;
  border-bottom: 1px dashed #d5c9e5;
}
.box-testimonials:last-child{
  border:none;
}
.fixed-top{
  position: fixed;
  background: #fff;
  box-shadow: 0 0 15px 0 rgba(24, 24, 24, .15);
}
.menu-btn{
  background: purple;
  padding: 2px 10px;
  text-align: center;
}
.menu-btn i{color: #fff;}
h1,
h2,
h3,
h4,
h5,
h6 {
  color: #530058;
}
.loadmore_btn{
  background: purple;
  border:none;
  color: #fff;
  padding: 8px 30px;
  cursor: pointer;
}
.box-obituary{
  padding: 15px 15px 90px 15px;
  border:1px solid #ddd;
  margin-bottom: 40px;
  border-radius: 8px;
  position: relative;
  cursor: pointer;
}
.box-obituary span{
  border-radius: 4px;
  top:-26px;
  position: relative;
  margin:0 auto;
  padding: 4px 8px;
  background: purple;
  color: #fff;
  font-size: 10px;
}
.flower{
  position: absolute;
  top:70;
  width: 200px;
  left: 50%;
  margin-left:-100px; 
  padding: 30px 0;
}
.flower img{width: 100%;margin:0 auto;}
.box-artikel a{
  color: #000;
}
.box-artikel-img{
  overflow: hidden;
  height: 200px; 
}
@media screen and (max-width: 640px){
  .box-artikel-img{
    overflow: hidden;
    height: auto; 
  }
}
.box-artikel-img img{ 
  object-fit: contain;
}
.box-artikel span{
  font-size: 12px;
  color: #8364a9;
}
.breadcrumbs{
  background: url(../../images/breadcrumbs.jpg) no-repeat top center;
  padding: 60px 0;
  text-align: center;
  font-size: 36px;
  color: #fff;
  font-weight: 300;
}
.breadcrumbs span{font-size: 12px;color: #fff;}
.top-navbar {
  background: #530058;
  padding: 15px 0;
}

.top-navbar span {
  font-size: 12px;
  font-weight: 300;
  color: #8364a9;
}

.top-navbar h6 {
  margin: 0;
}

.top-navbar a {
  color: #fff;
}

.light {
  font-weight: 300;
}

.bold {
  font-weight: 700
}

.selengkapnya {
  margin-top: 15px;
  background: #530058;
  display: inline-block;
  text-align: center;
  color: #fff;
  padding: 10px 30px;
}

.pelayanan-bg {
  background: #fafafa;
}

.box-layanan{position: relative;overflow: hidden;cursor: pointer;}
.box-layanan img{
  transition: transform 2s;
}
.box-layanan img:hover{
  transform: scale(1.2);
}
.box-layanan-title{
  position: absolute;
  background: rgba(0,0,0,.5);
  padding: 8px;
  display: block;
  color: #fff;
  z-index: 2; 
  bottom: 0;
  left: 0;
  width: 100%;
  text-align: center;
}
.header-middle_area>.container {
  position: relative;
}
.parallax{
  padding: 60px 0;
  color: #fff;
  font-size: 24px;
  background: url(../../images/parallax.jpg)no-repeat center top;
}
.parallax span{font-size: 18px;}
#slider_testimonial{
  font-size: 18px;
  line-height: 30px;
  font-weight: 300;
}
.btn-testimonial{
  background: #530058;
  color: #fff;
  border:none;
  border-radius: 4px;
  padding: 8px 15px;
  cursor: pointer;
} 
@media only screen and (min-width: 576px) and (max-width: 767px) {
  .header-middle_area {
    padding-top: 30px;
  }
}
.menu-sidebar ul{padding: 0;}
.menu-sidebar li{
  display: block;
  line-height: 30px;
  color: #000; 
  border-bottom: 1px solid #ddd;
}
.menu-sidebar li a{
  color:#000;
  text-decoration: none;
}
.menu-sidebar li a:hover{
  color: purple;
}
/* ---Home One--- */

.hm-menu>nav>ul>li {
  display: inline-block;
  padding-right: 15px;
  margin-bottom: 0;
}

.hm-menu>nav>ul>li>a {
  color: #000;
}

.hm-menu>nav>ul {
  margin-bottom: 0;
}

.hm-menu>nav>ul>li:last-child {
  padding-right: 0;
}

.hm-menu>nav>ul>li:hover>a {
  color: #212121;
}

.hm-menu>nav>ul>li .hm-dropdown {
  position: absolute;
  background: #ffffff;
  width: auto;
  padding: 15px;
  -webkit-transform-origin: 0 0 0;
  transform-origin: 0 0 0;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  box-shadow: 0 1px 2px 2px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease-in-out;
  z-index: 9;
}

.hm-menu>nav>ul>li .hm-dropdown>li a {
  color: #212121;
  text-decoration: none;
  line-height: 28px;
}

.hm-menu>nav>ul>li:hover .hm-dropdown {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}

.hm-menu>nav>ul>li .hm-dropdown2 {
  position: absolute;
  background: #ffffff;
  width: auto;
  right: 0;
  padding: 15px;
  -webkit-transform-origin: 0 0 0;
  transform-origin: 0 0 0;
  -webkit-transform: scaleY(0);
  transform: scaleY(0);
  box-shadow: 0 1px 2px 2px rgba(0, 0, 0, 0.2);
  transition: all 0.3s ease-in-out;
  z-index: 9;
  width: 150px;
}

.hm-menu>nav>ul>li .hm-dropdown2>li a {
  color: #212121;
  text-decoration: none;
  line-height: 28px;
  text-align: right;
}

.hm-menu>nav>ul>li:hover .hm-dropdown2 {
  -webkit-transform: scaleY(1);
  transform: scaleY(1);
}

.hm-menu>nav>ul>li>ul>li {
  position: relative;
  display: block;
}

.hm-menu>nav>ul>li>ul>li>ul.hm-sub_dropdown {
  top: 30px;
  left: 100%;
  opacity: 0;
  visibility: hidden;
}

.hm-menu>nav>ul>li>ul>li>a {
  display: block;
}

.hm-menu>nav>ul>li>ul>li>a>i {
  position: absolute;
  top: 14px;
  right: 25px;
  display: block;
  font-size: 12px;
  -webkit-transform: rotate(0);
  transform: rotate(0);
  transition: all 0.3s ease-in-out;
}

.hm-menu>nav>ul>li>ul>li:hover>.hm-sub_dropdown {
  top: 0;
  opacity: 1;
  visibility: visible;
}

.hm-menu>nav>ul>li>ul>li:hover>a>i {
  -webkit-transform: rotate(-90deg);
  transform: rotate(-90deg);
}

.hm-menu>nav>ul>li>a {
  font-family: "Heebo";
  display: block;
  font-weight: bold;
  text-transform: uppercase;
  line-height: 60px;
}

.hm-menu>nav>ul>li>a>i {
  font-size: 10px;
  line-height: 1;
  padding-left: 8px;
  top: -2px;
  position: relative;
}


/*----------------------------------------*/


/*  19 - Components - Navigation
/*----------------------------------------*/


/* ---Offcanvas Menu Wrapper--- */

.offcanvas-menu-wrapper .offcanvas-menu-inner {
  position: fixed;
  top: 0;
  right: -285px;
  width: 285px;
  height: 100%;
  background: #ffffff;
  z-index: 9999;
  visibility: hidden;
  transition: all 0.3s ease-in-out;
}

ul.offcanvas-menu {
  padding: 0;
  display: block;
}

@media (max-width: 575px) {
  .offcanvas-menu-wrapper .offcanvas-menu-inner {
    width: 270px;
  }
}

.offcanvas-menu-wrapper.open .offcanvas-menu-inner {
  left: auto;
  right: 0;
  visibility: visible;
  padding: 30px 0 0;
}


/* ---Offcanvas Navigation Area--- */

.offcanvas-navigation .offcanvas-menu {
  overflow-y: auto;
  min-height: 165px;
}

.offcanvas-navigation .offcanvas-menu>li {
  height: 100%;
}

.offcanvas-navigation .offcanvas-menu>li>a span {
  position: relative;
  font-weight: 600;
}

.offcanvas-navigation .offcanvas-menu li {
  position: relative;
}

.offcanvas-navigation .offcanvas-menu li>.menu-expand {
  position: absolute;
  right: 0;
  top: 2px;
  width: 50px;
  height: 100%;
  line-height: 40px;
  cursor: pointer;
  text-align: center;
  margin-right: 4px;
  transition: all 0.3s ease-in-out;
}

.offcanvas-navigation .offcanvas-menu li a {
  font-size: 13px; 
  text-transform: uppercase;
  display: block;
  padding: 8px;
  color: #000;
}

.offcanvas-navigation .offcanvas-menu li .sub-menu {
  padding-left: 10px;
}

.offcanvas-navigation .offcanvas-menu li .sub-menu li a {
  text-transform: capitalize;
  font-size: 13px;
}

.offcanvas-navigation .offcanvas-menu li.menu-open>.menu-expand i:before {
  content: '\f068';
}

.offcanvas-navigation .offcanvas-menu li:hover>a {
  color: #8b6b43 !important;
}

.offcanvas-navigation .offcanvas-menu li:hover>.menu-expand {
  color: #8b6b43 !important;
}


/* ---Offcanvas Menu button--- */

.menu-btn {
  display: none;
}

@media (max-width: 991px) {
  .menu-btn {
    position: absolute;
    display: block;
    top: 15px;
    right: 15px;
    font-size: 24px;
  }
}


/* ---Offcanvas Close Button--- */

.btn-close {
  position: absolute;
  top: 0;
  left: -60px;
  background: #450049;
  width: 60px;
  height: 60px;
  line-height: 63px;
  text-align: center;
  color: #ffffff;
  z-index: 10;
  font-size: 24px;
  transition: all 0.3s ease-in-out;
}

@media (max-width: 479px) {
  .btn-close {
    left: -50px;
    width: 50px;
  }
}

.btn-close:hover {
  background-color: #8b6b43;
  color: #ffffff !important;
}

.btn-close:hover>i {
  -webkit-transform: rotate(90deg);
  transform: rotate(90deg);
}

.btn-close>i {
  -webkit-transform: rotate(0);
  transform: rotate(0);
  transition: all 0.3s ease-in-out;
}


/* ---Offcanvas Search Area--- */

.offcanvas-search {
  position: absolute;
  z-index: 9;
  top: 0;
  left: 0;
  width: calc(100% - 0px);
  padding: 10px;
  background-color: #e5e5e5;
}

.offcanvas-search .hm-searchbox {
  position: relative;
}

.offcanvas-search .hm-searchbox>input {
  background-color: #e5e5e5;
  border: 0;
  height: 40px;
  line-height: 40px;
  width: 100%;
  padding: 0 52px 0 15px;
}

.offcanvas-search .hm-searchbox>.search_btn {
  position: absolute;
  top: 13px;
  right: 18px;
  border: 0;
  background: transparent;
  color: #212121;
}


.ht-offcanvas_navigation {
  padding-top: 25px;
}

.ht-offcanvas_navigation>ul>li>a>span {
  text-transform: capitalize;
}



.footer{
  padding: 60px 0;
  background: #530058; 
  color: #fff;
}  
.footer-widgets > ul{
  padding-left:0; 
}
.footer-widgets > ul > li {
  position: relative;
  display: block; 
  transition: all 0.3s ease-in-out;
  font-size: 14px;
  text-decoration: none;
  padding-bottom: 10px;
}

.footer-widgets > ul > li:last-child {
  padding-bottom: 0;
}

.footer-widgets > ul > li:hover {
  padding-left: 10px;
}

.footer-widgets > ul > li:hover > a,
.footer-widgets > ul > li:hover > a:before {
  color: #8364a9;
  text-decoration: none;
}

.footer-widgets > ul > li > a {
  color: #fff;
}

.footer-widgets > ul > li > a:before {
  content: "\f054";
  font-family: 'Font Awesome\ 5 Free';
  font-weight: 600;
  color: #fff;
  font-size: 10px;
  margin-right: 5px;
  vertical-align: middle;
}

/* ---Footer Bottom Area--- */
.footer-bottom_area {
  padding: 15px 0;
  background: #000;
}

.footer-bottom_area .copyright { 
  text-align: center;
}

@media (max-width: 767px) {
  .footer-bottom_area .copyright {
    text-align: center;
    padding-bottom: 30px;
  }
}

.footer-bottom_area .copyright > span {
  color: #fff;
}

.footer-bottom_area .copyright > span > a {
  color: #fff !important;
}

.social-link > ul{
  padding-left: 0;
}

.social-link > ul > li {
  display: inline-block;
  padding-right: 10px;
}

.social-link > ul > li:last-child {
  padding-right: 0;
}

.social-link > ul > li > a {
  width: 40px;
  height: 40px;
  line-height: 43px;
  border-radius: 100%;
  background-color: #393939;
  text-align: center;
  color: #ffffff;
  display: block;
}

.social-link > ul > li > a:hover {
  color: #ffffff !important;
}

.social-link > ul > li:hover.facebook > a {
  background-color: #3b579d;
}

.social-link > ul > li:hover.twitter > a {
  background-color: #3acaff;
}

.social-link > ul > li:hover.youtube > a {
  background-color: #d72525;
}

.social-link > ul > li:hover.whatsapp > a {
  background-color: #24d366;
}

.social-link > ul > li:hover.google-plus > a {
  background-color: #dd4b39;
}

.social-link > ul > li:hover.instagram > a {
  background-color: #833ab4;
}