/*---------------TWILIO-ANIMATION-------------*/

@keyframes shaker {
    0% {transform:rotate(0deg);}
    29% {transform:rotate(0deg);}
    30% {transform:rotate(1deg);}
    31% {transform:rotate(2deg);}
    33% {transform:rotate(1deg);}
    35% {transform:rotate(0deg);}
    37% {transform:rotate(-1deg);}
    39% {transform:rotate(-2deg);}
    41% {transform:rotate(-1deg);}
    43% {transform:rotate(0deg);}
    45% {transform:rotate(1deg);}
    47% {transform:rotate(2deg);}
    49% {transform:rotate(1deg);}
    51% {transform:rotate(0deg);}
    53% {transform:rotate(-1deg);}
    55% {transform:rotate(-2deg);}
    57% {transform:rotate(-1deg);}
    59% {transform:rotate(0deg);}
    100%{transform:rotate(0deg);}
}

/*-------------------------------------------*/



.twilio .chat-button a,
.liveChat .chat-button span {
    background-image: url("/images/techsupport/twilio_btn_1x.png");
    background-repeat: no-repeat;
    display: block;
    width: 251px;
    height: 133px;
    text-align: right;
    margin: 44px auto 38px;
    text-decoration: none;
    font: 600 42px 'Webfont-myriadpro-semibold', Helvetica, Arial, sans-serif;
    color: #4A4A4A;
    padding: 29px 43px 0 28px;
    position: relative;
    cursor: pointer;
    -webkit-user-select: none;
    -moz-user-select: none;
    -ms-user-select: none;
    user-select: none;
}

.liveChat .chat-button span {
    padding-right: 50px;
}

.contact-call a:before,
.contact-chat span:before {
    background-image: url("/images/techsupport/twilio_icons_1x.png");
    background-position: 0 0;
    background-repeat: no-repeat;
    content: '';
    display: block;
    position: absolute;
    left: 39px;
    top: 26px;
    width: 48px;
    height: 55px;

}

.contact-chat span:before {
    background-position: -50px 0;
    width: 47px;
    height: 45px;
}

.twilio .chat-button div a:hover {
    animation-duration: 1s;
    animation-name: shaker;
    text-shadow: 0 0 5px #fff;
}
.chat-button span:hover {
    animation-duration: 1s;
    animation-name: shaker;
    text-shadow: 0 0 5px #fff;
}

.twilio .twilio-offline {
    min-height: 307px;
    text-align: left;
}

@media screen and (-webkit-min-device-pixel-ratio: 2),
(min--moz-device-pixel-ratio: 2),
(-o-min-device-pixel-ratio: 2/1),
(min-resolution: 2dppx),
(min-resolution: 192dpi){
    .twilio .chat-button div {
        background-image: url("/images/techsupport/twilio_btn_2x.png");
        background-size: 251px 133px;
    }

    .contact-call a:before,
    .contact-chat span:before {
        background-image: url("/images/techsupport/twilio_icons_2x.png");
        background-size: 100px 58px;
    }
}

