/*
Style for: muo-whatsapp
Author: Luan Novais
Author URI: https://github.com/luan11/
Description: Easy way to insert the floating button for Message us on Whatsapp.
Version: 2.0.0
*/
.muow{position:fixed;z-index:999;right:32px;bottom:32px}.muow *{font-family:'Open Sans',sans-serif;outline:0}.muow button{cursor:pointer;padding:0}.muow-chat{transition:transform .2s ease-in-out .3s,opacity .2s ease-in-out;opacity:0;transform:scale(0);position:absolute;bottom:56px;right:0;background-color:#ECE5DD;width:300px;height:150px;border-radius:8px;display:flex;flex-direction:column;align-items:flex-start;justify-content:flex-start;-webkit-animation:softdown .3s linear;animation:softdown .3s linear}.muow-chat.open{transition:opacity .3s ease-in-out .1s;opacity:1;transform:scale(1);-webkit-animation:softup .4s linear;animation:softup .4s linear}.muow-chat::after{content:'';position:absolute;width:32px;height:32px;transform:rotate(45deg);background:#ECE5DD;right:30px;bottom:-12px}.muow-chat>#muow-close{transition:z-index .3s ease-in-out .3s,transform .3s ease-in-out,opacity .3s ease-in-out;position:absolute;height:24px;width:24px;border:0;right:16px;top:-12px;background-color:#FFF;border-radius:50%;box-shadow:0 2px 6px rgba(0,0,0,.45)}.muow-chat>#muow-close:hover{transition:all .35s ease-in-out 0s;box-shadow:0 2px 8px rgba(0,0,0,.75)}.muow-chat>.header{border-top-left-radius:8px;border-top-right-radius:8px;background-color:#075E54;padding:6px 0;display:flex;align-items:center;justify-content:flex-start;width:100%}.muow-chat>.header .profile-picture{border-radius:50%;width:32px;height:32px;margin-left:12px}.muow-chat>.header .profile-name{margin:0 12px 0 10px;color:#FFF;font-weight:600;line-height:19px;font-size:14px}.muow-chat>.date{background-color:#dbf2fd;color:#34B7F1;text-transform:uppercase;padding:2px 8px;border-radius:4px;font-weight:600;font-size:10px;display:block;margin:8px auto 0;box-shadow:0 1px 4px rgba(0,0,0,.1)}.muow-chat>.main{z-index:1;width:100%;margin:auto 0 18px;display:flex;position:relative}.muow-chat>.main>.muow-control{margin:0 10px}.muow-chat>.main>#muow-send{transition:all .3s ease-in-out 0s;width:42px;height:42px;background-color:#075E54;border:0;border-radius:50%;display:block;position:absolute;right:10px;top:0;bottom:0;margin:auto 0}.muow-chat>.main>#muow-send:focus,.muow-chat>.main>#muow-send:hover{background-color:#128C7E}.muow-control{border:0;height:35px;border-radius:17.5px;padding:0 15px;font-size:12.5px;line-height:16px;color:#000;width:100%;box-shadow:0 2px 4px rgba(0,0,0,.15)}.muow-control::-webkit-input-placeholder{transition:all .3s ease-in-out 0s;color:#ACACAC}.muow-control::-moz-placeholder{transition:all .3s ease-in-out 0s;color:#ACACAC}.muow-control:-ms-input-placeholder{transition:all .3s ease-in-out 0s;color:#ACACAC}.muow-control::-ms-input-placeholder{transition:all .3s ease-in-out 0s;color:#ACACAC}.muow-control::placeholder{transition:all .3s ease-in-out 0s;color:#ACACAC}.muow-control:focus::-webkit-input-placeholder{color:#FFF}.muow-control:focus::-moz-placeholder{color:#FFF}.muow-control:focus:-ms-input-placeholder{color:#FFF}.muow-control:focus::-ms-input-placeholder{color:#FFF}.muow-control:focus::placeholder{color:#FFF}.muow-icon{transition:all .3s ease-in-out 0s;display:block;margin:auto}.muow #muow-trigger{position:absolute;right:22px;bottom:0;transition:all .3s ease-in-out 0s;width:48px;height:48px;border:0;display:block;background-color:#25D366;border-radius:50%;box-shadow:0 2px 4px rgba(0,0,0,.4)}.muow #muow-trigger:hover{background-color:#3D9D61;box-shadow:0 2px 4px rgba(0,0,0,.65)}.muow #muow-trigger.active{background-color:#368A56;box-shadow:0 0 8px rgba(0,0,0,.75)}.muow #muow-trigger.active>.muow-icon{transform:scale(.83)}@-webkit-keyframes softup{0%{transform:translateY(30%) scale(1)}50%{transform:translateY(15%) scale(1)}100%{transform:translateY(0) scale(1)}}@keyframes softup{0%{transform:translateY(30%) scale(1)}50%{transform:translateY(15%) scale(1)}100%{transform:translateY(0) scale(1)}}@-webkit-keyframes softdown{0%{transform:translateY(0) scale(1)}50%{transform:translateY(15%) scale(1)}100%{transform:translateY(30%) scale(1)}}@keyframes softdown{0%{transform:translateY(0) scale(1)}50%{transform:translateY(15%) scale(1)}100%{transform:translateY(30%) scale(1)}}@media screen and (min-width:991px){.muow-chat>#muow-close{opacity:0;transform:translateX(100%);z-index:-1}.muow-chat:hover>#muow-close{transition:all .35s ease-in-out 0s;z-index:0;opacity:1;transform:translateX(0)}}@media screen and (max-width:480px){.muow{right:16px;bottom:28px}}@media screen and (max-width:320px){.muow{right:10px}}
/*# sourceMappingURL=maps/muow.css.map */
