:root {
    --fz-tiny: 11px;
    --fz-small: 12px;
    --fz-small-x: 13px;
    --fz-base: 14px;
    --fz-normal: 16px;
    --fz-large: 18px;
    --fz-large-x: 20px;
    --fz-xl: 25px;
    --fz-xxl: 30px;
    --fz-icon: 20px;
    --white: #fff;
    --black: #000;
    --green: #009901;
    --red: #dd1c1a;
    --cl-primary: #fecd08;
    --cl-secondary: #fb6e2e;
    --cl-third: #fb6e2e;
    --cl-discount: #ffd839;
    --cl-btn: #32cb00;
    --cl-btn-2: #80ba26;
    --cl-btn-buy: #fb6e2e;
    --cl-grey: #dadada;
    --cl-gray: #e8e8e8;
    --cl-text: #333;
    --cl-text-2: #FF882E;
    --cl-text-3: #232323;
    --cl-text-4: #f1f1f1;
    --cl-text-5: rgba(255,255,255,.4);
    --cl-text-6: #e0e0e0;
    --cl-border: whitesmoke;
    --cl-hd-cata: #1687e0;
    --cl-bg: #f6f8fa;
    --cl-bg-pd: #efefef;
    --cl-text-ft: rgba(0,0,0,0.54);
    --cl-cart: rgba(0,0,0,0.7);
    --cl-hd-dropdown: #f5f5f5;
    --cl-text-detail: #232323;
    --cl-text-heading: #050748;
    --cl-als: #2eb85c;
    --cl-alw: #f9b115;
    --cl-ale: #e55353;
    --cl-viber: #784f98;
    --cl-linkedin: #0a63bc;
    --cl-behance: #0054f7;
    --cl-zalo: #0065f7;
    --cl-facebook: #4064ac;
    --cl-twitter: #009deb;
    --cl-skype: #00aae9;
    --cl-vimeo: #00a8e8;
    --cl-telegram: #1296ca;
    --cl-pinterest: #e20017;
    --cl-youtube: #f60000;
    --cl-email: #e34133;
    --cl-flickr: #f70080;
    --cl-dribbble: #e34a85;
    --cl-whatsapp: #28a219;
    --cl-phone: #e62117;
    --cl-gradient-1: linear-gradient(to right,#ef3006,#c60004);
    --cl-shadown-1: rgba(149,157,165,0.2) 0 4px 14px;
    --cl-shadown-2: 0 0 4px rgb(0 0 0 / 25%);
    --cl-shadown-3: 0 2px 12px rgb(0 0 0 / 12%);
    --black-rgb: 0,0,0;
    --white-rgb: 255,255,255;
    --cl-primary-rgb: 1,123,218;
    --cl-secondary-rgb: 243,127,58;
    --cl-rgb-1: rgba(27,27,27,0.17);
    --cl-rgb-2: rgb(70,99,142,0.27);
    --cl-star: #fecd08;
    --gutter-x: 10px;
}
.phone-fixed{
    position:fixed;
    bottom:80px;
    right:15px;
    z-index:110;
}
.phone-fixed-button{
    color:var(--white);
    width:60px;
    height:60px;
    border-radius:50%;
    cursor:pointer;
    position:relative;
}
.phone-fixed-button::before,.phone-fixed-button::after{
    content:"";
    width:90px;
    height:90px;
    position:absolute;
    top:-15px;
    left:-15px;
    -webkit-transform-origin:50% 50%;
    -ms-transform-origin:50% 50%;
    transform-origin:50% 50%;
    -webkit-transition:all .5s;
    -o-transition:all .5s;
    transition:all .5s;
    border-radius:50px;
    z-index:-1;
}
.phone-fixed-button::before{
    background-color:var(--cl-phone);
    -webkit-animation:kfPhoneFixed 1.5s infinite ease-in-out;
    animation:kfPhoneFixed 1.5s infinite ease-in-out;
}
a.phone-fixed-href {
    color: #000;
}
i.icon {
    display: inline-block;
    font: normal normal normal 14px/1 FontAwesome;
    font-size: inherit;
    text-rendering: auto;
    -webkit-font-smoothing: antialiased;
    -moz-osx-font-smoothing: grayscale;
}
.icon-facebook:before {
    content: "\f09a";
}

.icon-envelope-open:before {
    content: "\f2b6";
}

.icon-call-out:before {
    content: "\f095";
}

.icon-zalo:before {
    content: "";
    background: url('/theme/zalo-icon.png');
    width: 40px;
    height: 40px;
    position: absolute;
    z-index: 999999;
    left: 0px;
    background-size: 100%;
    background-repeat: no-repeat;
}
.phone-fixed-button::after{
    border:2px solid var(--cl-phone);
    -webkit-animation:kfPhoneFixed2 1.5s infinite ease-in-out;
    animation:kfPhoneFixed2 1.5s infinite ease-in-out;
    background-color:transparent;
}
.phone-fixed-button-overflow{
    overflow:hidden;
}
.phone-fixed-button-overflow.active{
    opacity:0;
    visibility:hidden;
}
.phone-fixed-button-effect{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    height:60px;
    width:60px;
    -webkit-transition:all .1s ease-in-out;
    -o-transition:all .1s ease-in-out;
    transition:all .1s ease-in-out;
}
.phone-fixed-button-effect i {
    color: var(--white);
    text-align: center;
    font-size: var(--fz-large);
    min-width: 60px;
    min-height: 60px;
    line-height: 60px;
    border-radius: 50%;
    -webkit-transition: all .3s ease-in-out;
    -o-transition: all .3s ease-in-out;
    transition: all .3s ease-in-out;
    background: #dd0000 url('/theme/hotline.png');
    background-size: 50px;
    background-position: center;
    background-repeat: no-repeat;
}
.phone-fixed-button-close{
    background-color:var(--cl-phone);
    position:absolute;
    top:0;
    left:0;
    text-align:center;
    opacity:0;
    visibility:hidden;
    width:60px;
    height:60px;
    line-height:60px;
    border-radius:50%;
    -webkit-transition:all .1s ease-in-out;
    -o-transition:all .1s ease-in-out;
    transition:all .1s ease-in-out;
}
.phone-fixed-button-close-icon {
    min-width: 60px;
    min-height: 60px;
    border-radius: 50%;
    position: absolute;
    top: 0;
    left: 0;
    text-align: center;
    opacity: 1;
    width: 60px;
    height: 60px;
    line-height: 60px;
    background-size: 100%;
}
.phone-fixed-button-close-icon::before, .phone-fixed-button-close-icon::after {
    background-color: var(--white);
    content: '';
    position: absolute;
    top: 10px;
    width: 2px;
    height: 40px;
}
.phone-fixed-button-close-icon::before{
    -webkit-transform:rotate(45deg);
    -ms-transform:rotate(45deg);
    transform:rotate(45deg);
}
.phone-fixed-button-close-icon::after{
    -webkit-transform:rotate(-45deg);
    -ms-transform:rotate(-45deg);
    transform:rotate(-45deg);
}
.phone-fixed-button-close.active{
    opacity:1;
    visibility:visible;
    -webkit-animation:kfPhoneFixedClose 1s;
    animation:kfPhoneFixedClose 1s;
}
.phone-fixed-icon,.phone-fixed-pnumber,.phone-fixed-call-back,.phone-fixed-message{
    position:absolute;
    -webkit-box-shadow:0 0 30px rgba(var(--black-rgb),0.2);
    box-shadow:0 0 30px rgba(var(--black-rgb),0.2);
    -webkit-transition:all .2s ease-in-out;
    -o-transition:all .2s ease-in-out;
    transition:all .2s ease-in-out;
    border-radius:8px;
    text-align:center;
}
.phone-fixed-pnumber,.phone-fixed-message{
    display:none;
}
.phone-fixed-icon,.phone-fixed-call-back,.phone-fixed-message{
    background-color:var(--white);
    right:0;
    bottom:80px;
    color:var(--cl-primary);
    padding-bottom:0;
    padding:15px;
}
.phone-fixed-icon{
    text-align:left;
    width:290px;
    opacity:0;
    visibility:hidden;
    -webkit-transform:translateY(-70px);
    -ms-transform:translateY(-70px);
    transform:translateY(-70px);
}
.phone-fixed-pnumber{
    background-color:var(--cl-phone);
    color:var(--white);
    left:80px;
    bottom:14px;
    height:34px;
    line-height:34px;
    width:150px;
    -webkit-animation:kfPhoneFixedpNumber 2s infinite;
    animation:kfPhoneFixedpNumber 2s infinite;
}
.phone-fixed-call-back{
    height:180px;
    width:300px;
    opacity:0;
    visibility:hidden;
}
.phone-fixed-message{
    padding:15px 20px;
}
.phone-fixed-icon::before,.phone-fixed-call-back::before,.phone-fixed-message::before,.phone-fixed-pnumber::before{
    content:"";
    position:absolute;
    display:inline-block;
    border-right:8px solid transparent;
    border-left:8px solid transparent;
}
.phone-fixed-icon::before,.phone-fixed-call-back::before,.phone-fixed-message::before{
    bottom:-7px;
    right:25px;
    border-top:8px solid var(--white);
}
.phone-fixed-icon.active,.phone-fixed-call-back.active{
    opacity:1;
    visibility:visible;
}
.phone-fixed-icon.active{
    -webkit-transform:translateY(0);
    -ms-transform:translateY(0);
    transform:translateY(0);
}
.phone-fixed-item{
    margin-bottom:15px;
    cursor:pointer;
}
.phone-fixed-href{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    -ms-flex-wrap:wrap;
    flex-wrap:wrap;
    -webkit-box-align:center;
    -ms-flex-align:center;
    align-items:center;
    position:relative;
    overflow:hidden;
    -webkit-transition:all .4s ease-in-out;
    -o-transition:all .4s ease-in-out;
    transition:all .4s ease-in-out;
}
.phone-fixed-href::before{
    background-color:var(--cl-phone);
    content:"";
    position:absolute;
    right:0;
    bottom:-80px;
    width:2px;
    height:100%;
    -webkit-transition:all .3s ease-in-out;
    -o-transition:all .3s ease-in-out;
    transition:all .3s ease-in-out;
}
.phone-fixed-href:hover::before{
    bottom:0;
}
.phone-fixed-item i,.phone-fixed-item img{
    width:40px;
    height:40px;
    line-height:40px;
    margin-right:10px;
    border-radius:50%;
    -webkit-transition:all .4s ease-in-out;
    -o-transition:all .4s ease-in-out;
    transition:all .4s ease-in-out;
}
.phone-fixed-item i{
    color:var(--white);
    font-size:var(--fz-large);
    text-align:center;
}
.phone-fixed-href:hover i,.phone-fixed-item:hover img{
    -webkit-animation:kfPhoneFixedpNumberHover .4s infinite;
    animation:kfPhoneFixedpNumberHover .4s infinite;
}
.phone-fixed-item .icon-facebook,.phone-fixed-button-effect-facebook{
    background-color:var(--cl-facebook);
}
.phone-fixed-item .icon-zalo,.phone-fixed-button-effect-zalo{
    background-color:var(--cl-zalo);
}
.phone-fixed-item .icon-whatsapp{
    background-color:var(--cl-whatsapp);
}
.phone-fixed-item .icon-viber,.phone-fixed-button-effect-viber{
    background-color:var(--cl-viber);
}
.phone-fixed-item .icon-telegram{
    background-color:var(--cl-telegram);
}
.phone-fixed-item .icon-skype,.phone-fixed-button-effect-skype{
    background-color:var(--cl-skype);
}
.phone-fixed-item .icon-envelope-open,.phone-fixed-button-effect-envelope-open{
    background-color:var(--cl-email);
}
.phone-fixed-item .icon-call-out,.phone-fixed-button-effect-phone{
    background-color:var(--cl-phone);
}
.phone-fixed-item .icon-call-in{
    background-color:var(--cl-primary);
}
.phone-fixed-item .icon-wechat-src,.phone-fixed-button-effect-wechat{
    background-color:var(--cl-gray);
}
.phone-fixed-href:hover .phone-fixed-text-facebook{
    color:var(--cl-facebook);
}
.phone-fixed-href:hover .phone-fixed-text-zalo{
    color:var(--cl-zalo);
}
.phone-fixed-href:hover .phone-fixed-text-whatsapp{
    color:var(--cl-whatsapp);
}
.phone-fixed-href:hover .phone-fixed-text-viber{
    color:var(--cl-viber);
}
.phone-fixed-href:hover .phone-fixed-text-telegram{
    color:var(--cl-telegram);
}
.phone-fixed-href:hover .phone-fixed-text-skype{
    color:var(--cl-skype);
}
.phone-fixed-href:hover .phone-fixed-text-envelope-open{
    color:var(--cl-email);
}
.phone-fixed-href:hover .phone-fixed-text-call-out{
    color:var(--cl-phone);
}
.phone-fixed-href:hover .phone-fixed-text-call-in{
    color:var(--cl-primary);
}
.phone-fixed-href:hover .phone-fixed-text-wechat{
    color:var(--cl-primary);
}
.phone-fixed-title {
    font-weight: 600;
    margin: 0;
    font-size: 16px;
}
.phone-fixed-pnumber a{
    color:var(--white);
    font-size:var(--fz-normal);
    font-weight:600;
    letter-spacing:1px;
}
.phone-fixed-pnumber.active,.phone-fixed-message.active{
    opacity:0;
    visibility:hidden;
}
.phone-fixed-pnumber::before{
    bottom:12px;
    left:-12px;
    border-bottom:8px solid var(--cl-phone);
    -webkit-transform:rotate(-90deg);
    -ms-transform:rotate(-90deg);
    transform:rotate(-90deg);
}
.phone-fixed-call-back-title{
    color:var(--cl-phone);
    position:relative;
    font-weight:600;
}
.phone-fixed-call-back-input{
    height:36px;
    width:100%;
    padding:0 10px;
    border-radius:5px;
    border:1px solid var(--cl-phone);
    margin:15px 0;
}
.phone-fixed-call-back-button{
    background-color:var(--cl-phone);
    width:100%;
    height:36px;
    border:none;
    border-radius:5px;
    color:var(--white);
    font-weight:600;
    text-transform:uppercase;
}
.phone-fixed-call-back-close,.phone-fixed-message-close,.phone-fixed-pnumber-close{
    background-color:var(--cl-phone);
    color:var(--white);
    position:absolute;
    width:20px;
    height:20px;
    line-height:20px;
    border-radius:50%;
    cursor:pointer;
    text-align:center!important;
}
.phone-fixed-call-back-close{
    top:-10px;
    right:-10px;
}
.phone-fixed-message-close,.phone-fixed-pnumber-close{
    top:-8px;
    right:-8px;
}
.phone-fixed-message-content{
    display:-webkit-box;
    display:-ms-flexbox;
    display:flex;
    white-space:nowrap;
}
.phone-fixed-message-item{
    background-color:var(--cl-gray);
    position:relative;
    border-radius:50%;
    width:10px;
    height:10px;
    margin:0 2px;
    -webkit-animation:kfPhoneFixedMessageUpDown 2s infinite;
    animation:kfPhoneFixedMessageUpDown 2s infinite;
}
.phone-fixed-message-item:nth-child(2){
    -webkit-animation-delay:.1s;
    animation-delay:.1s;
}
.phone-fixed-message-item:nth-child(3){
    -webkit-animation-delay:.2s;
    animation-delay:.2s;
}
@media(min-width:768px){
    .phone-fixed-pnumber,.phone-fixed-message{
        display:block;
    }
}
@media(max-width:991px){
    .phone-fixed-icon{
        width:320px;
    }
}
@-webkit-keyframes kfPhoneFixed{
    0%,100%{
        -webkit-transform:rotate(0) scale(0.7) skew(1deg);
        transform:rotate(0) scale(0.7) skew(1deg);
        opacity:.3;
    }
    50%{
        -webkit-transform:rotate(0) scale(1) skew(1deg);
        transform:rotate(0) scale(1) skew(1deg);
        opacity:.3;
    }
}
@keyframes kfPhoneFixed{
    0%,100%{
        -webkit-transform:rotate(0) scale(0.7) skew(1deg);
        transform:rotate(0) scale(0.7) skew(1deg);
        opacity:.3;
    }
    50%{
        -webkit-transform:rotate(0) scale(1) skew(1deg);
        transform:rotate(0) scale(1) skew(1deg);
        opacity:.3;
    }
}
@-webkit-keyframes kfPhoneFixedClose{
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg);
    }
}
@keyframes kfPhoneFixedClose{
    100%{
        -webkit-transform:rotate(360deg);
        transform:rotate(360deg);
    }
}
@-webkit-keyframes kfPhoneFixed2{
    0%{
        -webkit-transform:rotate(0) scale(0.5) skew(1deg);
        transform:rotate(0) scale(0.5) skew(1deg);
        opacity:.1;
    }
    30%{
        -webkit-transform:rotate(0) scale(0.7) skew(1deg);
        transform:rotate(0) scale(0.7) skew(1deg);
        opacity:.5;
    }
    100%{
        -webkit-transform:rotate(0) scale(1) skew(1deg);
        transform:rotate(0) scale(1) skew(1deg);
        opacity:.1;
    }
}
@keyframes kfPhoneFixed2{
    0%{
        -webkit-transform:rotate(0) scale(0.5) skew(1deg);
        transform:rotate(0) scale(0.5) skew(1deg);
        opacity:.1;
    }
    30%{
        -webkit-transform:rotate(0) scale(0.7) skew(1deg);
        transform:rotate(0) scale(0.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 kfPhoneFixedMessageUpDown{
    0%,43%,100%{
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
    25%,35%{
        -webkit-transform:translate(0,-10px);
        transform:translate(0,-10px);
    }
}
@keyframes kfPhoneFixedMessageUpDown{
    0%,43%,100%{
        -webkit-transform:translate(0,0);
        transform:translate(0,0);
    }
    25%,35%{
        -webkit-transform:translate(0,-10px);
        transform:translate(0,-10px);
    }
}
@-webkit-keyframes kfPhoneFixedpNumber{
    0%,100%{
        -webkit-transform:translateX(0px);
        transform:translateX(0px);
    }
    50%{
        -webkit-transform:translateX(10px);
        transform:translateX(10px);
    }
}
@keyframes kfPhoneFixedpNumber{
    0%,100%{
        -webkit-transform:translateX(0px);
        transform:translateX(0px);
    }
    50%{
        -webkit-transform:translateX(10px);
        transform:translateX(10px);
    }
}
@-webkit-keyframes kfPhoneFixedpNumberHover{
    0%,50%,100%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg);
    }
    25%{
        -webkit-transform:rotate(10deg);
        transform:rotate(10deg);
    }
    75%{
        -webkit-transform:rotate(-10deg);
        transform:rotate(-10deg);
    }
}
@keyframes kfPhoneFixedpNumberHover{
    0%,50%,100%{
        -webkit-transform:rotate(0deg);
        transform:rotate(0deg);
    }
    25%{
        -webkit-transform:rotate(10deg);
        transform:rotate(10deg);
    }
    75%{
        -webkit-transform:rotate(-10deg);
        transform:rotate(-10deg);
    }
}