.phonering-alo-phone.phonering-alo-static {
opacity: .6
}
.phonering-alo-phone.phonering-alo-hover, .phonering-alo-phone:hover {
opacity: 1
}
.phonering-alo-ph-circle {
width: 80px;
height: 80px;
top: 52px;
left: 53px;
position: absolute;
background-color: transparent;
border-radius: 100% !important;
border: 2px solid #bfebfc;
opacity: .1;
-webkit-animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
animation: phonering-alo-circle-anim 1.2s infinite ease-in-out;
transition: all .5s;
-webkit-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%
}
.phonering-alo-phone.phonering-alo-active .phonering-alo-ph-circle {
-webkit-animation: phonering-alo-circle-anim 1.1s infinite ease-in-out !important;
animation: phonering-alo-circle-anim 1.1s infinite ease-in-out !important
}
.phonering-alo-phone.phonering-alo-static .phonering-alo-ph-circle {
-webkit-animation: phonering-alo-circle-anim 2.2s infinite ease-in-out !important;
animation: phonering-alo-circle-anim 2.2s infinite ease-in-out !important
}
.phonering-alo-phone.phonering-alo-hover .phonering-alo-ph-circle, .phonering-alo-phone:hover .phonering-alo-ph-circle {
border-color: #00aff2;
opacity: .5
}
.phonering-alo-phone.phonering-alo-green.phonering-alo-hover .phonering-alo-ph-circle, .phonering-alo-phone.phonering-alo-green:hover .phonering-alo-ph-circle {
border-color: #75eb50;
border-color: #baf5a7;
opacity: .5
}
.phonering-alo-phone.phonering-alo-green .phonering-alo-ph-circle {
border-color: #00aff2;
border-color: #bfebfc;
opacity: .5
}
.phonering-alo-phone.phonering-alo-gray.phonering-alo-hover .phonering-alo-ph-circle, .phonering-alo-phone.phonering-alo-gray:hover .phonering-alo-ph-circle {
border-color: #ccc;
opacity: .5
}
.phonering-alo-phone.phonering-alo-gray .phonering-alo-ph-circle {
border-color: #75eb50;
opacity: .5
}
.phonering-alo-ph-circle-fill {
width: 80px;
height: 80px;
top: 52px;
left: 53px;
position: absolute;
background-color: #000;
border-radius: 100% !important;
border: 2px solid transparent;
-webkit-animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out;
transition: all .5s;
-webkit-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%
}
.phonering-alo-phone.phonering-alo-active .phonering-alo-ph-circle-fill {
-webkit-animation: phonering-alo-circle-fill-anim 1.7s infinite ease-in-out !important;
animation: phonering-alo-circle-fill-anim 1.7s infinite ease-in-out !important
}
.phonering-alo-phone.phonering-alo-static .phonering-alo-ph-circle-fill {
-webkit-animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
animation: phonering-alo-circle-fill-anim 2.3s infinite ease-in-out !important;
opacity: 0 !important
}
.phonering-alo-phone.phonering-alo-hover .phonering-alo-ph-circle-fill, .phonering-alo-phone:hover .phonering-alo-ph-circle-fill {
background-color: rgba(0, 175, 242, 0.5);
background-color: #00aff2 9;
opacity: .75 !important
}
.phonering-alo-phone.phonering-alo-green.phonering-alo-hover .phonering-alo-ph-circle-fill, .phonering-alo-phone.phonering-alo-green:hover .phonering-alo-ph-circle-fill {
background-color: rgba(117, 235, 80, 0.5);
background-color: #baf5a7;
opacity: .75 !important
}
.phonering-alo-phone.phonering-alo-green .phonering-alo-ph-circle-fill {
background-color: rgba(0, 175, 242, 0.5);
background-color: #a6e3fa
}
.phonering-alo-phone.phonering-alo-gray.phonering-alo-hover .phonering-alo-ph-circle-fill, .phonering-alo-phone.phonering-alo-gray:hover .phonering-alo-ph-circle-fill {
background-color: rgba(204, 204, 204, 0.5);
background-color: #ccc;
opacity: .75 !important
}
.phonering-alo-phone.phonering-alo-gray .phonering-alo-ph-circle-fill {
background-color: rgba(117, 235, 80, 0.5);
opacity: .75 !important
}
.phonering-alo-ph-img-circle {
width: 45px;
height: 45px;
top: 70px;
left: 70px;
position: absolute;
background: rgba(30, 30, 30, 0.1) url(//kuno.vn/wp-content/plugins/all-call-isocal/img/call-1.png) no-repeat center center;
border-radius: 100% !important;
border: 2px solid transparent;
-webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
-webkit-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%
}
.phonering-alo-phone.phonering-alo-active .phonering-alo-ph-img-circle {
-webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out !important;
animation: phonering-alo-circle-img-anim 1s infinite ease-in-out !important
}
.phonering-alo-phone.phonering-alo-static .phonering-alo-ph-img-circle {
-webkit-animation: phonering-alo-circle-img-anim 0 infinite ease-in-out !important;
animation: phonering-alo-circle-img-anim 0 infinite ease-in-out !important
}
.phonering-alo-phone.phonering-alo-hover .phonering-alo-ph-img-circle, .phonering-alo-phone:hover .phonering-alo-ph-img-circle {
background-color: #008fe6;
}
.phonering-alo-phone.phonering-alo-green.phonering-alo-hover .phonering-alo-ph-img-circle, .phonering-alo-phone.phonering-alo-green:hover .phonering-alo-ph-img-circle {
background-color: #008fe6;
}
.phonering-alo-phone.phonering-alo-green .phonering-alo-ph-img-circle {
background-color: #e40d0d;
}
.phonering-alo-phone.phonering-alo-gray.phonering-alo-hover .phonering-alo-ph-img-circle, .phonering-alo-phone.phonering-alo-gray:hover .phonering-alo-ph-img-circle {
background-color: #ccc
}
.phonering-alo-phone.phonering-alo-gray .phonering-alo-ph-img-circle {
background-color: #75eb50
}
@-webkit-keyframes phonering-alo-circle-anim {
0% {
-webkit-transform: rotate(0) scale(.5) skew(1deg);
-webkit-opacity: .1
}
30% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
-webkit-opacity: .5
}
100% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
-webkit-opacity: .1
}
}
@-webkit-keyframes phonering-alo-circle-fill-anim {
0% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
opacity: .2
}
50% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
opacity: .2
}
100% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
opacity: .2
}
}
@-webkit-keyframes phonering-alo-circle-img-anim {
0% {
-webkit-transform: rotate(0) scale(1) skew(1deg)
}
10% {
-webkit-transform: rotate(-25deg) scale(1) skew(1deg)
}
20% {
-webkit-transform: rotate(25deg) scale(1) skew(1deg)
}
30% {
-webkit-transform: rotate(-25deg) scale(1) skew(1deg)
}
40% {
-webkit-transform: rotate(25deg) scale(1) skew(1deg)
}
50% {
-webkit-transform: rotate(0) scale(1) skew(1deg)
}
100% {
-webkit-transform: rotate(0) scale(1) skew(1deg)
}
}
@-webkit-keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
@keyframes fadeInRight {
0% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
100% {
opacity: 1;
-webkit-transform: none;
-ms-transform: none;
transform: none
}
}
@-webkit-keyframes fadeOutRight {
0% {
opacity: 1
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
}
@keyframes fadeOutRight {
0% {
opacity: 1
}
100% {
opacity: 0;
-webkit-transform: translate3d(100%, 0, 0);
-ms-transform: translate3d(100%, 0, 0);
transform: translate3d(100%, 0, 0)
}
}
@-webkit-keyframes phonering-alo-circle-anim {
0% {
-webkit-transform: rotate(0) scale(.5) skew(1deg);
transform: rotate(0) scale(.5) skew(1deg);
opacity: .1
}
30% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
transform: rotate(0) scale(.7) skew(1deg);
opacity: .5
}
100% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg);
opacity: .1
}
}
@keyframes phonering-alo-circle-anim {
0% {
-webkit-transform: rotate(0) scale(.5) skew(1deg);
transform: rotate(0) scale(.5) skew(1deg);
opacity: .1
}
30% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
transform: rotate(0) scale(.7) skew(1deg);
opacity: .5
}
100% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg);
opacity: .1
}
}
@-webkit-keyframes phonering-alo-circle-fill-anim {
0% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
transform: rotate(0) scale(.7) skew(1deg);
opacity: .2
}
50% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg);
opacity: .2
}
100% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
transform: rotate(0) scale(.7) skew(1deg);
opacity: .2
}
}
@keyframes phonering-alo-circle-fill-anim {
0% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
transform: rotate(0) scale(.7) skew(1deg);
opacity: .2
}
50% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg);
opacity: .2
}
100% {
-webkit-transform: rotate(0) scale(.7) skew(1deg);
transform: rotate(0) scale(.7) skew(1deg);
opacity: .2
}
}
@-webkit-keyframes phonering-alo-circle-img-anim {
0% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg)
}
10% {
-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
transform: rotate(-25deg) scale(1) skew(1deg)
}
20% {
-webkit-transform: rotate(25deg) scale(1) skew(1deg);
transform: rotate(25deg) scale(1) skew(1deg)
}
30% {
-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
transform: rotate(-25deg) scale(1) skew(1deg)
}
40% {
-webkit-transform: rotate(25deg) scale(1) skew(1deg);
transform: rotate(25deg) scale(1) skew(1deg)
}
50% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg)
}
100% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg)
}
}
@keyframes phonering-alo-circle-img-anim {
0% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg)
}
10% {
-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
transform: rotate(-25deg) scale(1) skew(1deg)
}
20% {
-webkit-transform: rotate(25deg) scale(1) skew(1deg);
transform: rotate(25deg) scale(1) skew(1deg)
}
30% {
-webkit-transform: rotate(-25deg) scale(1) skew(1deg);
transform: rotate(-25deg) scale(1) skew(1deg)
}
40% {
-webkit-transform: rotate(25deg) scale(1) skew(1deg);
transform: rotate(25deg) scale(1) skew(1deg)
}
50% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg)
}
100% {
-webkit-transform: rotate(0) scale(1) skew(1deg);
transform: rotate(0) scale(1) skew(1deg)
}
}
.hotline_devmd {
position: fixed;
bottom: 60px;
right: 25px;
z-index: 999;
}
.click_socical {
cursor: pointer;
}
.allicon_socical {
width: 38px; transition: all .5s;
}
.allicon_socical a{
display: table;
position: relative;
}
.showhotline {
left: 75px;
transition: all .5s;
}
.skusinle_devmd p {
float: left;
margin-right: 23px;
margin-bottom: 0;
padding-bottom: 2px;
}
.allicon_socical a img{
width: 36px;
margin-bottom: 6px;
-webkit-animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
animation: phonering-alo-circle-img-anim 1s infinite ease-in-out;
-webkit-transform-origin: 50% 50%;
-ms-transform-origin: 50% 50%;
transform-origin: 50% 50%;
position: relative;
z-index: 3;
}
.allicon_socical a .tooltipCall{
position: absolute;
top: 3px;
right: 5px;
min-width: 135px;
background-color: #bc170e;
z-index: 2;
border-radius: 50px;
height: 43px;
display: flex;
align-items: center;
padding-left: 18px;
opacity: 0;
visibility: hidden;
color: #fff;
font-size: 14px;
transition: all .2s;
}
.allicon_socical a:hover > .tooltipCall{
opacity: 1;
visibility: visible;
transition: all .2s;
}
.allicon_socical a.aRequestCall .tooltipCall{
min-width: 163px;
}