#tombol-wa {
     left: 10px;
     bottom: 10px;
     z-index: 999;
     position:fixed;
}

#tombol-wa img {
     height: 80px;
}

#clickHotline {
     width:50px;
     height:50px;
     position:fixed;
     bottom:20px;
     right:10px;
     cursor:pointer;
     z-index:999;
     background: url(../../../images/frontend/2/hotline.png) center center no-repeat;
     border:none;
}
#semuaHotlineCaption {
     position:fixed;
     bottom:70px;
     right:10px;
     z-index:998;
     background: white;
     padding: 10px;
     font-size: 16px;
     border-radius: 15px;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
}
#semuaHotline {
     position:fixed;
     bottom:-1000px;
     right:10px;
     z-index:999;
     opacity:0;
     background: #282828;
     padding: 20px;
     border-radius: 15px;
     box-shadow: 0 4px 8px 0 rgba(0, 0, 0, 0.2), 0 6px 20px 0 rgba(0, 0, 0, 0.19);
     border: 1px solid white;
     color: white;
}
.kliklangsung {font-size: 12px;}



.hotline-atas a {
     color: white;
     background-image: linear-gradient(#545454, black);
     padding:10px 20px;
     border-radius: 25px;
     border: 1px solid black;
     font-size: 12px;
     box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
}
.hotline-atas a:hover {
     background-image: linear-gradient(black, #545454);
     color: #f60;
}
.hotline-atas img {
     height: 20px;
}


.hotline-bawah li{
     border-bottom:1px solid #444140;
     display: grid;
     grid-template-columns: 1fr 1fr;
     padding-bottom: 10px;
     margin-bottom: 10px;
}

.hotline-bawah strong {
     justify-content: flex-start;
     align-content: center;
     display: grid;
     font-size: 13px;
}

.hotline-bawah span {
     justify-content: flex-end;
     align-content:flex-end;
     display: grid;
}



.hotline-bawah a  {
     color: white;
     background-image: linear-gradient(white, #cbcbcb);
     padding:10px 20px;
     border-radius: 25px;
     border: 1px solid black;
     font-size: 12px;
     box-shadow: 1px 2px 4px rgba(0, 0, 0, .5);
     color:#FD5503;
     justify-content: center;
     align-content: center;
     display: grid;
}
.hotline-bawah a:hover  {
     background: black;
     color: #f60;

}
.hotline-bawah img {
     height: 20px;
     margin-right: 5px;
}

@media (max-width: 768px){
     .hotline-atas-container {
          margin-top: 20px;
     }
     .hotline-atas li {
          display: grid;
          grid-template-columns: 1fr 1fr;
          padding-bottom: 10px;
          margin-bottom: 10px;
          border-bottom: 1px solid #c2c3c3;
     }
     .hotline-atas strong {
          justify-content: flex-start;
          align-content: center;
          display: grid;
     }
     .hotline-atas a {
          justify-content: center;
          align-content: center;
          display: grid;
     }
     .hotline-atas span {
          justify-content: flex-end;
          align-content:flex-end;
          display: grid;
     }
}
@media (min-width: 768px){
     .hotline-atas-container {
          justify-content: flex-end;
          align-content: center;
          display: grid;
     }
     .hotline-atas li {
          text-align: right;
          margin-bottom: 10px;
     }
}
@media (min-width: 992px){
     .hotline-atas li {
          float: left;
          margin-left: 10px;
     }
}
