/*
@keyframes Shaking {
    0% { transform: translate(3px, 0); }
    50% { transform: translate(-3px, 0); }
    100% { transform: translate(0, 0); }
}
.float-contact { display: inline-block; position: fixed; bottom: 30px; right: 30px; }
.float-contact .inner { outline: 5px solid rgba(255, 255, 255, 0.05); text-decoration: none; line-height: 1; display: flex; align-items: center; justify-content: center; width: 60px; height: 60px; border-radius: 50%; }
.float-contact .icon {  font-size: 34px; display: flex; align-items: center; justify-content: center; width: 50px; height: 50px; border-radius: 50%; background-color: var(--color-purple); color: var(--color-white);  }
.float-contact .icon:hover { animation: Shaking 150ms 2 linear; }
*/


@keyframes mainShake {
  0%, 25%, 83%, 100% {
    transform: rotatez(0deg);
  }
  32.5%, 62.5% {
    transform: rotatez(-7deg);
  }
  47.5%, 75.5% {
    transform: rotatez(7deg);
  }
}
@keyframes Shaking {
    0% { transform: translate(2px, 0); }
    50% { transform: translate(-2px, 0); }
    100% { transform: translate(0, 0); }
}
dl.float-contact { 
	--floating-buttons: 48px;
	display: inline-block; position: fixed; bottom: 20px; left: 20px; 
  margin: 0; 
}
dl.float-contact dt {}



.status-helper,.status-helper::before,.status-helper::after { width:12px;height:12px; top:1px;left:1px;position:absolute;display:block;border-radius:50%;z-index:1; }
.status-helper:before,
.status-helper:after {
    content:'';z-index:1;background-color:#13a920; 
    -webkit-animation:help-bubble-pulse 1.5s linear infinite;-moz-animation:help-bubble-pulse 1.5s linear infinite;-o-animation:help-bubble-pulse 1.5s linear infinite;animation:help-bubble-pulse 1.5s linear infinite;
}
.status-helper:after{-webkit-animation-delay:.35s;-moz-animation-delay:.35s;-o-animation-delay:.35s;animation-delay:.35s}

@-webkit-keyframes help-bubble-pulse{0%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}25%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}100%{-webkit-transform:scale(2.5);transform:scale(2.5);opacity:0}}
@keyframes help-bubble-pulse{0%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}25%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}100%{-webkit-transform:scale(2.5);transform:scale(2.5);opacity:0}}
@-moz-keyframes help-bubble-pulse{0%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}25%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}100%{-webkit-transform:scale(2.5);transform:scale(2.5);opacity:0}}
@-o-keyframes help-bubble-pulse{0%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}25%{-webkit-transform:scale(1);transform:scale(1);opacity:.75}100%{-webkit-transform:scale(2.5);transform:scale(2.5);opacity:0}}

dl.float-contact dt button { 
	padding: 0; border: none; display: flex; align-items: center; line-height: 1; justify-content: center;
	width: var(--floating-buttons); height: var(--floating-buttons); border-radius: 50%;   
	background-color: #FFA26C; color: #321A0C; outline: 3px solid transparent;
	cursor: pointer; transition:all 0.4s;
	position: relative; z-index: 1;

    box-shadow: 0 16px 24px 0 rgb(73 104 126 / 16%);
    
    
}

@keyframes float-animation-pulse {
  0% { transform:scale(1); } 100% { transform:scale(1.07); } 
}

dl.float-contact[aria-expanded="false"] dt button { animation: 0.4s infinite alternate float-animation-pulse; }

dl.float-contact dt button:hover { outline-color: #FFFBBB; }
dl.float-contact dt button .icon { 
	font-size: 22px; text-shadow: 0 1px 1px rgba(0, 0, 0, 0.185); 
	transform-origin: 50% 50%; animation: mainShake 1.25s infinite;
}
dl.float-contact dd { pointer-events: none; position: absolute; bottom: 100%; right: 0; margin: 0;   }
dl.float-contact dd ul { margin: 0; padding: 0; list-style: none none; list-style-position: inside; }
dl.float-contact dd li { 
	transition:all 0.2s; margin-bottom: 12px; 
	opacity: 0; transform: scale(0.5) translateY(40px); /* animation */
}
dl.float-contact dd .icon-wrapper { 
	display: flex; align-items: center; line-height: 1; justify-content: center;
	width: var(--floating-buttons); height: var(--floating-buttons); border-radius: 50%; overflow: hidden;
	background-color: #321A0C; color:white ; outline: 3px solid transparent; 
	text-decoration: none; 
}
dl.float-contact dd .icon-wrapper:hover { animation: Shaking 180ms 2 linear; }
dl.float-contact dd .icon { font-size: 26px;  }
dl.float-contact dd .icon-whatsapp { background-color: #3DA411; }
dl.float-contact dd .icon-viber { background-color: #583FBB; }
dl.float-contact dd .icon-messenger {  background: #5C5EFF; background: linear-gradient(210deg, rgba(237,76,152,1) 0%, rgba(152,56,255,1) 49%, rgba(15,144,255,1) 100%);  }

dl.float-contact[aria-expanded="true"] {} 
dl.float-contact[aria-expanded="true"] dd { pointer-events:auto; }
dl.float-contact[aria-expanded="true"] dd li {opacity: 1; transform: scale(1) translateY(0px); }