 * {
     box-sizing: border-box;
     margin: 0;
     padding: 0;
 }

 body {
     font-family: Arial, sans-serif;
 }


 .floating_btn {
     position: fixed;
     bottom: 0px;
     left: 0px;
     width: 100px;
     height: 100px;
     display: flex;
     align-items: center;
     justify-content: center;
     z-index: 1000;
 }

 .floating_btn2 {
     position: fixed;
     bottom: 0px;
     right: 0px;
     width: 100px;
     height: 100px;
     display: flex;
     flex-direction: column;
     align-items: center;
     justify-content: center;
     z-index: 1000;
 }

 .contact_icon {
     background-color: #42db87;
     width: 60px;
     height: 60px;
     font-size: 30px;
     border-radius: 50%;
     display: flex;
     align-items: center;
     justify-content: center;
     box-shadow: 0 0 0 0 #42db87;
     animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
     cursor: pointer;
 }

 .contact_icon2 {
     /* background-color: #000000; */
     color: #fff;
     width: 60px;
     height: 60px;
     font-size: 30px;
     border-radius: 50px;
     text-align: center;
     box-shadow: 2px 2px 3px #999;
     display: flex;
     align-items: center;
     justify-content: center;
     transform: translatey(0px);
     animation: pulse 1.5s infinite;
     box-shadow: 0 0 0 0 #6cdc2d;
     -webkit-animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
     -moz-animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
     -ms-animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
     animation: pulsing 1.25s infinite cubic-bezier(0.66, 0, 0, 1);
     font-weight: normal;
     font-family: sans-serif;
     text-decoration: none !important;
     transition: all 300ms ease-in-out;
 }

 @keyframes pulsing {
     to {
         box-shadow: 0 0 0 30px rgba(66, 219, 135, 0);
     }
 }

 .chat-popup {
     position: fixed;
     bottom: 100px;
     left: 25px;
     width: 320px;
     background: #f0f0f0;
     border-radius: 12px;
     box-shadow: 0 4px 15px rgba(0, 0, 0, 0.2);
     display: none;
     flex-direction: column;
     overflow: hidden;
     z-index: 1000;
     animation: fadeInUp 0.4s ease;
 }

 @keyframes fadeInUp {
     from {
         opacity: 0;
         transform: translateY(30px);
     }

     to {
         opacity: 1;
         transform: translateY(0);
     }
 }

 .chat-header {
     background: #4aa485;
     color: white;
     padding: 12px;
     display: flex;
     align-items: center;

     justify-content: space-between;
     font-size: 13px;

 }

 .chat-body {
     background: url('../img/whatsapp.webp');
     background-size: cover;
     height: 250px;
     padding: 10px;
     display: flex;
     flex-direction: column;
     justify-content: flex-end;
 }

 .message {
     background: #ffffff;
     padding: 10px 12px;
     border-radius: 7px 7px 0 7px;
     align-self: flex-start;
     max-width: 80%;
     font-size: 14px;
     margin-bottom: 6px;
 }

 .time {
     font-size: 10px;
     margin-top: 4px;
     color: gray;
 }

 .chat-footer {
     background: white;
     padding: 8px;
     display: flex;
     align-items: center;
     border-top: 1px solid #ddd;
 }

 .chat-footer input {
     width: 100%;
     border: none;
     padding: 8px;
     border-radius: 20px;
     background: #f0f0f0;
 }

 .chat-footer i {
     font-size: 22px;
     color: #25d366;
     margin-left: 10px;
     cursor: pointer;
 }