.btn-warning{
  background-color: #d1a04b;
}
/* 
---------------------------------------------
Contact Start
--------------------------------------------- 
*/
#whatsapp-chat{
    position:fixed;
    background:#fff;
    width:350px;
    border-radius:10px;
    box-shadow:0 1px 15px rgba(32,33,36,.28);
    bottom:90px;
    right:30px;
    overflow:hidden;
    z-index:99;
    animation-name:showchat;
    animation-duration:1s;
    transform:scale(1)
}
a.blantershow-chat{
    background:#1b3c35;
    color:#fff;
    position:fixed;
    z-index:98;
    bottom:25px;
    right:30px;
    font-size:15px;
    padding:10px 20px;
    border-radius:30px;
    box-shadow:0 1px 15px rgba(32,33,36,.28)
}
a.blantershow-chat i{
    transform:scale(1.2);
    margin:0 10px 0 0
}
.header-chat{
    background:#1b3c35;
    color:#fff;
    padding:20px
}
.header-chat h3{
    margin:0 0 10px
}
.header-chat p{
    font-size:14px;
    line-height:1.7;
    margin:0
}
.info-avatar{
    position:relative
}
.info-avatar img{
    border-radius:100%;
    width:50px;
    height: 50px;
    float:left;
    margin:0 10px 0 0
}
.info-avatar:before{
    content:'\f232';
    z-index:1;
    font-family:"Font Awesome 5 Brands";
    background:#23ab23;
    color:#fff;
    padding:4px 5px;
    border-radius:100%;
    position:absolute;
    top:30px;
    left:30px
}
a.informasi{
    padding:20px;
    display:block;
    overflow:hidden;
    animation-name:showhide;
    animation-duration:2.5s
}
a.informasi:hover{
    background:#f1f1f1
}
.info-chat span{
    display:block
}
#get-label,span.chat-label{
    font-size:12px;
    color:#888
}
#get-nama,span.chat-nama{
    margin:5px 0 0;
    font-size:15px;
    font-weight:700;
    color:#222
}
.wa-online{
  
}
.wa-online:before{
    content:"";
    padding:5px;
    margin-right:4px;
    background:#27ae60;
    border-radius:100px;
    display:inline-block
}
#get-label,#get-nama{
    color:#fff
}
span.my-number{
    display:none
}
.blanter-msg{
    color:#444;
    padding:20px;
    font-size:12.5px;
    text-align:center;
    border-top:1px solid #ddd
}
textarea#chat-input{
    border:none;
    font-family:'Arial',sans-serif;
    width:100%;
    height:20px;
    outline:none;
    resize:none
}
a#send-it{
    color:#555;
    width:40px;
    margin:-5px 0 0 5px;
    font-weight:700;
    padding:8px;
    background:#eee;
    border-radius:10px
}
.first-msg{
    background:#f5f5f5;
    padding:30px;
    text-align:center
}
.first-msg span{
    background:#e2e2e2;
    color:#333;font-size:14.2px;
    line-height:1.7;
    border-radius:10px;
    padding:15px 20px;
    display:inline-block
}
.start-chat .blanter-msg{
    display:flex
}
#get-number{
    display:none
}
a.close-chat{
    position:absolute;
    top:5px;
    right:15px;
    color:#fff;
    font-size:30px
}
@keyframes showhide{
  from{transform:scale(.5);
    opacity:0
  }
}
@keyframes showchat{from{
  transform:scale(0);
  opacity:0
  }
}

@media screen and (max-width:480px){
  #whatsapp-chat{
    width:auto;
    left:5%;
    right:5%;
    font-size:80%
  }
}

.hide{
    display:none;
    animation-name:showhide;
    animation-duration:1.5s;
    transform:scale(1);
    opacity:1
}
.show{
    display:block;
    animation-name:showhide;
    animation-duration:1.5s;
    transform:scale(1);
    opacity:1
}
/* 
---------------------------------------------
Card Price
--------------------------------------------- 
*/
@media (max-width:550px){
  .plist{
    grid-template-columns:repeat(1,1fr)
  }
  .plist .itemplist:nth-child(2){
    top:0
  }
}
.innerplist{
  background:#fff;
  padding:3rem;
  border-radius:.8125rem;
  border: 2px solid transparent;
  box-shadow:0 4px 12px 0 rgba(21, 19, 41, 0.404);
  display:flex;
  flex-direction:column;
  align-items:center
}
.innerplist:hover{
  border-color: #d1a04b;
}
.innerplist h3{
  text-align:center;
  font-size:2.4rem;
  margin-bottom:9px;
  color: #1b3c35;
}
.innerplist b{
  font-size:28px;
  color:#d1a04b;
}
.innerplist span{
  text-align:center;
  line-height:26px;
  margin: 1rem 0;
}
.innerplist ul{
  grid-gap: 7px;
  display: grid;
  margin:2rem 0;
  list-style:none
}
.innerplist ul li{
  display:flex;
  align-items:center;
  grid-gap:1rem;
  font-size:16px;
  color:#333
}
.actplist{
  width: 100%;
  text-align:center;
  display:inline-flex;
  flex-direction:column;
  padding:1rem 0 0;
  border-top:1px solid rgba(1,1,1,0.18);
  align-items:center
}
.actplist a {
  width:100%;
  justify-content:center;
  grid-gap:4px;
  padding:2rem 2rem;
  text-transform:uppercase
}
.plist .itemplist{
  padding:3px;
  border-radius:.875rem;
}
.plist .itemplist:nth-child(2) .innerplist{
  border: 0 !important;
}
.innerplist ul li {
  display: block;
  padding-bottom: 5px;
  border-bottom: 1px solid #eee;
  text-align: left;
  font-size: 18px;
  color: #5e5959;
  font-weight: 300;
}
 .innerplist ul li:last-child {
  border-bottom: none;
  padding-bottom: 0;
  margin-bottom: 0;
}
.innerplist ul li svg{
  padding:2px;
  background:#1b3c35;
  stroke:#fff;
  width:20px;
  border-radius:100%;
  height:20px
}
.innerplist ul li span {
  font-size: 20px;
  color: #1e1e1e;
  font-weight: 700;
  float: right;
  text-align: right;
  display: inline-block;
} 
.img-fluid-price {
  max-width: 100%;
  height: auto;
  box-shadow:0 4px 12px 0 rgba(21, 19, 41, 0.404);
  border-radius:.8125rem;
  border: 2px solid transparent;
  padding:0.05rem;
  background: #d1a04b; 
}
/* 
---------------------------------------------
Pre-loader Style
--------------------------------------------- 
*/
.js-preloader {
  position: fixed;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  background-color: rgba(0,0,0,0.99);
  display: -webkit-box;
  display: flex;
  -webkit-box-align: center;
  align-items: center;
  -webkit-box-pack: center;
  justify-content: center;
  opacity: 1;
  visibility: visible;
  z-index: 9999;
  -webkit-transition: opacity 0.25s ease;
  transition: opacity 0.25s ease;
}

.js-preloader.loaded {
  opacity: 0;
  visibility: hidden;
  pointer-events: none;
}

@-webkit-keyframes dot {
  50% {
      -webkit-transform: translateX(96px);
      transform: translateX(96px);
  }
}

@keyframes dot {
  50% {
      -webkit-transform: translateX(96px);
      transform: translateX(96px);
  }
}

@-webkit-keyframes dots {
  50% {
      -webkit-transform: translateX(-31px);
      transform: translateX(-31px);
  }
}

@keyframes dots {
  50% {
      -webkit-transform: translateX(-31px);
      transform: translateX(-31px);
  }
}

.preloader-inner {
  position: relative;
  width: 142px;
  height: 40px;
  background: transparent;
}

.preloader-inner .dot {
  position: absolute;
  width: 16px;
  height: 16px;
  top: 12px;
  left: 15px;
  background: #d1a04b;
  border-radius: 50%;
  -webkit-transform: translateX(0);
  transform: translateX(0);
  -webkit-animation: dot 2.8s infinite;
  animation: dot 2.8s infinite;
}

.preloader-inner .dots {
  -webkit-transform: translateX(0);
  transform: translateX(0);
  margin-top: 12px;
  margin-left: 31px;
  -webkit-animation: dots 2.8s infinite;
  animation: dots 2.8s infinite;
}

.preloader-inner .dots span {
  display: block;
  float: left;
  width: 16px;
  height: 16px;
  margin-left: 16px;
  background: #d1a04b;
  border-radius: 50%;
}