@import "//fonts.googleapis.com/css?family=Montserrat|Open+Sans:400,300,600,700&subset=latin,vietnamese";
.coccoc-alo-phone {
    background-color: transparent;
    cursor: pointer;
    height: 200px;
    position: fixed;
    left: 0px;
    bottom: 0px;
    transition: visibility 0.5s ease 0s;
    visibility: hidden;
    width: 200px;
    z-index: 200000 !important;
}
.coccoc-alo-phone.coccoc-alo-show {
    visibility: visible;
}
.fadeOutRight {
    animation-name: fadeOutRight;
}
.coccoc-alo-phone.coccoc-alo-static {
    opacity: 0.6;
}
.coccoc-alo-phone.coccoc-alo-hover, .coccoc-alo-phone:hover {
    opacity: 1;
}
.coccoc-alo-ph-circle {
    animation: 1.2s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim;
    background-color: transparent;
    border: 2px solid rgba(30, 30, 30, 0.4);
    border-radius: 100%;
    height: 160px;
    left: 20px;
    opacity: 0.1;
    position: absolute;
    top: 20px;
    transform-origin: 50% 50% 0;
    transition: all 0.5s ease 0s;
    width: 160px;
}
.coccoc-alo-phone.coccoc-alo-active .coccoc-alo-ph-circle {
    animation: 1.1s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim !important;
}
.coccoc-alo-phone.coccoc-alo-static .coccoc-alo-ph-circle {
    animation: 2.2s ease-in-out 0s normal none infinite running coccoc-alo-circle-anim !important;
}
.coccoc-alo-phone.coccoc-alo-hover .coccoc-alo-ph-circle, .coccoc-alo-phone:hover .coccoc-alo-ph-circle {
    border-color: #00aff2;
    opacity: 0.5;
}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle, .coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle {
    border-color: #75eb50;
    opacity: 0.5;
}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle {
    border-color: #f2bb37;
    opacity: 0.5;
}
.coccoc-alo-phone.coccoc-alo-gray.coccoc-alo-hover .coccoc-alo-ph-circle, .coccoc-alo-phone.coccoc-alo-gray:hover .coccoc-alo-ph-circle {
    border-color: #ccc;
    opacity: 0.5;
}
.coccoc-alo-phone.coccoc-alo-gray .coccoc-alo-ph-circle {
    border-color: #75eb50;
    opacity: 0.5;
}
.coccoc-alo-ph-circle-fill {
    animation: 2.3s ease-in-out 0s normal none infinite running coccoc-alo-circle-fill-anim;
    background-color: #000;
    border: 2px solid transparent;
    border-radius: 100%;
    height: 100px;
    left: 50px;
    opacity: 0.1;
    position: absolute;
    top: 50px;
    transform-origin: 50% 50% 0;
    transition: all 0.5s ease 0s;
    width: 100px;
}
.coccoc-alo-phone.coccoc-alo-active .coccoc-alo-ph-circle-fill {
    animation: 1.7s ease-in-out 0s normal none infinite running coccoc-alo-circle-fill-anim !important;
}
.coccoc-alo-phone.coccoc-alo-static .coccoc-alo-ph-circle-fill {
    animation: 2.3s ease-in-out 0s normal none infinite running coccoc-alo-circle-fill-anim !important;
    opacity: 0 !important;
}
.coccoc-alo-phone.coccoc-alo-hover .coccoc-alo-ph-circle-fill, .coccoc-alo-phone:hover .coccoc-alo-ph-circle-fill {
    background-color: rgba(0, 175, 242, 0.5);
    opacity: 0.75 !important;
}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-circle-fill, .coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-circle-fill {
    background-color: rgba(117, 235, 80, 0.5);
    opacity: 0.75 !important;
}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-circle-fill {
    background-color: rgb(217, 186, 74, .5);
    opacity: 0.75 !important;
}
.coccoc-alo-phone.coccoc-alo-gray.coccoc-alo-hover .coccoc-alo-ph-circle-fill, .coccoc-alo-phone.coccoc-alo-gray:hover .coccoc-alo-ph-circle-fill {
    background-color: rgba(204, 204, 204, 0.5);
    opacity: 0.75 !important;
}
.coccoc-alo-phone.coccoc-alo-gray .coccoc-alo-ph-circle-fill {
    background-color: rgba(117, 235, 80, 0.5);
    opacity: 0.75 !important;
}
.coccoc-alo-ph-img-circle {
    animation: 1s ease-in-out 0s normal none infinite running coccoc-alo-circle-img-anim;
    background: rgba(30, 30, 30, 0.1) url("data:image/png;base64,iVBORw0KGgoAAAANSUhEUgAAADIAAAAyCAYAAAAeP4ixAAAACXBIWXMAAAsTAAALEwEAmpwYAAABNmlDQ1BQaG90b3Nob3AgSUNDIHByb2ZpbGUAAHjarY6xSsNQFEDPi6LiUCsEcXB4kygotupgxqQtRRCs1SHJ1qShSmkSXl7VfoSjWwcXd7/AyVFwUPwC/0Bx6uAQIYODCJ7p3MPlcsGo2HWnYZRhEGvVbjrS9Xw5+8QMUwDQCbPUbrUOAOIkjvjB5ysC4HnTrjsN/sZ8mCoNTIDtbpSFICpA/0KnGsQYMIN+qkHcAaY6addAPAClXu4vQCnI/Q0oKdfzQXwAZs/1fDDmADPIfQUwdXSpAWpJOlJnvVMtq5ZlSbubBJE8HmU6GmRyPw4TlSaqo6MukP8HwGK+2G46cq1qWXvr/DOu58vc3o8QgFh6LFpBOFTn3yqMnd/n4sZ4GQ5vYXpStN0ruNmAheuirVahvAX34y/Axk/96FpPYgAAACBjSFJNAAB6JQAAgIMAAPn/AACA6AAAUggAARVYAAA6lwAAF2/XWh+QAAAB/ElEQVR42uya7W3CMBCG31QM4A1aNggTlG6QbpBMkHYC1AloJ4BOABuEDcgGtBOETnD9c1ERCH/lwxeaV8oPFGP86Hy+DxMREW5Bd7gRjSDSNGn4/RiAOvm8C0ZCRD5PSkQVXSr1nK/xE3mcWimA1ZV3JYBZCIO4giQANoYxMwYS6+xKY4lT5dJPreWZY+uspqSCKPYN27GJVBDXheVSQe494ksiEWTuMXcu1dld9SARxDX1OAJ4lgjy4zDnFsC076A4adEiRwAZg4hOUSpNoCsBPDGM+HqkNGynYBCuILuWj+dgWysGsNe8nwL4GsrW0m2fxZBq9rW0rNcX5MOQ9eZD8JFahcG5g/iKT671alGAYQggpYWvpEPYWrU/HDTOfeRIX0q2SL3QN4tGhZJukVobQyXYWw7WtLDKDIuM+ZSzscyCE9PCy5IttCvnZNaeiGLNHKuz8ZVh/MXTVu/1xQKmIqLEAuJ0fNo3iG5B51oSkeKnsBi/4bG9gYB/lCytU5G9DryFW+3Gm+JLwU7ehbJrwTjq4DJU8bHcVbEV9dXXqqP6uqO5e2/QZRYJpqu2IUAA4B3tXvx8hgKp05QZW6dJqrLTNkB6vrRURLRwPHqtYgkC3cLWQAcDQGGKH13FER/NATzi786+BPDNjm1dMkfjn2pGkBHkf4D8DgBJDuDHx9BN+gAAAABJRU5ErkJggg==") no-repeat scroll center center;
    border: 2px solid transparent;
    border-radius: 100%;
    height: 60px;
    left: 70px;
    opacity: 0.7;
    position: absolute;
    top: 70px;
    transform-origin: 50% 50% 0;
    width: 60px;
}
.coccoc-alo-phone.coccoc-alo-active .coccoc-alo-ph-img-circle {
    animation: 1s ease-in-out 0s normal none infinite running coccoc-alo-circle-img-anim !important;
}
.coccoc-alo-phone.coccoc-alo-static .coccoc-alo-ph-img-circle {
    animation: 0s ease-in-out 0s normal none infinite running coccoc-alo-circle-img-anim !important;
}
.coccoc-alo-phone.coccoc-alo-hover .coccoc-alo-ph-img-circle, .coccoc-alo-phone:hover .coccoc-alo-ph-img-circle {
    background-color: #f2aa00;
}
.coccoc-alo-phone.coccoc-alo-green.coccoc-alo-hover .coccoc-alo-ph-img-circle, .coccoc-alo-phone.coccoc-alo-green:hover .coccoc-alo-ph-img-circle {
    background-color: #75eb50;
}
.coccoc-alo-phone.coccoc-alo-green .coccoc-alo-ph-img-circle {
    background-color: #f2aa00;
}
.coccoc-alo-phone.coccoc-alo-gray.coccoc-alo-hover .coccoc-alo-ph-img-circle, .coccoc-alo-phone.coccoc-alo-gray:hover .coccoc-alo-ph-img-circle {
    background-color: #ccc;
}
.coccoc-alo-phone.coccoc-alo-gray .coccoc-alo-ph-img-circle {
    background-color: #75eb50;
}
@keyframes coccoc-alo-circle-anim {
0% {
    opacity: 0.1;
    transform: rotate(0deg) scale(0.5) skew(1deg);
}
30% {
    opacity: 0.5;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
100% {
    opacity: 0.6;
    transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes coccoc-alo-circle-fill-anim {
0% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
50% {
    opacity: 0.2;
}
100% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
}
@keyframes coccoc-alo-circle-img-anim {
0% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
10% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
20% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
30% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
40% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
50% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes fadeInRight {
0% {
    opacity: 0;
    transform: translate3d(100%, 0px, 0px);
}
100% {
    opacity: 1;
    transform: none;
}
}
@keyframes fadeInRight {
0% {
    opacity: 0;
    transform: translate3d(100%, 0px, 0px);
}
100% {
    opacity: 1;
    transform: none;
}
}
@keyframes fadeOutRight {
0% {
    opacity: 1;
}
100% {
    opacity: 0;
    transform: translate3d(100%, 0px, 0px);
}
}
@keyframes fadeOutRight {
0% {
    opacity: 1;
}
100% {
    opacity: 0;
    transform: translate3d(100%, 0px, 0px);
}
}
@keyframes coccoc-alo-circle-anim {
0% {
    opacity: 0.1;
    transform: rotate(0deg) scale(0.5) skew(1deg);
}
30% {
    opacity: 0.5;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
100% {
    opacity: 0.1;
    transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes coccoc-alo-circle-anim {
0% {
    opacity: 0.1;
    transform: rotate(0deg) scale(0.5) skew(1deg);
}
30% {
    opacity: 0.5;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
100% {
    opacity: 0.1;
    transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes coccoc-alo-circle-fill-anim {
0% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
50% {
    opacity: 0.2;
    transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
}
@keyframes coccoc-alo-circle-fill-anim {
0% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
50% {
    opacity: 0.2;
    transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
    opacity: 0.2;
    transform: rotate(0deg) scale(0.7) skew(1deg);
}
}
@keyframes coccoc-alo-circle-img-anim {
0% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
10% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
20% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
30% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
40% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
50% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
}
@keyframes coccoc-alo-circle-img-anim {
0% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
10% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
20% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
30% {
    transform: rotate(-25deg) scale(1) skew(1deg);
}
40% {
    transform: rotate(25deg) scale(1) skew(1deg);
}
50% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
100% {
    transform: rotate(0deg) scale(1) skew(1deg);
}
}
#coccoc-alo-wrapper {
    bottom: 0;
    color: #383838;
    display: none;
    left: 0;
    overflow: visible;
    position: fixed;
    top: 0;
    width: 100%;
    z-index: 2000000;
}
#coccoc-alo-wrapper.night-mode {
    color: #fff;
}

#coccoc-alo-wrapper .coccoc-alo-popup-close:hover {
    opacity: 0.6 !important;
}



.coccoc-alo-popup h3 {
    font-family: "Open Sans";
    font-size: 24px;
    font-weight: 300;
    margin: 0 0 40px;
    white-space: nowrap;
}
.night-mode .coccoc-alo-popup h3 {
    font-size: 23px;
}
.night-mode .coccoc-alo-message {
    padding-bottom: 0;
}
.coccoc-alo-message {
    clear: both;
    font-size: 14px;
    height: 32px;
    padding: 18px 0 13px;
    text-align: center;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper .label, #coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper .label + .input {
    float: left;
    width: 49%;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper .input {
    padding: 0 13px;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper label {
    color: #616161;
    font-size: 18px;
    height: 28px;
    line-height: 28px;
    padding-right: 15px;
}
.coccoc-alo-number {
    -moz-border-bottom-colors: none;
    -moz-border-left-colors: none;
    -moz-border-right-colors: none;
    -moz-border-top-colors: none;
    background-color: transparent;
    border-color: -moz-use-text-color -moz-use-text-color #00bed5;
    border-image: none;
    border-style: none none solid;
    border-width: 0 0 1px;
    color: #00bed5;
    display: inline-block;
    font-family: Montserrat,"Lucida Console",Monaco,monospace,sans-serif;
    font-size: 28px;
    font-weight: normal;
    margin: 0 auto;
    padding-bottom: 10px;
    width: 221px;
}
.night-mode .coccoc-alo-number {
    border: 1px solid #00bed5;
    border-radius: 3px;
    padding: 13px 31px;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper input.valid-invalid[type="text"] {
    color: #ff496b;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper input[type="text"]:focus {
    outline: 0 none;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper input[type="text"]::-moz-placeholder {
    color: #d1d1d1;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-input-wrapper input[type="text"]::-moz-placeholder {
    color: #d1d1d1;
}
#coccoc-alo-wrapper.night-mode .coccoc-alo-popup .coccoc-alo-input-wrapper input[type="text"]::-moz-placeholder {
    color: #60615f;
}
#coccoc-alo-wrapper.night-mode .coccoc-alo-popup .coccoc-alo-input-wrapper input[type="text"]::-moz-placeholder {
    color: #60615f;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-submit {
    background-color: #333;
    border: 0 none;
    border-radius: 68px;
    color: #fff;
    cursor: pointer;
    font-family: "Open Sans",Arial,Helvetica,sans-serif;
    font-size: 20px;
    outline: medium none !important;
    padding: 20px 40px;
}
#coccoc-alo-wrapper.night-mode .coccoc-alo-popup .coccoc-alo-submit {
    background-color: #00bed5;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-submitavtive, #coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-submitvisited {
    outline: medium none !important;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-submit-moz-focus-inner {
    border: 0 none;
}
#coccoc-alo-wrapper .coccoc-alo-popup .coccoc-alo-submit:hover {
    background-color: #00aff2;
}
