/* MIT License */
/* Copyright (c) 2019 Maykheld (http://www.maykheld.com) */

.myk-ava,.myk-btn,.myk-list,.myk-name,.myk-panel,.myk-wa-icon,.myk-who,.myk-number,
.myk-panelhead,.myk-wa-icon,.myk-paneltitle{margin: 0;padding: 0; font-family: Arial, Helvetica, sans-serif}

.myk-btn{position: fixed;width: 50px;height: 50px;line-height: 45px;border-radius: 50%;text-align: center;background-color: #25D366;bottom: 10px;right: 20px;z-index: 999;color: #fff;font-size: 20px;-webkit-box-shadow: 0 3px 6px 0 rgba(0,0,0,.16);-moz-box-shadow: 0 3px 6px 0 rgba(0,0,0,.16);box-shadow: 0 3px 6px 0 rgba(0,0,0,.16);cursor: pointer;transition: all 0.5s;}
.myk-btn:hover{opacity: 0.7}
.myk-btn img{width: 30px}

.myk-panel{position: fixed;right: 30px;bottom:70px;background-color: #ECE5DD;width: 300px; height:0px;box-shadow: 0px 0px 10px #075E54;overflow-y: hidden;border-radius: 5px; transition: all 0.5s ease-out;z-index: 999; }
.myk-panel .myk-list{background-color: #ffffff;overflow: hidden;display: block; padding: 20px 10px;color:#333; text-decoration: none; font-family: Arial, Helvetica, sans-serif;border-bottom: 2px solid #cccccc}
.myk-panel .myk-ava {width: 40px;float: left;margin-right:20px }
.myk-panelhead{background-color: #25D366;text-align: center;color: white;height: 70px;}

.myk-panelhead .myk-paneltitle img{width:30px; margin-top:-5px;}
.myk-paneltitle{font-size: 24px;line-height: 28px;font-weight: lighter}
.myk-show{height:280px}
.myk-panelbody{overflow-y: scroll;height: calc(100% - 100px)}

@media only screen and (max-width: 400px) {
    .myk-panel{width: 100%;right: 0;top: 0;bottom: 0;}
    .myk-panel.myk-show{height: 100%}
}
.myk-close{display: block;background-color: #075E54;cursor: pointer;opacity: 0.4;text-align: center;width: 50px;transition: ease all 0.3s;overflow: hidden;}
.myk-close:hover{opacity: 0.6;}